협업할 때, 고려해야할 점 & 가이드를 기록하는 공간
잡담
1월 5~6일? 오프라인 기간에 기획 & 개발세팅까지 마치고, 온라인으로 빠르게 작업할 수 있도록 해두면 좋겠네요 ㅎㅎ
저도 그렇게 하면 좋다고 생각해요. 디자인도 만들어야하니… → 맞아요..3주 프로젝트는 안해봐서..개발 규모가 감이 안잡히네요..!
오프라인에서 정할 것
// 각 팀원들 협업 전략
(한수화 개인적인 팀플협업) 코딩 컨벤션, 커밋컨벤션, 이슈템플릿, pr템플릿 브랜치전략: 브랜치 파서 작업하는 git flow (upstream, origin) (굳이..?) 이슈, 칸반보드 - 할 것들 기록해두고, pr올릴 때 이슈 링크 → 코드리뷰 → 반영 → 머지 https://github.com/Instagram-Clone-Coding/React_instagram_clone
- 변건오
- 기능별 or 페이지 별로 역할분담하여 팀 프로젝트 진행
- issue, pr은 사용 안하고 각자 feature 브랜치 파서 merge 하는 식으로 진행
- 과제 형식이여서 주어진 기술 스택, 요구사항만 충족하려고 노력함
- 한 사람이 화면 공유하면서 초기 세팅을 다 같이하고 github에 올려서 세팅 파일을 각자 받아서 프로젝트를 진행함
// 시간날 때 협업 경험 공유해주세요 : )
회의 흐름
- 킥 오프 회의: 팀 문화, 팀 목표, 협업 툴(노션, 슬랙 등), R&R(이게 뭐죵?→ 역할분담) 논의
- 기획 회의
- 개발 환경 및 협업 룰 세팅 회의 - 프로젝트 초기 세팅, 컨벤션, 코드 리뷰 문화 등 논의
협업 툴
- 노션: 아카이빙용
- 슬랙: 메시저
- 디스코드: 메시저, 음성 채팅
- 지라, 깃허브 프로젝트: 프로젝트 관리, 마일 스톤, 이슈 관리
- 프그마, 피그잼(이게 뭐죵?): 디자인 프로토타입
os → 윈도우(건오, 천욱), 맥(그 외)
정해야할 것
- 대략적인 계획(러프한 계획)
- 역할분담
- 주제
- 팀문화, 소통주기 (클로즈스크럼)
- 배포 - netilfy
- npm vs yarn → yarn (왜 yarn을 사용해야 하는가?) , nvm
- cra(webpack, vite) vs 처음부터 세팅 → vite ts-react
- prettier default
// 수화설정파일 <- 오프멘토님 설정파일 // 설정파일을 엄격하게 하면, 통일? 통일 { "singleQuote": true, "printWidth": 90, "tabWidth": 2, "useTabs": false, "semi": true, "quoteProps": "as-needed", "trailingComma": "es5", "arrowParens": "always", "endOfLine": "lf", "bracketSpacing": true, "requirePragma": false, "insertPragma": false, "proseWrap": "preserve" }
- eslint
명재님: 에어비앤비
수화님: 리코맨드
리코맨드로 default 하고 추가할 role이 생길 경우 회의를 통해 추가하기
1주차: 기획 & 디자인 시안 & 세세한 계획표 + 프로젝트 초기세팅(배포, npm yarn.., eslint, prettier)
2주차: 기능 개발 (1차 발표가 있을 예정)
3주차: 기능 개발(마무리 단계) + 배포 + 리팩토링 시작 (큰 틀의 기능 구현을 완성하고 리팩토링)
→ 어느 부분을 리팩토링할지 다 같이 이야기해보기 + 멘토님과 리팩토링에 대해 물어보기
프로젝트 목표
개인적인 목표 : 프로젝트에서 이루고 싶은거나 해내고 싶은 것 등등
수화: 프론트 팀원과 함께 작업하는 것에 익숙해지기 → 협업 명재: 기능별로 세세한 계획을 목표하고 목표한 계획을 미루지 않고 마무리하기 → 협업천욱: Git을 더 잘 쓰고, 사용하는 기술스택에 대해 깊게 이해하기 건오: 상태 관리에 대한 이해도를 높히고 코드 컨벤션을 지키면서 클린 코드 작성하기 최별: 목표한 부분까지 최대한 잘 구현하고, 싸우지 않고 협업하기! → 개발팀 목표 : 프로젝트에서 이루고 싶은거나 해내고 싶은 것 등등 **** 다시 적기
협업능력 향상과 계획적인 프로젝트 진행, 마무리 → 협업으로 함께 성장하기?
나영팀 규칙
- 소통
- 소통채널
- 슬랙 + 디코 + 카톡 + 구글 미트 (화면 공유도 생각해야 함)
- 온/오프
- 온라인: 일 2회 - 오픈스크럼 / 클로즈스크럼 + 카메라 on !!
- 오픈 스크럼
- 클로즈 스크럼
- 오프라인: 주에 1번 (화/수) - 프로그래머스 교육장 or 카페
- 회고
- 1~3일 단위 짧은 스프린트, 태스크 정리
- 문화
- 슬랙 → 하루 작업 스레드 → 댓글: 힘들면 이모지 남기기(도와주러가기)
- 개발
- 코드리뷰
- 리뷰어 관리
- 5명 pr에 2명이상 승인 → 머지 || (검토깊이) 코딩스타일, 치명적인 에러있는지
- pr 단위는 file change 10이하
- 기능별로 pr 올리고, pr에 대한 deal lined을 정하기 (pr template, commit template, issue template은 목요일 오프라인으로 정하기)
팀 규칙 & 문화
수화: 짧게 칭찬해주는 시간도 있으면 좋을 거 같아요 + 칭찬 & 박수받는 시간명재: 프로젝트를 진행하면서 각자가 습득한 지식을 공유하는 시간 가지기천욱: 상대방 배려 존중건오: 현재 자신의 진행도에 대해 자주 말하기, 진행이 덜 되었다면 함께 시간내서 도와주기 → (중요도에 따라 급한 기능이면 다 같이 얼른 해결하기)
최별: 일정 못 맞추면 빨리 얘기하기 + 서로 배려하기소통주기, 방법 : 회의, 소통, 회고 등 언제 얘기하고, 어떤 방식으로 소통할지!
- 1일에 1회, 회고 가능한가요? 코드리뷰도…(일주일에 한번이나…3일에 한번? 주기를 정해보죠)
F5 회고 방식,4L 회고,스프린트 회고,KPT 회고
- 주영님 발표: 회고를 너무 거창하게 생각하지 말고, 그 날 배운 거 간단하게 정리하는 시간 + 감정정리
수화 : (온라인) 하루에 최소 1번은 카메라 켜고, 소통
→ 어떤 걸 했고, 지금 뭘하고 있고, 이후에 할 일중에 어려워보이는 것들, 고민되는 부분 공유
+ 주에 1번정도는 오프라인으로 모여서 같이 개발해도 좋을 거 같아용명재: 데일리 회고를 간단하게 남기기→ 데일리 회고를 통해 팀원이 어떤 어려움을 격고 있고 어떤 업무를 진행하는지 파악할 수 있어서 좋은 아이디어라고 생각해요.
천욱: 작업중이라면 디스코드 나영팀 음성 채널 참가하기→ 작업하다가 이슈가 생기면 바로바로 공유할 수 있어서 속도 향상에 도움이 될 것 같습니다.
건오: 일정 시간마다 자신의 상황 적기 (문제를 해결하는데 2~3시간 이상이 걸리면 공유하기)→ 괜찮게 진행되고 있다면 😄, 문제가 발생하면 😥, 도움이 필요하면 😱 등등 소통하기
→ 한 문제에 너무 많은 시간을 투자하면 프로젝트 일정에 차질이 생길 것 같아 시간을 정해두고 이 안에 해결하지 못하면 팀원들과 함께 찾아보며 빠르게 진행해야 한다고 생각합니다.
최별: 오픈 스크럼 때 할 일 적고, 클로즈 스크럼에 오늘 한 일 공유(너무 자주인가요?), 작업 중에 디스코드 들어와있기역할분담 : 어떤 역할이 필요할지! 막 던져볼까요..?
역할 자체를 나눠서, 팀장, 매니저 필요없이(?)
- 작은 것까지 역할 나누기
R&Rex) 팀 디제이, 분위기메이커..등
- 서기 (회의, 스크럼) **
- 기획서
- README
- 스크럼 정리
- Github wiki ← 기획서?
- 스케쥴러 (일정 짜기, 진행 상황 확인)
- 리뷰어 관리(수화님의 랜덤 박스로 순서 알려주기 & 리뷰 알림)
개발 환경 세팅
각자 FE개발 및 협업 경험 공유하기
- nvm으로 node 버전 공통 관리하면 npm package 관련 issue를 미리 해결 가능
(인정..노드버전 다르면 배포할 때 깨지더라구요..ㅎㅎ 알고싶지 않았음)
- vscode workspace 통일하지 않으면 불필요한 commit이 발생할 수 있다. (이건 개인 의견 ㅠ..) ← pretteir, eslint 설정파일 두면, 워크스페이스보다 설정파일이 우선적으로 적용되는거로 아는데.. 설정파일 두면 되지않을까용? (맞아요. 그래서 자동 완성 기능을 미리 토론하고 off 시키는게 좋지 않을까요?)
컨벤션
(팀 회의로 논의가 필요)
코드 컨벤션
어느 정도까지 정할건지..!
ex) props 2번 이상 넘기면, 전역상태로 관리
폴더구조
커밋 컨벤션
깃모지이슈 템플릿
pr 템플릿
브랜치 전략
git flow(저는 이거로 작업해봤는데 좋더라구요 → 배민이 작업하는 방식)
ex) 코드리뷰 2명 이상 받은 후, pr 머지