오늘 배운 것
1. 넷플릭스 리뷰 커뮤니티 - 댓글 수정 및 댓글 무한스크롤 기능 구현
댓글 목록 컴포넌트에서 각각의 댓글 Item들을 별도의 컴포넌트로 분리한 뒤, 수정 기능을 구현했다. react-infinite-slider를 이용해서 무한스크롤 기능도 구현 완료했다. 중간에 이유를 알 수 없는 오류가 자꾸 발생해서 고생했는데, 전부 오타 혹은 함수명 지정을 잘못한데에서 오는 에러였다. fetchBoardComments를 fetchBoards로 쓴다던가, page를 pages로 쓴다던가..
2. 넷플릭스 리뷰 커뮤니티 - 메인 랜딩페이지 제작
컨텐츠를 다루는 서비스는 컨텐츠 외적인 요소가 최대한 간결해야 한다고 생각한다. 랜딩 페이지를 어떻게 만들까 한참 고민하다가, 영화라는 이미지를 강조하기 위해 넷플릭스 키컬러와 어울리는 분위기의 사진과 텍스트만으로 구성하기로 결정했다.
메인페이지에서는 layout의 banner와 navigation이 안보이게 설정하고, 메인페이지에서만 노출되는 navBox를 헤더에 달아줬다. (조건부 렌더링으로 지정된 url에서만 보이도록 작업함.) 심플한 구성으로 가다보니 심심해보이지 않으려면 애니메이션을 잘 주어야겠다 싶더라. 이런 저런 것들을 시도해보다가 결국 svg text stroke와 text-shadow를 이용한 애니메이션으로 결정했다. 색수차 효과처럼 보이는 것을 의도했는데, 실제로 사용자들에게 그렇게 느껴질지는 잘 모르겠다. (자고 내일 다시 보면 좀 감이 오겠지)
3. Javascript - reduce() !!
처음에는 그렇게 외계어같던 reduce도 이제는 조금 알 것 같다. 반복학습 짱!
앞으로 할 것
- Javascript 메소드 정리 : 정리해야지.. 하고 To do list에 올려만 놓고 아직 포스팅하지는 않은 메소드와 함수가 많다. 하루에 단 하나씩이라도 꾸준히 해서 목록을 줄여나가자.
- 게시판 배너 애니메이션 / 게시판 글쓰기 페이지 css 수정
'Journal > Today I Learned' 카테고리의 다른 글
| TIL - 2022.02.07 월요일 (0) | 2022.02.07 |
|---|---|
| TIL - 2022.02.04 금요일 (0) | 2022.02.05 |
| TIL - 2022.01.28 금요일 (0) | 2022.01.28 |
| TIL - 2022.01.27 목요일 (0) | 2022.01.27 |
| TIL - 2022.01.26 수요일 (0) | 2022.01.26 |