• somthing..

• somthing..

• somthing..

• somthing..

• somthing..

• somthing..

• somthing..

• somthing..

• somthing..

• 현재 제작한 서버들, db aws에 모두 배포 완료~! image Untitled

• rds때문에 개고생했는데.. 다은님이 만들어주신 rds 덕분에 편히 해결했다 ᅲᅲ
  • 내꺼는 왜 안되는지 아직도 의문, 언젠가 세팅 초기화 해보고 시도해봐야겠다.

• ec2 내에서 redis 설치하는법
  • https://wookgu.tistory.com/26
• yml 파일에 ''' ''' 스타일의 주석을 하니 윈도우에서는 먹혔는데.. ec2내에서는 오류가 났다. 참고하고 주석은 # 키워드 사용하자.

• ERD 정리좀하자! 시그널링 서버와 채팅서버 연결할 수 있게 구성도 생각..

• 22:00~00:00 코어 스터디
• 메인 페이지 구현 (메인 페이지에 요소들은 어느 정도 다 구현이 된 듯 하다..)
  • 디엠에서 통화 기록 보여주기 메시지 생성 Untitled
  • styled.d.ts 생성하기
  • 스크롤 설정 (메인 친구 목록, 탭바 친구 목록, 메시지 부분)
  • 메시지 위 호버 버튼 위치 문제 해결
    • before image
    • after image

• UI 구현을 하니 정신이 혼미해진다. 빨리 모두 구현하고 백엔드와 연결도 하고 싶다.

styled.d.ts에 스타일들을 선언해주면 typescript가 타입 추론을 할 수 있도록 도울 수 있다.

원래 theme.ts 파일에 모든 값들에 대한 타입을 작성해주었는데, styled.d.ts를 만들어서 그 코드들을 제거해주었다!

원래 아래와 같이 작성해주었다면,

export type FontSizeType =
 | "xxs"
 | "xs"
 | "sm"
 | "base"
interface FontSize {
	xxs: string;
	xs: string;
	sm: string;
	base: string;
}
...
interface ThemeType {
 fontSize: FontSize;
}
const theme: ThemeType = {
 fontSize: {
 xxs: "0.625rem",
 xs: "0.75rem",
 sm: ".875rem",
 base: "1rem",
 },
...

styled.d.ts를 생성하면 FontSize가 모두 필요없어진다. (깔끔)

🕹️styles/styled.d.ts

import "styled-components";
declare module "styled-components" {
 export interface DefaultTheme {
 fontSize: FontSizeType;
 backgroundColor: BackgroundColorType;
 color: ColorType;
 borderColor: BorderColorType;
 statusColor: StatusColorType;
 }
}

styled-components 모듈의 DefaultTheme라는 이름으로 인터페이스를 생성하여 타입을 명시한다.

🕹️styles/theme.ts

import { DefaultTheme } from "styled-components";
const theme: DefaultTheme = {
 fontSize: {
 xxs: "0.625rem",
 xs: "0.75rem",
 sm: ".875rem",
 base: "1rem",
...

그리고 DefaultTheme를 import하고, 테마 안에 선언된 타입에 맞게 스타일을 작성한다.

• 서버 페이지에 필요한 기능들 구현하기