이번 메인플젝을 끝으로 6개월간의 코드스테이츠 부트캠프 교육이 끝이 난닷 🫠
메인플젝은 2022.09.08(목)~10.12(수) 약 4주간 FE 2, BE 2 총 4명의 팀원으로 진행되는 플젝! 💻
본격적인 개발 구현에 앞서 일주일간의 기획 기간에 노션에 기록했던 회고록들을 모아모아 ✍️
🗓 22.09.08(목)
🔥 TODO
- 오전에 메인플젝 주제 아이디어 공유 및 선정
- 13:30~16:00 회의 (플젝 기획 파트 - 상세 기능 정하기, 대략적인 요구사항정의서 작성)
- 회의록 내용 정리
- github repository
README.md작성 - github repository client 파트 기초 세팅
# 설치한 라이브러리들 npm i @reduxjs/toolkit redux react-redux npm i react-router-dom npm i styled-components npm i styled-reset npm i axios npm i json-server npm i dotenv react-dotenv// package.json - json-server start 명령어 추가 "json": "cd data && json-server --watch data.json --port 3001"
🐼 MEMO
메인 플젝 주제 아이디어로는 아래와 같이 약 8가지 정도가 나왔다.
각 주제에 대해서 필요한 기능들을 이야기해보는 과정에서캠핑 예약 서비스를 주제로 선정했다!
캠핑족이 점점 늘어가고 있는 현재 시국과도 알맞는 주제같기도,,👀
현재 캠핑 예약 서비스가 여럿 존재하기는 하지만 일단 예약 기능들을 구현해보는 것에 의의를 두기로 하고 주제 선정 완료✨
🤔 주제 아이디어 공유
- 캠핑장 예약 서비스
- 같은 동네 공구 사이트
- 서브웨이 키오스크 & 결제 API를 활용한 결제 서비스
- 블로깅 서비스 사이트
- 관광 정보 사이트
- 예약 사이트
- 리뷰 사이트 (ex. 도서 …)
- 대중교통 정보 사이트
🏕 캠핑장 예약 서비스에 필요한 기능들
- 로그인 & 회원가입 (관리자용, 고객용)
- 사장님용
- 캠핑장 등록, 수정, 삭제
- 예약 취소 권한
- 예약 확인
- 리뷰 확인 & 리뷰 댓글 등록, 수정, 삭제
- 고객용
- 캠핑장 조회
- 해당 캠핑장 예약 조회 (캘린더)
- 예약, 예약 취소
- 결제
- 마이페이지 - 예약 확인
- 리뷰 등록, 수정, 삭제, 확인
- 지도 api
- 날씨 api
- 캠핑에 필요한 물품 정보
🗓 22.09.12~13(월화)
🔥 TODO
-
요구사항 정의서 작성 마무리
-
User Flow 작성
- 13:30~14:30 FE,BE 전체 회의
- 16:00~18:30 FE 멘토링
- 화면정의서 작성을 위한 피그마 와이어프레임 수정 작업
(로그인, 회원가입, 마이페이지 파트)
🌵 DIARY
추석 금토일월 집에 거의 없었어서 작업을 거의 못했다,, 🥲
월욜 밤에 집에 와서 요구사항 정의서 설명과 우선순위 등 작성 마무리하고, User Flow를 작성했다.
pre때는 User Flow를 따로 그리지 않았는데 이번 메인때는 로직 자체가 관리자와 고객으로 나뉘어져 있기 때문에 나조차도 로직이 머릿 속에 잘 들어오지 않아서 User Flow를 따로 작성해봤다.
🗓 22.09.14~16(수목금)
🔥 TODO
- 16:00~17:00 SEB11 FE/BE 전체 회의
- 17:00~18:30 FE 회의
- 화면정의서 작성 마무리
- [client] 폴더 구조 설정
- [client] Router 설정
- 화면정의서 작성 중 수정해야할 api BE분과 이야기 → 화면정의서 마무리
- Discord에 Github Bot 연동 (PR, merge할 때마다 자동으로 chat 📨)
- Login 틀 구현
- Input 컴포넌트 👈 @Mui/material 라이브러리 적용
- storybook 플젝에 적용하기
- 회원가입(Join) 틀 구현
🐼 MEMO
화면정의서는 아래와 같은 형식으로 노션에 구성했다.
화면정의서를 작성하다보니까 로직부분에서 피그마쪽을 수정해야 할 부분이 꽤 생겼다.
API 명세서도 함께 체크하면서 API 명세서에서 수정할 부분과 내가 이해되지 않은 부분을 체크해서 BE분에게 공유하여 수정했다.
- Material UI 라이브러리
📎 참고자료 - @Mui/material 라이브러리 공식 사이트
🌵 DIARY
작업하다가 계속 딴 길로 새서 예상보다 화면정의서 마무리가 늦어졌다,, 🫠
이번주 내로는 일단 모든 페이지의 기본적인 틀을 구현해놓기로 했다.
아 그리고 FE멘토링 시간 때 멘토님께 효율적인 플젝 폴더 구조 구성에 대해 조언을 구했는데 멘토님께서atomic design pattern을 제안해주셔서 이 디자인 패턴대로 폴더 구조를 구성해보기로 했다..!
