프로젝트명: 마실꾼

우선 우리 팀은 각자 5가지씩 아이디어를 낸 후, 팀원들과의 투표와 논의 끝에 가장 많이 언급되었던 '여행'을 주제로 프로젝트를 시작하였다. '여행과 관련된 어떠한 웹을 만들면 좋을까?' 라는 생각을 하다가, 요즘 유행하는 일본 소도시 여행 마케팅을 보게 되었고, 영감을 받아 '우리나라에도 알려지지 않았지만 좋은 여행지를 활성화시키면 어떨까?' 라는 생각으로 기획을 구체화하였다. 그래서 우리 팀은 알려지지 않은 지역을 코스별로 관광할 수 있게 해주는 웹을 구현하기로 결정하였다.

어려웠던 부분

평소에는 당연하게 느껴졌던 웹 서비스의 다양한 기능들이, 실제로 구현하려고 하니 모든 요소 하나하나를 세심하게 결정해야 했다. 어떤 기능이 필요한지, 어떤 흐름으로 작동해야 할지에 대해 팀원들과 논의하며 정의해 나가는 과정은 쉽지 않았다...
프로젝트를 시작하면서 가장 어려웠던 부분은 기능 명세서를 작성하는 것이었다.
많은 기능을 넣고 싶은 욕심이 있었지만, 과도하게 복잡한 기능들은 사용자 경험을 나쁘게 할 수도 있을것 같다는 우려에 일부 기능은 과감히 제외했다.
꼭 필요한 기능만을 선정하는 MVP(최소 기능 제품) 과정을 통해, 주제에서 벗어나지 않도록 팀원들과 노력하였다.

우리가 만든 기능 명세서 ISA

📂 마이페이지
├── 📄 내 게시글 보기
├── 📁 퍼즐북
├── 📁 팔로우
├── 📝 게시글 작성
│ ├── 임시 저장 기능
│ ├── 작성 가능 지역 선택
│ ├── 장소 추가
│ │ ├── 장소별 사진 업로드
│ │ └── 장소별 캡션 작성
│ ├── 코스 순서 설정
│ └── 게시
├── 📍 인증하기
│ └── 위치 인증 버튼
├── 📁 스크랩북
│ └── 저장한 게시물

디자인 레퍼런스

위의 ISA를 기반으로 7/1 코어타임에서는 팀원 분들과 웹 디자인을 맡기기 전, 디자이너 분이 참고하실 레퍼런스를 피그마로 만들었다.

지도 API 구현 시도

기획 발표 이후, 지도API 구현을 시도해본 다음에 프로젝트를 본격적으로 시작하는 것이 좋을 것 같다는 피드백을 받고 지도 API 구현을 대략적으로 시도해보았다.

카카오맵을 기반으로 시도해보았다.

먼저, 카카오 개발자 센터에 로그인을 하고 오른쪽 위 메뉴에서 내 애플리케이션 → 애플리케이션 추가를 누르면

이러한 화면이 나온다. 앱 이름 과 회사명 -> 개인 을 작성하여 저장을 하면,

다음과 같은 화면이 나온다.

앱 키를 선택하여 들어가게 되면 네이티브 앱 키 REST API 키 JavaScript 키 Admin 키 가 생성이 되었음을 확인할 수 있다.

네이티브 앱 키 REST API 키 JavaScript 키 Admin 키 는 다음과 같은 역할을 한다.

키 종류	어디에 사용?
JavaScript 키	브라우저에서 SDK 스크립트 로딩용
REST API 키	fetch나 axios로 서버 통신할 때 사용
Native, Admin 키	모바일 앱이나 내부 관리용

아직까지 구현 성공을 못했는데 성공하면 이어서 쓰겠음. ㄱㄷㄱㄷ

React 강의

아직 개발을 하기 너무나도 부족한 실력이라, 미션트랙을 같이한 팀원분들과 현재 프로젝트를 같이 하시는 팀원분과 react 강의를 듣기로 결정하였다.

6/27~7/3
섹션 1 (8분)
섹션 2 (2시간 35분)
섹션 3 (2시간 45분)
섹션 4 (45분)
섹션 5 (46분)
7/4~7/10
섹션 6 (2시간 11분)
섹션 7 (23분)
섹션 8 (25분)
섹션 9 (1시간 4분)
섹션 10 (21분)
섹션 11 (37분)
섹션 12 (29분)
7/10~7/16
섹션 13 (5시간 41분)
섹션 14 (18분)

기한 내에 해당 섹션을 듣고 블로그 글을 작성하지 못하면, 커피를 쏘는 것으로 결정하였다. 언능 들으러 슝