항해99 3주차 주특기 기본 - 날짜별 별점 누르기 + (캘린더 일기 만들기)

이 글은 회고록입니다.

 

 

항해99 3주차가 시작되었다. 다시 팀이 바뀌었으며, 새로운 마음으로 주특기를 배우는 주이다.

이번주 과제는 이렇다.

- 한 주의 기분 상태가 어떤지 별점으로 나타내는 페이지 만들기

 

나는 더 나아가 캘린더를 누를 시 누른 날짜의 일기와 기분을 나타내고 한 주의 일기를 요약한 데이터를 Accordion 형식으로 나타내는 캘린더 사이트를 만들 예정이다.

 

현재까지 구현한 것은 이렇다.

 

UI 는 아직 제대로 설정하진 않았다.

 

 

캘린더를 클릭 시 => Redux 상태관리를 통해 클릭한 날짜 State를 관리한다.

이유는 부모 Props를 자식 컴퍼넌트에게 전달하는 방식은 과거 너무 많이 사용했으며,

Redux 사용 방식에 더 친숙해지기 위해서도 있으며,

한 페이지에 컨테이너와 컴퍼넌트들로 구성할 예정인데, 컨테이너 Prop을 자식 컴퍼넌트에게 전달하기까지

너무 많은 코딩이 소요되기 때문이다.

 

interface DDay {

   date: 175135423154

       . . . . . .

}

 

const Card: React.FC<DDay> = ({date, ......}) => {}

 

이런 코드를 무수히 반복해야된다는 점에서, 또 계속 전달해야한다는 점에서 Redux를 꼭 학습할 필요성이 있었다.

 

캘린더 클릭 시 모든 데이터는 파이어베이스를 통해 데이터가 전달될 예정이며,

현재 id 값을 Date => getTime() 형식으로 진행할 예정이다.

 

 

https://github.com/act99/hanghae-week3

GitHub - act99/hanghae-week3: hanghae-week3 / 항해 3주차 주특기 기본