드디어 리엑트 미션까지 마무리했다!
처음 배울 땐 재밌었던 것과는 다르게 미션은 막막했지만 그래도 해냈다는 것에 의의를 두고 내 자신을 토닥토닥해주고 싶다.
⚒️
미션에 사용한 라이브러리, 툴
전역 상태 관리 : contextAPI
패키지 매니저 : npm
css : tailwind, daisyUI
개발 툴: vite
사용한 모든 라이브러리들을 추가하면 더 많겠지만 대표적으로는 저렇게 사용했다.
ContextAPI
contextAPI를 사용한 이유는 솔직하게 recoil에 대한 많은 이해가 부족해서였다. 관련 강의를 제대로 듣지 않아서 초반에는 스스로 찾아보며 공부를 했었는데 제대로 사용할 줄 모르다보니 어려움이 있어서 익숙한 ContextAPI를 사용했다. 단방향으로 흐르는 구조로도 미션 수행 자체에는 구현할 때 어려움이 없었다. 또 규모가 작다보니 업데이트 시에 계속 렌더링 되는 것도 큰 문제가 되진 않았다. 하지만 더 큰 프로젝트를 위해 recoil을 꼭 공부해야겠다는 생각이 든다.
npm
패키지 매니저로는 npm을 사용했다. yarn을 사용하려고 두가지의 장단점을 찾아보는데 어떤 글에서 둘 다 사용이 처음이라면 npm을 사용하는 것이 좋다며 속도도 큰 차이가 없다고해서 npm을 선택했다. 아주 처음 사용하는 것은 아니지만 처음 프로젝트 시작 당시 npm을 사용해 본 경험이 적어서 npm을 선택하게 되었다.
하지만 프로젝트 말미에 vercel로 배포하기 위해 팀원들의 도움을 받아 yarn을 설치했는데 npm이랑 비슷한 것 같아서 이제부터는 사용 안 해보고 요즘 다른 사람들도 많이 사용하는 yarn을 사용해 볼 계획이다.
Tailwind / DaisyUI
두 라이브러리 모두 몰랐었는데, 미션하면서 강사님께서 추천해주셔서 사용해보게 되었다. 이 두 라이브러리는 css를 위한 것이다. 우선 Tailwind를 사용하면 클래스 네임을 태그에 적용하는 방식으로 빠르고 간편하게 css 수정이 가능한데, DaisyUI는 이 Tailwind의 클래스 네임을 조합해서 UI를 조각조각 제작해둔 사이트이다. 예를들어 케러셀, 버튼, 별점 등등 좋은 UI가 많다. (사용하다보면 터미널에서 자주 만나는 데이지 아이콘🌼도 귀엽다) 당연히 기능 구현은 되어있지 않다. Tailwind 처음 사용시 많이 헤맸는데 검색하기에 width, display 등등 검색하면 해당 기능에 관한 클래스 명들이 잘 나온다.
vite
처음엔 요구사항을 읽고도 vite에 대해 잘 몰라 CRA로 열심히 구현하다가 강사님의 미션을 위한 QnA시간에 vite에 대해 알게되어 급하게 vite를 사용했다. 속도도 빠르고 간편한데다가 나같은 초보에게 필요한 공식 문서도 잘 작성되어있어서 좋았다. (홈페이지 디자인도 가독성에 영향을 미치는 것 같다)
배운 점
이번 미션을 통해서 여러 라이브러리에 대해 어떻게 사용하고 왜 필요한지 배울 수 있었던 것 같다. 그리고 전에는 중요하게 생각 못 했던미디어쿼리가 신경이 많이 쓰였다. 친구와 가족에게 배포된 링크를 보내주려고하다가 카카오톡으로 공유하면 다들 모바일로 링크를 접속할 것 같았다. 그래서 모바일 버전으로 다시 꼼꼼하게 보고 수정을 했는데 수정 하고나면 계속 뭔가가 거슬려서 수정했던 것 같다. 모바일로 접속하는 사람이 많은 요즘에 어쩌면 UX/UI에서 젤 중요한 부분이 아닐까? 생각이 될 정도였다.
또 구현하다보니 구현하자니 귀찮고 구현을 안 하자니 사용자에게 불편할게 뻔히 보이는 것들이 있었다. 작은 부분이었지만 넘어갈까 하다가 도저히 나도 불편해서 넘어가지 못하고 고친 부분이 많았는데 그런 부분 하나하나를 빼놓지 말아야겠다는 다짐을 또 한 번 하게 된 것 같다.
그리고 팀원들에게 배운 점도 있었다. 같이 진행상황도 공유하고 도와주면서 제 일도 아닌데 선뜻 도와주고 같이 고민해줘서 배포까지 완료할 수 있었던 것 같아서 나도 다른 사람이 어려워하고 고민할 때 같이 왜 그런지 깊게 생각하고 그냥 넘어가지 않는 자세를 가져야겠다는 생각이 든다. 그 과정에서도 분명 배울 점이 있을 것 같다. 💪
이제 곧 개인 프로젝트, 팀 프로젝트 시작할 것 같은데 그 전까지 부족한 부분 보충하고 또 어떤 프로젝트 해야할지 고민하는 시간 가질 것 같다..! 끝까지 화이팅
