프로젝트 소개

프로젝트명 : 셰르파 Sherpa

남녀노소 이용 가능한 전국 여행 관광 플랫폼

MVP 시연

시연 링크

서비스 아키텍처 구조

저희 팀 MVP 구조에서의 Model 은 Recoil 과 ReactQuery로 이루어져있습니다. Recoil은 전역상태관리를, React Query는 서버상태관리를 하며 서버와의 통신은 axios 라이브러리를 사용하여 Firebase 와 통신을 합니다.

그리고 View 에서는 사용자 인터페이스를 표시하고 사용자 입력을 처리하기 위해서 React Router, React Hooks 등을 사용하고 있습니다. View 단에서 이벤트 발생 시 Presenter 에서는 전달 된 이벤트들을 Model과 상호작용 후에 다시 View 로 데이터를 전달 해 주는 구조입니다.

기술적 의사결정 & 코드 설명

Recoil , react-query를 사용한 이유

Redux의 보일러플레이트 문제

기존 리덕스에서 상태관리를 하려면 기본적인 client단 상태관리 로직인데도 아래처럼 초기세팅을 해줘야 할게 많습니다. 전역state가 추가 될 때 마다 store에 reducer도 넣어줘야 되고

또 서버와의 통신을 하기위해서는 reateAsyncThunk를 써야하는데 로직이 createAsyncThunk, extraReducers 등을 통해 일일히 초기 세팅을 해줘야 해서 불편한 감이 있었습니다.