[프로젝트-Stroll] Devlog-1

코드스테이츠 이머시브과정 후반부에 2주, 4주 프로젝트 중 2주 프로젝트를 시작했다. dev.log 를 남겨두면 매일 정리에도 도움이 되고 나중에 다시 보기에도 좋을 것 같아 시작하기로 했다.

먼저 이번 프로젝트는 아쉽게도 내가 아이디어를 내거나 선택을 했던 것은 아니지만 4주 프로젝트로 생각하고 있는 아이디어에도 도움이 될 것 같아 재미있을 것 같다.

프로젝트 제목은 Stroll 인데, 자신만의 산책로를 지도에 표시하여 다른 사람들과 공유할 수 있게 만드는 프로젝트이다.

프론트쪽에서는 React, Ant-design 을 이용해 구조를 짜고 Axios 모듈을 이용하여 AJAX 를 구현하기로 하였다. 내가 맡은 백엔드쪽에선 express 를 이용하여 기본 서버 프레임을 짜기로 하고 DB 는 mysql 과 sequelize, sequelize-cli 를 이용하기로 했다. 사용자 인증과 보안쪽은 jwt(jsonwebtoken) 와 crypto 모듈을 이용하기로 했다.

처음 프로젝트와 팀원이 정해지고 나서 한 일은 팀의 프로젝트 룰을 정하는 일이었다. 솔로나 혹은 페어로 진행하는 경우까지는 인원이 적기 때문에 상호 간 대화가 신속하게 이루어졌지만 4명이나 되는 프로젝트에서 매번 일일이 정하기 보단 그럴 만한 사항들을 정해놓고 프로젝트를 진행하는게 훨씬 도움이 될 것 같다. 모두 처음으로 프로젝트를 경험하는 것이라 부족하지만 아래와 같은 것들을 정해 통일하기로 하였다.

1. 커밋 룰 - 좋은 커밋메세지, gitmoji 를 참고하여 작성
2. 변수명

• 프론트엔드

종류	형식	예시
컴포넌트	첫글자 대문자	SigUpInfo
클래스	cl_소문자	cl_trails
ID	id_소문자	id_trail_element

• 백엔드

종류	형식	예시
모든 변수	Camel case	const bodyParser = require('body-parser');

3. 코드 리뷰 시간에 리뷰 및 merge - 리뷰를 받고 PR을 한 사람이 확실하다면 merge.

4. 팀원이 요청시 페어프로그래밍을 진행할수 있도록 한다.

5. 매일 dev-log 작성하기

6. Stand-up meeting : 팀장 제외 팀원들이 하루씩 돌아가면서 작성

   • Stand-up meeting 은 매일 오전 프로젝트를 진행하기전 어제 진행한 진행 경과와 오늘 진행할 목표를 공유하며 조금 더 체계적으로 서로 상황을 공유하기 위함이다.

7. ESLint(air-bnb) & Prettier(default) - https://ux.stories.pe.kr/150 , https://gist.github.com/bradtraversy/aab26d1e8983d9f8d79be1a9ca894ab4

   • 서로 코드스타일이 다르기 때문에 Lint 와 Formatter 를 이용하여 최대한 스타일을 통일시켜주기 위함이다.

위와 같이 몇가지 팀 룰을 정하고 나서는 이번 프로젝트의 목표를 3가지 - Bare minimum, Advanced, Nightmare 순으로 나누었다. 주어진 시간동안 Bare minimum 을 기본으로 하여 다음 단계까지 가능하다면 진행을 하기로 했다.

• Bare minimum

  	1. 회원가입
  	2. 로그인
  	3. 로그아웃
  	4. 산책로를 카테고리별로 분류(ex) 야경, 바다, 숲 등)
  	5. 산책로 한 곳을 클릭하면 정보창 표시
  	→  정보창 내용: 위치 정보(도로명 주소), 카테고리( ex)조용한 산책로), 업로드한 	사진들, 리뷰(댓글, 평점) 등
  	6. 산책로 추가 - 마커 5개를 찍어서 루트 생성
  	→ [추가] 버튼으로 추가 가능, 이 때 어떤 산책로인지 분류할 “태그( ex) 조용한 산	책로, 위치 정보)”, 추가하려는 유저의 리뷰와 산책로의 위치정보 필요.
  	7. 지도 api 를 이용하여 산책로의 정보를 표현, 날씨 와 미세먼지 api 를 이용하여 그날의 날씨, 미세먼지 농도의 정보를 유저에게 전달

• Advanced

  	1. 산책로별 정보창에서 시간대별로 산책할 사람 모집
  
  	ex) 
  
  	<채팅방들>
  
  	* (1) 1시에 산책할 사람[참가 버튼] - (13:00 부터)
  
  	* (2) 4시에 봐요[참가 버튼] - (16:00 부터)
  
  	<각 채팅방>
  	* (1) 1시에 산책할 사람
  	A: 안녕하세요~
  	B: 이따 봬요~
  	C: 저도 가고 싶어요~
  
  	2. 카테고리 테이블을 따로 생성해서 관리

  정해진 카테고리뿐만 아니라 유저가 추가하는 상황을 고려했을 때

  	3. 행정구역별로 산책로 필터링

  ex) 서울시, 경기도 등등...
  

• Nightmare

1. 산책 시작 - 끝 까지의 위치정보를 산책하는 동안 트래킹해서 만들어진 경로를 산책로 추가할 수 있는 기능

이렇게 목표들을 설정한 후에는 목표에 맞춰서 프론트담당 팀원들은 실제로 보여질 웹 아키텍쳐를, 내가 담당하는 백엔드는 database schema 와 api 문서를 본격적으로 디자인하기로 하였다. 이 내용들은 내용이 많이 길어질 것 같아 다음 log에서 다룰 예정이다.

이번 프로젝트의 목표 단계를 보면 산책로를 보여주기 위해서는 지도 api를 사용해야한다. 그래서 우리는 이번에 Naver 의 maps api 를 이용하기로 했으며, 날씨와 미세먼지 api 도 이용하여 온도나 미세먼지 농도의 정보도 사용할 계획이다.

2주(사실 2주보다 적지만)라는 길지 않은 시간동안 처음으로 4명이라는 다수로 이루어진 팀에서 첫 프로젝트를 진행해야 해서 많이 혼란스럽다. 하지만 서비스를 완벽하게 구현한다는 목표보단 4주 프로젝트를 진행하기 전에 프로젝트의 진행 스타일과, 프론트와 백을 담당하는 팀원끼리의 협업을 익힌다는 마음으로 차근차근 해나갈수 있기를 바란다.