Develop Together, Grow Together, Detto

• 디토는 개발자를 위한 사이드 프로젝트 팀 매칭 플랫폼입니다.
• 현재 모집 중인 사이드 프로젝트들을 포지션 별로 확인할 수 있습니다.
• 프로젝트 모집 글에 지원하고 초대받는 과정을 통해 더 좋은 시너지를 낼 수 있는 팀원을 만날 수 있습니다.

➡️ Detto 서비스 둘러보기 (데스크탑/모바일 환경에서 이용 가능)

🏗 아키텍처

📍 주요 기능 중 지원하기 로직 플로우

아래 플로우에 대한 상세 설명은 발표회에서 들으실 수 있습니다. 🙂

🛠️ 기술적 의사결정

1. SPA의 장점인 매끄러운 페이지 전환
2. 컴포넌트 재사용을 통해 개발의 효율성을 높이고 유지보수를 용이하게 할 수 있음

위와 같은 이유들로 Vanilla JS가 아닌 React를 채택 | | TypeScript | 명시적인 타입 지정으로 코드의 안전성을 높이고 발생할 수 있는 런타임 에러를 사전 방지하기 위해 채택 | | Recoil & React Query | 프로젝트의 규모와 3주간의 개발 기간을 고려했을 때,

1. 상대적으로 보일러 플레이트가 적음
2. 리액트 문법과 유사하기 때문에 러닝 커브가 낮음
3. React Query의 캐싱을 통해 서버 리소스 절약 가능

위와 같은 이유들로 클라이언트 상태 관리는 Recoil, 서버 상태 관리는 React Query를 채택 | | Emotion | 개발의 효율성을 따져 css-in-js 중 번들 사이즈를 고려하여 가장 크기가 작은 Emotion 채택 | | React Helmet Async | SPA인 React의 SEO에 취약한 특성을 보완하기 위해 선택 | | Firebase Firestore | noSQL 비관계형 데이터베이스로, 데이터 변경이 많은 초기 개발 단계 또는 추후 새로운 기능을 추가할 때 데이터 필드를 추가/제거하기 용이하다는 장점이 있음. 그 중 접근성이 좋고 규칙이 간단하며 구글에서 제공하기 때문에 안정성이 높은 Firestore 채택 | | Yarn Berry | npm, yarn과 비교하여 패키지 용량 감소와 작업의 편리성이 높다는 점에서 Yarn Berry 채택 |