TIL 230108 내일배움캠프 최종 프로젝트 -1

두두맨·2024년 1월 8일

내배캠

벌써 내일배움캠프 React 최종 프로젝트가 시작됐다.

짧은 시간 안에 목표한 기능을 모두 구현했어야 했던 기존의 프로젝트들과는 다르게

무려 한 달짜리 프로젝트인만큼 각자 맡은 기능을 좀더 완성도 있게 마무리 할 수 있는

좋은 기회라고 생각한다. supabase를 써본 적이 없어서 걱정 반 설레임 반이지만

성공적으로 마무리했으면 좋겠다.

프로젝트 개요

미대생들의 비싼 미술용품을 중고거래, 공동구매로 이어주는 서비스

프로젝트에 참여하시게 된 디자이너님의 의견이었고, 팀원들의 만장일치 동의로 진행하게 되었다.
디자이너님의 대학 재학 시절에는 학기 초에 구매한 재료나 도구가 학기 말이 되면 남게 되는 일이 잦았는데, 재료를 어딘가에 처분하기도 애매하고 처분한다고 해도 같은 과나 같은 학교 내의 지인과 물물교환을 하는 것이 전부였기 때문에 미대생들끼리 사용하고 남은 재료들이나 중고 미술 도구들을 자유롭게 판매 할 수 있는 어플리케이션이 있었으면 좋을 것 같다고 느끼셨다고 한다. 찾아 보니 그런 웹사이트나 어플리케이션이 진짜 없어서, 우리가 만들면 좋을 것 같다 라는 생각과 함께 시작하게 되었다.

와이어 프레임

본 와이어 프레임은 구상 단계 와이어 프레임이다. 디벨롭된 와이어 프레임은 차차 업로드 하는 걸로!

개발 환경

React

react-query와 redux toolkit을 사용해 상태 관리를 하게 될 것 같다.

TypeScript

알 수 없는 오류 방지와 타입 안정성을 위해 사용하게 되었다.

Supabase

관계형 데이터베이스로서 한 프로젝트에 다양한 기능을 담을 수 있다는 점이 매력적이어서 채택하게 되었다. RealTime 기능으로 실시간 알림, 실시간 채팅을 구현할 수도 있고,
foreign key, subscribe 활용으로 데이터 상호 연결성 측면에서 유리하다고 느꼈다.

Styled-components

가장 익숙하고 편한 css 스택을 사용하는 것이 낫다고 판단했다.
Tailwind css는 코드의 양이 줄고 유지, 보수 측면에서 이점이 있다고는 하지만
절대적인 러닝커브가 있어서 익숙해지는데 시간이 좀 걸린다고 느꼈기 때문이다.

핵심 기능

로그인, 회원가입

판매글 작성(중고물품)

실시간 알림, 채팅

마이페이지

로그인 / 회원가입은 하나로 묶어 오로지 소셜로만 가능하도록 했다.
Supabase에서 제공하는 카카오톡, 구글, 페이스북, 애플 api를 이용하여
각 서비스에서 다이렉트로 회원가입 및 로그인 절차를 받아 로그인 할 수 있도록 할 계획이다.
판매글 작성 부분은 중고물품만 가능하도록 결정했다. 초기에는 공동구매 페이지도 생성할
계획이었으나 실효성이 떨어질 것 같다는 의견으로 계획을 수정했다.
대신 핵심 기능을 빠르게 완성 후 커뮤니티 페이지의 중요도를 키워 작업할 생각이다.
Supabase에서 제공하는 Realtime 기능을 활용하여 내가 등록한 글의 상태가 업데이트 되거나, 내가 댓글 단 글이 업데이트 될 때, 채팅방 상태가 업데이트 될 때 실시간으로 알림을 받아볼 수 있는 기능을 구현하기로 했다. 가장 어려운 부분이지 않을까 생각한다.
마이페이지는 최상단에 내 정보 및 내가 판매한 상품 / 구매한 상품 / 커뮤니티에 작성한 글
위 세가지를 탭 방식으로 선택할 수 있고 선택된 탭에 따라 필터링한 데이터를 렌더링 할 수 있도록 구현하기로 했다.

추가 기능

신고 페이지

커뮤니티

Admin 페이지

신고페이지에는 사기 또는 범법 행위 판매자 / 구매자에 대한 신고를 할 수 있는 페이지로 구성하기로 했다.
커뮤니티는 자유롭게 소통하고 다양한 정보를 교류 할 수 있도록 페이지 내에서 글과 댓글 작성, 좋아요 기능이 가능하도록 구현하려고 한다. 댓글의 경우는 간단한 편이지만 대댓글부터는 조금 개념이 복잡해진다는 이야기가 있어서 그 부분은 많이 찾아보고 진행을 해야 할 것 같은 느낌이 든다...
Admin 페이지는 신고된 구매자 / 판매자에 대한 제재나, 약관을 위반한 커뮤니티 글에 진행한 삭제나 경고 조치를 모아 두는 페이지로 구성할 것 같은 느낌인데 이 부분은 명확히 결정된 것이 아니기 때문에 조금 더 논의가 필요하다. 페이지로 구성되는 것이 아니라 모든 글에 접근 가능한 Admin 계정을 생성하여 제재 목록을 별도의 페이지로 구성해 사용자들에게 보여줄 수 있는 페이지로 만드는 것이 사용자 경험 측면에서 편리하다고 느끼지 않을까 하는 생각이 든다.