[TIL] 20210708 - 항해 32일차

Jihyun·2021년 7월 8일
0

항해99

목록 보기
29/46
post-thumbnail

리액트 심화 과제(매운맛) 끝!!

👩🏻‍🎓 React 심화 과제 - Calendar

제출한 과제 링크

고칠 것이 너무 많아 보이는데 더 이상 손대면 오늘 안에 제출 못 할 것 같아서 일단 제출했다.

이번 과제로 배운 것

1. 날짜, 시간을 다루기
구글 캘린더는 원래부터 그 모양 그대로 존재했을 것만 같았다.
하지만 이번에 캘린더를 처음부터 만들어보니 그 얼마나 대단한 서비스인지🤦🏻‍♀️

나름대로 뚝딱뚝딱 만들어봤지만 며칠만에 기존의 캘린더들을 따라잡기는 불가능이었다.
연속 일정 기능이라던가, 매년 반복되는 기념일 같은 기능은 그냥 정말 생각만 했다😅

수정 기능은 아직도 만들걸 싶긴 하다.

momentJS가 그냥 쓱 보면 날짜, 시간을 편하게 가져오는 패키지인데 그 것만으로 이렇게 달력을 만들 수 있다는 점을 새삼 깨달았다.

그간 지나쳐 온 많은 패키지들이 단순히 표면적으로 보이는 역할이 아니라 더 대단한 서비스, 기능을 창조해 낼 재료라는 생각이 들어 아쉽고 아깝다😂

2. 컴포넌트 나누기
전에는 컴포넌트를 강의에서 나누라는 대로 나눠 쓰고, 왜 그렇게 하는지도 깨닫지 못했다.
하지만 이번에 강의도 없고 와이어프레임, 기능만 써있는 과제를 하면서 스스로 왜 나눌 필요가 있는지, 나누지 않으면 "내가" 얼마나 힘들어지는지 깨달았고 좀 더 리액트스러운 코드를 배우려고 노력하게 되었다.

3. styled-component
애증의 styled-component...
CSS in JS는 보기 편하지만 지저분해지기 쉽다. 최대한 theme이나 mixin을 만들어서 코드량을 줄여보려는 노력을 엄청 하게 되었다.
하지만 명확한 디자인도 없는 상태에서는 결국 버튼 모양만 10개 나오게 되는 참사 ㅎㅎㅎ

그래도 theme, css 사용, props로 조건부 스타일링 하는 것을 계속 반복했더니 어느새 styled-components 적으로 생각하고 있는 걸 발견했다.
이게 바로 반복의 힘..

앞으로도 CSS in JS를 쓰게 될 지는 모르겠지만 사용하게 된다면 금방 공식문서보고 사용할 정도는 된 것 같다😆

profile
Don't dream it, be it.

0개의 댓글