Total8 [Navbar] Redux-toolkit 활용: 로그인/비로그인 구분, 프로필 관리 회원가입 및 로그인 화면을 제외하고 나브바는 항상 좌측에 두자고 wireframe을 짰다.처음에는 디자인 및 스타일 구현에 시간을 많이 쓰고 싶지 않아서 Matine UI를 사용하기로 팀원들과 결정을 했다. Vite도 지원하니 괜찮겠다 싶어서 골랐는데, 나중에 조금씩 수정하려고 보니 이 컴포넌트는 emotion을 쓰고 있었다.우리는 styled-components를 쓰기로 한 상황이었고, 또 기존 코드에 맞춰서 수정하는 게 새로 만드는 것보다 시간이 더 걸릴 거 같았다.그래서 디자인 참고는 하되, 그냥 새로 만들자고 결정하게 되었다. 최상단은 비회원일 시 로그인 페이지로 가는 로그인 버튼, 회원일 시 본인 프로필 사진과 닉네임을 보여주도록 구현했다.그리고 원래 홈화면에 넣으려고 했던 미세먼지 알림을 그.. 2023. 6. 9. 프로젝트 시작하기: Vite + React in TypeScript + ESLint + Prettier 첫 팀 프로젝트에서 CRA를 사용하지 않고 Vite를 사용하여 프로젝트를 세팅해보았다. CRA(Create-React-App)는 여러 라이브러리나 패키지 설치 및 설정을 따로 할 필요 없이 바로 시작할 수 있는 환경을 제공해주기 때문에 간편하다는 장점이 있다. 하지만 사용하지 않는 모듈들도 많이 담고 있어 앱 자체가 크고 무겁다는 단점이 있다. 또한 번들러로 webpack을 사용하는데, webpack은 다른 번들러에 비해 속도가 느리다.반면 Vite는 CRA보다 더 빠른 개발 환경과 효율적인 프로덕션 빌드를 제공한다.https://juhyojin.tistory.com/2 Vite를 사용하는 이유Vite를 사용하는 이유는 빠른 개발 환경과 효율적인 프로덕션 빌드 때문이다. 빠른 서버 구동: esbuild로.. 2023. 6. 6. Previous 1 2 Next