회의록
프로젝트명 : 밀리지. Millage (Military + Village)
팀명 : ICM 팀 (다른 아이디어 있으면 교체)
-
박은찬
학교에서 웹개발, 교내 웹서비스 관리, 외주 경험,
Backend, Frontend 개발, 서버 구축 경험
-
황인규
개발 경력 (7~8년) / 다수의 프레임워크 경험 / 알고리즘 공부 /
React - 창업팀 사이트 외주 경험 (쇼핑몰, 여행 계획서 올리는 사이트, 음원 사이트)
개인 포트폴리오 블로그
-
최성흠
SW 개발병 / nodejs 백앤드 경험 / 창업동아리 외주 경험
-
김동현
학원에서 일하다 코로나 때문에 온라인으로 사이트를 개발해야하는 상황이 있었음
해커톤 준비하면서 Flutter / React 공부 / 문서작업 경험
-
박수근
https://suave-globe-a16.notion.site/Profile-97b4eddefd5849b7b1f86337f52df137
WEB Backend, Frontend 개발 3년차
Front - React / TS 가능, FC, Redux, Apollo
Backend - NestJS / REST, GraphQL API, SQL DB
어느 부대든지 쉽게 개설할 수 있음을 시연을 통해 보여주기
커뮤니티 개설, 사용자 유치, 관리까지 이어지는 UI/UX 설계 및 가이드라인 제작
DB 단계에서도 암호화 필요할 것
타 부대에 들어가는 것 방지
해당 소속 부대 인원만 가입할 수 있도록 인증(Mac 주소?)
커뮤니티 이용자들이 가장 불편하다고 느끼는 것을 해결 / 편리함이나 새로운 가치를 제공
1. 불편 요소 & 이를 해결하는 서비스 Brain Stroming (다음 회의 전까지 생각하기)
2. 설문조사 ( 진행하나요? )
3. 가장 불편한 / 필요하다고 느끼는 기능부터 개발
육대전 같은 사태 방지 ( 부대에 피해가 가는 내용 검열? )
신고 기능
반응형 웹 개발
- 1순위 : 김성섭 멘토
- 2순위 : 이종열 멘토 ?
- 3순위 : 김동우 멘토 ? (2, 3순위 헷깔림)
- 최성흠 - Backend 전담
- 박은찬 - Backend + Frontend
- 황인규 - Frontend
- 박수근 - Frontend
- 김동현 - 디자인 / 영상편집 + Frontend
9.12 멘토 매칭 이후 회의
9.16 부터 개발 본격적 시작
~ 코드 기반의 테스팅은 중요하지 않은 것 같음. 시현 위주의 기능 구현
백앤드 < 프론트 예상. 백엔드 완료되는 대로 프론트 같이 작업
10.20 프로젝트 마감
- 팀명 - 떠오르는 대로 공유
- 프론트앤드 관련 공부 및 공용 컴포넌트 생각
- 유저를 모을 수 있는 핵심 기능
- 비즈니스 모델
- 수상작 Document 탐색
- 13-14년 개발 (웹 위주)
- 오픈소스를 좋아하고 자주 사용하는 편
- 오픈소스 경진대회에서 대상을 수상
- SI 쪽에서 9년 정도 일하고, Front쪽으로 이직해서 4년정도 근무, 카카오로 이직
팀 멤버 소개는 9.10. 회의 를 참고.
- 해커톤의 목적 : 완성하는 것, 수상하는 것
- 4~50팀 참여 -> 12팀 (가능성이 높음)
- 나라에서 인정해주는 상 (취업 시 도움이 되는 부분)
- 일정 관리를 하는 것이 좋다.
- 핵심 플로우 개발에 집중할 것
- 3일에 1번 정도는 작업 내용을 PR 및 공유
- 진행 속도가 맞지 않는 경우가 발생할 수 있음
- 의사소통 많이 할 것
- 역할 분배는 ok, 업무 분배 필요
A) 설문이 가능하면 좋은데, 설문이 항상 옳지만은 않다. 해커톤에서는 범용적인 것보다는 특정 핵심 요소를 구현하고 확장하는 것이 포인트. 지금 상황에서는 빨리 진행해야 하기 때문에 설문이 좋을 것 같지는 않다
- 확장성 - 운영을 부대 단위로 쉽게 확장할 수 있다는 것
- 보안성 - 내용의 암호화, 통신상의 암호화 / 군대 기밀에 관련된 내용을 관리자가 쉽게 관리할 수 있게 하기
-> 경쟁력 있는 차별점이 부족한 느낌 멘토님 추천: 오프라인 상황(훈련상황 등)에서도 사용할 수 있게 하기 (로컬 스토리지를 활용해서)
- 매주 토요일 7시 ( 유동적으로 변경 가능 )
- 이번주는 프로젝트 기획 / 일 분배을 마무리 하기 !
- 주차별 마일스톤 만들기 -> 완료 되면 도와줄 것이 보일 것
- Issue에 올라온 기능 검토, 핵심 기능 정리, 차별성 검토 (비즈니스 모델 포함)
- 핵심 기능에 따른 업무 분배, Milestone 정리
- 해커톤 참여기간 동안 지킬 Ground rules 확립
- 기본 기능(필수 선택)
- 기본적으로 제공하되 선택가능한 기능
- 부대별 커스터마이징
생성 페이지에서 2번에 해당하는 템플릿화된 기능은 RadioBox나 SelectBox로 선택할 수 있고,
선택안함 시 커스터마이징 Create Option을 제공
블라인드 서비스에서 아이디어를 차용
관리 주체가 누가 될 것인가 - 해커톤 시연 시에는 고려하지 않아도 될 듯 ?
기능 완성 이후에 배포과정에서 생각해도 될 것.
-
형태 구분 : 일반 게시판 / 카드형(그리드) 게시판
-
기능 구분 : 일반 / 설문 / 팀빌딩(인원 모집)
카드형(그리드) 게시판 예시 : 민원게시판 / 칭찬게시판 -
분대위키 (보류)
-
공동 프로젝트(자기계발 독려)
깃헙 마일스톤과 비슷
ex) 한라백두(구보 200km 휴가 1일)
어플 - 챌린저스, 그로우 참고
이후, 필요 시 동현님께서 컴포넌트별 디테일 작성
-
당직일정표 : Google calendar와 비슷한 기능 (달력 생성, 공유)
-
공용 시설 예약 시스템 (SKKU Seminar Room 예약 시스템) - 참고용)
- Direct Message
- 로그인 / 회원 가입 (소속 부대 인증)
- 커뮤니티 생성
추석 연휴 동안 완료 목표
Github issue로 요청하기
마일스톤: REST API 설계 , Assignees: nailerHeum 설정하고 이슈 생성
기능별 역할 분배
- 게시판 - 수근
- 일정표 - 인규
- DM - 은찬
- 운영 ( 회원가입, 로그인, 부대 개설 ) - 은찬
-> 추석 연휴동안 각자 진행 후 공유
맡은 파트별로 기능을 구현하고, 디자인 작업이 진행됨에 따라 스타일 작업 진행하기
- 전반적인 디자인은 동현님 작업, 개별 페이지 컴포넌트는 각 기능 담당자도 참여
- 추석 기간 동안 전반적인 레이아웃 및 와이어프레임 디자인
은찬님이 담당하되, 개별 업무 단위로 팀원에게 요청
-
시간 투자 관련
하루에 최소 평일 2 - 3시간 / 주말 4 - 6시간 -
소통하는 시간
각자 무엇을 했는지 정리 및 공유하는 시간
( 토요일에 멘토링 / 멘토링 사이 2번 미팅 ) -
Convention -> CONTRIBUTING.md 정리
- API 요청
- commit 메시지
- Lint (코딩 스타일)
- 브랜치 -> 기능별 브랜치로 운영
참석자 : Frontend Developers(박은찬, 박수근, 황인규)
회의 안건
- 디렉토리 구조
- Class Component / Functional Component
- Component Styling
- State Management
-
pages/: 각각의 라우트에 해당되는 페이지 컴포넌트 디렉토리 -
components/: 공동(common) 컴포넌트 및 페이지 컴포넌트를 채우는 컴포넌트 디렉토리 -
hooks/: custom hook를 모아놓는 디렉토리 -
modules/: redux의 action 및 reducer를 정의한 디렉토리 -
constants/: 모든 상수를 모아놓은 디렉토리 -
utils/: 반복되는 로직의 리펙토링 코드 등 타 컴포넌트 및 모듈의 작성에 도움이 되는 코드 디렉토리
Functional Component 로 결정
각자 편한 방식으로 작업하기
- redux 로 결정
- 비동기 처리 미들웨어: redux-saga
- 디렉토리 구조 및 redux 초기 설정은 수근 작업
- 깃헙 issue, commit, PR 자주 활용하기 (공개SW 개발방식)
- 본인의 PR을 본인이 merge해도 좋다
react-hook-form
참가자: 김성섭(멘토), 박은찬, 김동현, 박수근, 황인규
- Github에 해커톤 기간 동안 자신이 해야하는 모든 업무를 Issue로 만들어서 올리기 [주말동안 완료할 것]
- 오픈소스 커뮤니티에 가입하기
- Figma 가입해서 ICM 팀에 들어오기
프로젝트 보드에 올라온 issue가 모두 완료 = 해커톤 기간동안 할 모든 일이 마무리
-> 모든 할 일을 Issue로 만들어서 board에 등록하는 것부터 하기 (팀원 개개인 모두 해야 함)
- 서비스 플로우 만들기 ( 서비스의 모든 페이지들의 제목이라도 정의되어 있어야 )
- 최소 화면당 1개의 Issue 생성
- 화면 내에서 세부적으로 (디자인 작업, API 요청, 기능 구현 등등 ) issue로 만들기
- issue를 현재 작업 상황에 따라 Board에서 Todo, Progress, Done으로 옮기기
개인에게도 도움이 되지만 팀 프로젝트이기 때문에 각각의 팀원이 무슨 일을 하고 있는 지, 진행상황을 파악하기 위해서 반드시 필요하다 !
초반일수록 내가 무슨일을 해야할지를 몰라서 못하는 경우가 많다.
그렇기에 업무를 확실하게 만들고 이를 배정하는 것이 중요하다.
본인이 어떤 업무를 해야할지 모를때는 반드시 물어보기
해커톤 평가항목 중 '참여성실도' 가 변별력 있는 항목일 것
이는 수치화 가능한 Github 사용이력 (commit, PR, issue, Project) 등으로 평가될 것 같음.
따라서 온라인 활동(Github)을 활발히 참가하기 !
- #66 이슈 참고하기
커뮤니티 가입 후 멘토님께 알려드리기
Scouter OSS APM
서버에서 이벤트를 분석하거나 서버의 상태를 확인 가능한 툴
서비스 배포 후 잘 돌아가는지 (분석) 확인할 수 있는 툴
운영 및 개발 시 활용하는 도구로 나중에 개인 프로젝트나 회사 들어가서 활요하면 좋음
해당 기능을 제공하는 툴 중 무료(오픈소스)인 것은 별로 없다.
제출 후 오픈소스 검증을 하지만, 제출 전에 1차적으로 검증을 하는 것이 좋다.
제출 후에 발견되면 감점요소임
Todo 이슈에 넣고, 마지막 주에 작업 진행할 것.
구현하기로 결정
- Grid형, List형 모두 개발한 뒤, Toggle Button으로 사용자가 UI 선택할 수 있게 하기
- List형을 먼저 개발하기
참석자: 박수근, 김동현
- 에브리타임
- 챌린저스
- 그로우
- OP.GG
- 디시인사이드
- 일반 게시글
- 설문 게시글
제목 / 내용 / 설문지 리스트로 이루어진 글
Youtube Mobile 앱의 설문 게시글과 유사 - 모집 게시글
모집인원 / 참가 기능 / 모집상태 / (기간 정보) 가 추가된 게시글
PC 버전은 다음, 이전 버튼을 통해 페이지 이동
Mobile 버전은 무한 스크롤을 통해 데이터 렌더링
-> 에브리타임 서비스와 동일
게시글 타입의 구분은 아이콘을 통해 구분
<공동>
- 제목
- 내용 일부 ( 넘치는 부분은 ... )
- 작성 시각
- 작성자
- 추천수
- 댓글수
- 이미지 썸네일
<설문> - 아이콘만 다르게
<모집>
- 현재 인원 / 모집인원 (모집 상태)
- 기간 정보 ( 모집 기한, 이벤트 시각, 주 n회 등등 )
- 게시판 페이지에서 바로 글 작성 (에브리타임)
- 게시글 생성 페이지로 이동해서 글 작성 (일반 타입)
2번으로 결정
구현하기로 결정
예시 )
- 에브리타임 - 실시간 인기글 / Hot 게시물 / 강의평가 ...
- OP.GG - 계정 / 카테고리 (홈, 정보, 게시판 리스트)
-> 수요일 회의 때 논의할 것
최신 게시글이 가장 앞에 위치하도록
일부 게시글은 관리자가 상단에 고정 가능
참석자: 박은찬, 김동현, 박수근, 황인규
- 각자 파트 작업 진행상황
- Millage 기능 기획
- Header Component
- Board Side Component
- Main Page 부대 리스트
- 404 페이지 만들기
- 작업 관련
- 다음 회의 전까지 할 작업
-
수근
- 게시글 생성 페이지 기능 구현 완료
- 게시판 View, 게시글 View, Manage 페이지 기획
- 게시판 페이지 동현님과 조율
- 게시판 페이지 기능 구현 중
-
동현
- 프론트와 기획 및 디자인 논의하기
박수근과는 진행완료 - 디자인 작업 - Figma에서 확인
- 프론트와 기획 및 디자인 논의하기
-
인규
- 캘린더 작업
당직 일정표 - 일정 추가 삭제 편집 기능
일정표 만들어지면 그것을 토대로 예약 기능을 구현할 것 - Antd -> MUI로 교체
- 캘린더 작업
-
은찬
- DM : redux-saga 요청 되는거 확인 후 잠시 중단
- 메인 페이지, 로그인 페이지, 회원가입 페이지 기능 구현
- 서버 배포 (millage.il)
- Backend API 개발 회원가입, 로그인, Board List 가져오기, 세션
- 로고 + 부대명
- 부대 게시판
- 일정표
- 시설예약
- 전군 통합 게시판
- DM
- 계정
- 다가오는 일정
날짜 기준이 아닌, 일정 기준
개인 일정 / 부대 일정은 색깔로 구분 - 자주 이용하는 게시판 (편집 기능)
- 최근에 올라온 모집 게시글
클릭하는 것 대신에, Millage를 이용하는 부대 수, 이용자 수 띄우기
- Figma에 모든 페이지 생성 (빈 페이지라도)
- 페이지 제목과 설명 덧붙이기
- 이슈에 Question 라벨 + Asignee 등록
- 디코에서도 말하기 (이름 태그)
- 은찬
- 서비스 플로우
- DB 설계 (성흠님과 함께)
- 메인페이지, Header Component, 로그인/회원가입 페이지 디자인
- 수근
- 게시판 페이지 기능 구현
- 게시글 페이지, 관리 페이지 기획 동현님과 논의
- 동현
- 각 기능별로 프론트와 조율
- 디자인
- 인규
- (이번주까지) 일정표 완료하기
참석자: 박은찬, 김동현, 박수근, 최성흠, 황인규
- 작업 진행상황 공유
- 기능 관련
- 기타
-
수근
데이터만 저장하는 Board module의 state를 loading 정보와 성공 여부를 알 수 있는AsyncState형태로 변경
Construct BoardView Page Structure
Pagination / 검색 / 상단고정 기능/ Side 컴포넌트 남음 -
인규
캘린더에서 추가창 편집창 삭제하기 창 제작
동현님과 Modal 창, 이벤트 색깔 등 기획 회의 진행 -
동현
은찬님, 인규님과 담당 기능에 대한 기획 회의
디자인 작업은 현재 사지방 인터넷이 끊겨서 진행 못함 -> 내일부터 가능할 듯
기획적인 부분은 메모
근무를 당겨서 했음 -
성흠
issue에 assign 된것들 우선적으로 처리 중
스키마 완성하고 코드 작업하려 했으나, 변경이 많아서 코드 작업하면서 스키마 만들어가기로 함.
게시판 정보 가져오기, 서버쪽 lint 적용 완료
post 생성 API 작업 중 -
은찬
Global Navigation Bar 제작
가입 시 부대 선택 기능 구현 중
백앤드 api 작업
최고 관리자, 부대 관리자, 일반 유저
게시판 글쓰기 권한 - Table이 아닌 Column으로 관리
PC와 모바일 2가지로 구분
min-width: 640px 기준
- 이번주 멘토링 : 일요일 19:00
- 멘토링 day : 10 9.(토) 13:30
- 일요일 전까지 Figma에 구상하는 전체 페이지 올리기 (은찬, 수근, 인규)
디자인 x, 빈 화면에 제목과 간단한 설명 정도
참석자: 김성섭(멘토), 박은찬, 김동현, 박수근, 최성흠, 황인규
- 발표는 대표 멘토가 팀에서 만든 발표자료를 이용해 심사위원들한테 발표
- 팀에서 만들어야 하는 결과물
- 발표 자료
- 시연 영상
- Github Document, Source Code
- 대표 멘토(발표 담당자)에게 따로 설명 및 소개하는 시간은 없을 것이고, 결과물을 전달하게 될 듯
- 다음주부터는 발표자료 및 Github README 작업 시작하라
- 문서 작업을 코드가 다 완성된 다음에 하면, 조급해지기도 할 뿐더러 담을 수 있는 내용도 한정적
- 10.10. 까지 1차 시안이 만들어지면, 문서작업을 하면서 어떤 부분이 중요한지 알 수 있어서 기능 구현 작업에도 도움이 된다.
- 모두가 참여하기 힘들다면, 일부 인원이 문서화 작업을 시작하는 것도 좋다.
- 시연 중에 발생할 수 있는 문제들을 방지하기 위해, 배포 자동화 하는 것을 추천
- 디자이너는 생각한대로 구현되고 있는지 계속해서 확인하는 작업을 해야 함.
-
https://millage.ml/의 라우팅 관련 이슈 -> nginx 세팅하기
백앤드로 요청할 것은 특정한 패턴을 두기 :/api
나머지는 Front의 index.html로 라우팅되도록 하기 - 반응형으로 작업할 꺼라면, 초반부터 신경 써서 작업을 진행해야 나중에 고생 안한다.
- 핵심 기능이 안보여서 외부에서 볼 때 조급하게 느껴짐
한 플로우라도 잘 흘러가야 시연 작업 및 발표가 가능하다. - 코드스페이스 작업 관련 문제는 멘토님께서도 주최측에 문의를 할 것.
- 다음 멘토링: 10. 9.(토) / 13:30 - 14:00
참석자: 박은찬, 김동현, 박수근, 최성흠, 황인규
- 수근
- 동현님과 회의: 게시판의 모든 페이지 기획 완료
(https://github.com/osamhack2021/WEB_Millage_ICM/issues/67 에서 확인 가능 - Board Routes 컴포넌트 제작
BoardMain, BoardView, PostView 페이지를 렌더링
BoardHeader, ContentBody, SideBox의 공동 레이아웃 - Board의 Backend API 연결 작업 시작
GetBoards API 연결 작업중
- 동현님과 회의: 게시판의 모든 페이지 기획 완료
- 인규
페이지의 state로 되어있는 데이터를 redux로 관리하도록 변경 작업
필요한 REST API 정리중 (완료되면 issue 등록할 것) - 은찬
socket 통신 작업
dm - 메시지 목록 불러오기, 채팅 주고받기 기능 구현
Backend Frontend 모두 작업 / 디자인 남음
nginx 설정 작업 - 성흠
board 모듈에서 요청한 API 구현
(Get Board, Create Board, Create Post, Upload Image ...) - 동현
수근님과 회의: 게시판의 모든 페이지 기획 완료
인터넷 복구됨. 당일 연등시간부터 작업할 수 있을듯.
작업 시간을 늘릴 수 있도록 소속 부대에 건의.
- 프로젝트 보드 지속적으로 업데이트 하기 !
- 이슈 및 커밋 수 늘릴 것 [인규, 동현]
- README.md는 github 위키로 작업. 하다가 안되면 google docs 사용할 것.
- 개발할 수 있는 기간이 얼마 안 남음. + 해야할 잡업무들이 많다. (개발 문서 뿐만 아니라, 반응형 처리 등등)
10.11.(월)까지 개인 기능을 구현 완료해야 우리가 목표한 대로 결과물을 완성할 수 있을 것.
- 개발하는 도중 기능 구현하는데 너무 오래 걸리겠다 싶은 것은 github issue나 디스코드에서 논의하여 빼도 좋다
- 논의 필요한 것은 바로바로 디스코드 하기. 개인 채널 연락도 좋다
- DB 및 local 서버 실행 관련
-
DB Ormconfig 파일은 개인적으로 공유 (DB는 24시간 접속 가능)
-
api 서버같은 경우 CORS 이슈로 code-space 에서 client server 랑 api 서버통신이 제한됨 따라서 로컬에서 서버를 돌릴 시 application/millage-client/src/constants/APIs.ts 에 다음과 같이 변경 후
export const SERVER = '/api'; export const SOCKET_SERVER = '';application 디렉토리에서 다음을 실행
yarn build:dist yarn server-start
-
참석자: 김성섭(멘토), 박은찬, 김동현, 박수근, 최성흠, 황인규
- Millage 팀에서 가장 걱정되는 것은 일정.
- 이제 추릴 것은 추려야 하는 기간
연휴가 끝나는 기간까지 디자인 작업을 해보고, 그것에 따라 해커톤 기간에 구현할 부분을 추리는 것이 필요 - 기능과 사용 시나리오가 만들어졌다 하더라도, 보여지는 작업이 진행되지 않으면 없는 것과 같음
- 연휴 기간까지 디자인을 최대한 완성하기
디자인 작업이 어떤게 진행중이고 완료된 것인지 공유해주는 것이 필요
디자인이 완료된 것은 바로바로 공유 -> 개발도 함께 진행될 수 있도록
개발이 완료된 것도 바로바로 공유 -> 디자인이 기획했던 대로 구현되었는지 확인
개발 기간은 한정적이기 때문에 한 부분에서 Pending되지 않도록 주의 ! - 디자인 작업이 끝나면 동현님이 시연영상 작업 시작
- 오늘은 현황정도만 체크
연휴 끝나고나서 주중에 진행상황을 봤으면 좋겠다.
그때도 진행상황이 안보인다면, 뺄꺼를 빼서 정리할 것. - 각자 멀리 떨어져서 일하기 때문에 서로 공유하는 것이 무엇보다 중요하다 !