현재 SSAFY(삼성청년소프트웨어아카데미)로 부터 코드 반출 관련 허가가 승인되지 않아 현재 상세 코드는 확인이 어렵습니다.
양해 부탁드립니다.
- 팀명 : 시선집중
- 프로젝트명 : SURFY
- 팀원 : 김영후, 이언호, 이효림, 홍종규
- 시작 일시 : 2022.01.04.(화)
- 종료 일시 : 2022.02.18.(금)
버스 정류장 키오스크와 설문조사의 접목
프로젝트의 기획, 다수의 의견 수집 등을 위해 많은 기업과 팀에서 설문조사를 진행하게 됩니다. 기존의 설문조사 방식으로 전화 설문, 길거리 설문, 웹사이트 통한 메일 설문, 앱 설문, 구글폼 등 다양한 방식이 존재합니다.
이러한 설문들은 진행하는데 몇가지 단점이 존재합니다. 설문 참여자가 원하지 않은 시간대에 설문 참여 요구 웹 사이트 또는 앱에 직접 가입한 소수의 설문 참여자들로 적은 데이터와 유사한 데이터 집단 설문 참여를 유도하기 위해 많은 비용 발생
위의 단점들을 보완하기 위하여 다수의 사람들이 필수적으로 한 곳으로 모이는 장소이며 해당 장소에서 여유 시간이 발생할 수 있는 버스 정류장 을 선택하였습니다.
-
버스 정류장 키오스크
버스 정류장 정보 (정류장 이름, 잠시후 도착 버스, 모든 버스 도착 시간)
현위치 기반 정보 (날씨 정보, 주변 인프라 정보)
사용자 설문 유도를 위한 VS 설문
-
웹 페이지
설문 완료 후 마일리지 적립을 위한 룰렛
진행 가능한 설문 목록
마일리지 출금을 위한 출금 페이지
마일리지 적립 및 출금 내역 조회
| 멤버 이름 | 멤버 역할 | 개발 내용 |
|---|---|---|
| 이효림 (팀장) | Backend, Hardware, CI/CD | DB 설계 및 관리, 서버 구축, 라즈베리파이 연동, 배포 |
| 이언호 (팀원) | Frontend, Jira 관리, UCC 제작 | 키오스크 및 웹페이지 레이아웃 구성, 클라이언트와 서버간 비동기 통신 구현, 소셜 로그인 구현, 버스 정보 API 관리 |
| 홍종규 (팀원) | Frontend, Backend 보조 | 날씨 API 관리, 정류장 주변 인프라 정보 표시 |
| 김영후 (팀원) | Frontend, Git, UI/UX 디자인 | 구글맵 구현, UI 디자인, 룰렛 기능 구현 |
2차 수정본 (2022.01.17)
- 스프린트 관리
1주일 단위로 스프린트 생성하여 진행할 작업 내역을 관리하였습니다.
- 소멸 차트
각 스프린트의 소멸 차트는 우하향으로 진행하도록 스프린트를 관리하였습니다.
- Git Graph
작업 단위별 Branch 를 생성하여 작업을 진행하였습니다. Git 관리와 변경 사항 확인을 위해 Commit 시 규칙을 주어 관리하였습니다.
Notion을 이용하여 팀원간 스케줄 공유, 스크럼 미팅 기록, 학습한 내용 공유 등을 공유하였습니다.
Discord 를 이용하여 팀원간 실시간 의사소통 및 오류 확인, 공지사항 전파 등 실시간 커뮤니케이션을 이용하였습니다.
주요 기능
키오스크 상단에 현재 날짜 및 시간, 정류장명, 현재 날씨 정보가 보여집니다. 잠시후 버스 도착 목록과 모든 버스의 도착 정보를 확인할 수 있습니다. 현재 위치를 기준으로 주변 인프라의 정보 및 위치를 확인 할 수 있습니다. 버스를 기다리는 사람들의 흥미를 유발 할 수 있는 VS 설문을 배치하여 설문 참여를 유도합니다. 설문 참여시 투표 결과를 확인 가능하고, QR 코드로 접속하여 마일리지 적립 및 추가 설문 진행이 가능합니다.
주요 기능
설문 참여자가 설문을 마치고 마일리지를 랜덤하게 적립 받는 페이지입니다. 설문조사별 적립 가능한 마일리지가 모두 다르게 DB 에 저장되어 있어 설문조사별 적립 가능한 마일리지가 모두 다르게 나타납니다.
주요 기능
SNS 로그인을 이용하여 손쉽게 가입 및 설문 참여가 가능합니다.
주요 기능
이미 참여한 설문 조사에는 참여가 불가능합니다. 관심있는 설문조사에 참여 할 수 있습니다.
주요 기능
마일리지 적립된 내역을 확인 할 수 있습니다. 출금한 마일리지 내역도 확인 가능합니다.
주요 기능
사용자가 출금 가능한 마일리지를 출금 신청 할 수 있습니다. 사용자 보유 마일리지 보다 많은 마일리지 출금을 요청할 경우, 불가능하다는 알림창이 나타납니다.
- 문제
클라이언트에서 직접 공공 API로 요청을 보낼 경우, SOP 정책으로 인하여 CORS 에러가 발생하였습니다. 2) 해결
초기 프록시를 이용하여 우회하는 방법을 학습하여 시도하였으나, 프록시 설정에 어려움을 겪었습니다. 자체적으로 서버를 구축 할 예정이였기에 서버에서 공공 API로 정보를 요청하도록 구현하였습니다. 그 이후 클라이언트에서 서버로 요청하여 응답 받은 정보를 전달해주는 방식으로 해결하였습니다.
- 문제
로그인과 관련된 컴포넌트에서 서버로 회원 마일리지 관련된 정보를 렌더링시 요청을 보내도록 하였습니다. 다른 컴포넌트에서 사용자의 입력 값을 갱신할때마다 지속적으로 서버로 요청을 보내는 문제가 발생하였습니다. 2) 해결
사용자로부터 값을 입력받는 컴포넌트와 로그인과 관련된 컴포넌트의 상태 값이 서로 연관되어 있어 두 컴포넌트의 상태 값을 서로 분리하여 주었습니다. 또한, 로그인 관련 컴포넌트에서 useEffect 에서 로그인 정보의 상태값을 dependency 로 주어서 리렌더링이 되지 않도록 해결하였습니다.
- 문제
초기 프로젝트를 6인으로 시작하여 기획을 진행하였습니다. 그러던 중 얼마 지나지 않아 팀원 2인이 취업으로 인하여 프로젝트에서 제외 되는 문제가 발생했습니다. 팀장의 이탈로 며칠간 팀의 분위기가 어수선해지고, 혼란이 발생 및 프로젝트 진행이 중단되는 문제가 발생하였습니다. 2) 해결
2명의 팀원이 맡은 분야에 공백이 생기고 기획의 규모가 너무 크다고 판단하여, 긴급 회의를 통해 팀원별 맡은 업무를 재분배 하였고, 프로젝트 규모를 줄여나갔습니다.
3인 이상이 진행하는 최초 프로젝트였습니다. 초기 인원이 6명으로 프로젝트의 기획의 규모를 생각보다 크게 잡았던것이 프로젝트 진행에 어려움을 주었던것 같습니다. 짧은 기간의 프로젝트 진행시 핵심 기능을 하나 선정하여 그것 위주로 개발을 진행하여 안정성을 높이고, 추가적인 기능을 추가하는것이 좋을것 같다는 생각도 들었습니다.
이번 프로젝트는 지라를 통해 스프린트를 생성하고 각자 이슈를 만들고 관리하여 팀원들이 어떠한 작업을 진행중이고, 프로젝트의 진행도가 어느정도 되는지 파악할 수 있어서 지라 활용에 만족을 느낄 수 있었습니다. 또한, 매일 진행한 스크럼 미팅으로 팀원들의 상황과 스케줄, 어려움을 빠르게 파악할 수 있어 좋았습니다. 그리고 백엔드 업무를 맡은 팀원과 계속해서 의사소통을 할 기회가 많았는데, 필요한 요청 사항이나 확인이 필요한 사항을 바로 커뮤니케이션을 통해 확인하여 프로젝트 진행이 좀 더 수월하여 좋았습니다.
이번 프로젝트의 아쉬운 점은 팀원 이탈과 같은 예상치 못한 변수에 빠르게 반응하지 못한 점이 아쉬움으로 남습니다. 또한, 이번 프로젝트에서는 각자 업무 진행시 한개의 파일을 여러명이 작업하여 Git merge 과정에서 충돌이 많이 발생하여 어려움이 있었기에 다음 프로젝트 진행시에는 업무를 조금 더 세분화를 할 필요성을 느끼기도 하였습니다.