트위터 기능구현
깃허브 알고리즘 2문제 제출
시원해 프로젝트 피그마 작성
https://www.figma.com/file/JT659mREwNwo7NyxDkgMud/Untitled?node-id=11%3A488
짭팡 프로젝트 프론트 역할 분배 및 레이아웃 페이지 1개 클론
노마드 리액트 쿼리 파트 수강
트위터의 프로필 페이지 중 좋아요한 트윗들을 조회하는 기능 구현 하였다.
트윗 목록들의 데이터를 불러들일 때, intersection observer api를 적용한 인피니트 로딩으로 불러들인다.
문제는 트윗 목록들을 불러들이는 코드가 벌써 3번이상 반복되어서 이를 새로운 컴포넌트로 리팩토링 해야 할것 같다. 프로필 페이지를 수요일 내로 끝나는걸 목표로 하자 .. (아마존 S3에 프로필 이미지 저장도 구현해보자)
시원해 피그마 작성하는데 너무 오랜시간이 걸려서 하루 루틴이 깨져버렸다 ... 물론 툴에 대한 숙련도 문제도 있지만, 너무 필요이상으로 디자인을 신경쓰는 버릇을 버려야 한다(그 시간에 자바스크립트 기본기를 조금이라도 더 익히자 !!)
짭팡 프로젝트의 역할을 나누고 프론트엔드 파트 깃저장소를 처음 Push 하였다. 나는 쇼핑몰의 결제 및 상품 페이지를 맡기로 하였다. 어차피 로그인 회원가입은 다른 프로젝트에서도 많이 시도해볼수 있으니 오히려 좋다. vite + typescript + react + eslint + prettier가 잘 적용된 boilerplate를 다행히 찾게 되어 세팅하는데 크게 힘들지는 않았다.
다만, prettier 및 eslint 옵션 하나하나가 어떤의미를 가지는지 파악하지 않고 무지성으로 쓰려고 한건 반성하고 있다. 적어도, 이번 주말에 각각의 옵션이 무엇을 의미하는지 검색하고 정리해보자
리액트 쿼리 데이터 페칭을 하는데 있어 파워풀 하다는 소문이 있었고 리덕스-툴킷의 createAsyncThunk를 대체하기 위해서 짭팡 프로젝트에서 사용하기로 하였다. 리덕스의 본래 역할인 전역 상태관리에 store가 비대해지고 코드가 복잡해지는 문제를 해결하기 위해 나왔다니 더욱 더 기대가 된다.
뭐 리덕스 측에서도 위의 단점들을 개선하기 위해 rtk query가 나왔다는데, 고건 나중에 한번 사용해보자.