🛠️ 프로젝트/[Taskify] - 협업 툴(일정 관리 시스템)

Zustand와 쿠키를 활용한 안전한 로그인 상태 관리☄️ 문제점: 새로 고침 시 로그인 상태 유지 안됨현재 로그인 후 받은 사용자 정보를 Zustand의 userStore에 저장하여 상태를 관리하고 있습니다.하지만 새로 고침 시 상태가 초기화되어 로그인 상태가 유지되지 않는 문제가 발생했습니다.토큰이나 사용자 정보를 로컬 스토리지나 세션 스토리지에 저장하는 것이 필요할지 고민이 되었습니다. 🚀 고민로그인 상태 유지를 위해 어떤 저장 방식이 가장 적합할까?zustand를 사용할 때 로컬 스토리지나 세션 스토리지를 추가로 활용해야 할까, 아니면 다른 방법을 고려해야 할까?쿠키를 사용한다면 어떻게 안전하게 토큰을 저장하고 사용할 수 있을까? 상태 관리의 기본 문제☝🏻 여기서 잠깐zustand는 메모리 상..

우선 ,Taskify 프로젝트를 개발하면서, 에러 처리 로직이 여러 컴포넌트에 분산되어 있음을 알게 되었습니다. 각 컴포넌트에서 중복된 방식으로 에러를 처리하고, 에러 메시지를 표시하는 방법이 일관되지 않아 사용자 경험이 저하되는 문제를 겪었습니다. 😞 이 문제를 해결하기 위해, useErrorModal이라는 커스텀 훅을 만들어 전역적으로 일관된 에러 처리 방식을 구현했습니다.이를 통해 에러 처리 로직을 통합하고, 사용자에게 서버에서 발생한 에러 메시지를 명확하게 전달할 수 있게 되었습니다.  ☄️ 문제 상황 - 에러 처리 로직의 중복과 일관성 부족프로젝트 초기에는 각각의 컴포넌트에서 에러를 개별적으로 처리하고 있었습니다.예를 들어, API 요청 실패 시 발생하는 에러나 사용자 입력에서 발생하는 에러를..

Zustand를 사용하여 로그인 상태와 유저 정보를 효율적으로 관리하려는 고민Taskify 프로젝트를 개발하면서, 여러 컴포넌트에서 사용되는 인증 상태 관리가 점점 복잡해지며 코드가 중복되는 문제가 발생하였습니다.인증 상태를 관리하는 코드가 각 컴포넌트에 분산되어 있어 유지보수가 어려워지고, 인증 관련 로직을 수정할 때마다 여러 곳을 수정해야 하는 번거로움이 있었습니다. 이 문제 해결을 위해서 Zustand를 사용하여 인증 상태를 전역적으로 관리, 인증 관련 로직을 authStore 라는 별도의 상태 관리로 분리하여 재사용 가능하고 효율적인 방식으로 개선하였습니다. 이번 포스팅에서는 이 과정을 공유하며, Zustand를 이용한 인증 상태 관리 방법과 코드 중복을 줄일 수 있었던 경험에 대해서 작성해보겠습..

짜잔 🎉▼ Lighthouse Performance 분석 [web] Lighthouse 웹페이지 성능분석 (Performance)허겁지겁 코드를 작성하고 일정에 쫓겨 디자인을 따라하기에 급급해 성능따위 무시했던 신입 1년.. 최근 개발에 많이 익숙해지면서 성능 및 최적화에 흥미가 생겼습니다. 그중 제일 쉽게 사용할phrygia.github.io 🕊️ 마무리 : 2주간의 중급 프로젝트 회고Taskify 프로젝트를 시작한 지 얼마 안 된 것 같은데, 벌써 2주간의 여정이 마무리되었습니다. 🎉프로젝트 발표도 무사히 끝냈고, 지금은 프로젝트가 완료된 후 최종 회고 포스팅을 하려고 합니다. 😊이번 프로젝트를 통해 많은 것을 배우고, 팀원들과 함께 문제를 해결해가며 성장할 수 있었던 시간이었어요. 그럼 Ta..

🍂 10월 중순, 팀 프로젝트 첫날 기록 - 시작오늘은 중급 프로젝트의 첫날이다. 드디어 Part 3 팀원들과 함께 프로젝트를 시작하게 되었는데, 우리팀은 첫 회의를 통해 협업 툴로 사용할 수 있는 일정 관리 시스템 “Taskify”라는 주제를 선정하게 되었다. 💡 주제 선정 이유Taskify를 주제로 고른 이유는 아주 간단하다 ㅎㅎ! 일정 관리 시스템은 일상에서 자주 사용되는 서비스인 만큼, 사용자의 편의를 고려한 여러 기능을 구현해볼 수 있을 것 같았다. 게다가 프로젝트의 규모가 커서 다양한 컴포넌트를 만들어보는 좋은 기회라고 생각했다. 팀원들도 모두 동의해주어 기분 좋게 프로젝트를 시작할 수 있었다. 😊 🛠️ 프로젝트 세팅 과정첫걸음으로, 깃허브에 프로젝트 레포지토리를 만들고 팀원들을 초대했..