(회고록에 사진을 첨부하였으나, 노션 서버상의 문제로 사진이 읽히지 않는것 같아 추가로 저희 회고록을 작성하였던 노션 링크를 첨부합니다)
링크
현재 프로젝트를 진행하며 어려웠던 점과 문제점, 해결방안을 팀끼리 논의한 후 회고록을 작성하였습니다.
- 어려웠던 점과 문제점
- github 협업
- issue 단위 지정
- gitFlow 전략 사용 gitFlow 전략을 처음 도입하다 보니, 시행착오를 많이 겪었습니다. 또한 그에 따라 브랜치를 생성하고, 머지 하는 과정에 적응하느라 어려웠습니다.
- 회의 진행 코로나로 인해 물리적으로 만나기 어렵다 보니, 온라인에서 협업 툴을 사용하여 협의해야 할 부분과 각자 해결해 나가야 할 부분을 나눠서 의견을 공유하는 방식으로 진행하였는데, 직접 만나 소통하는 것보다 내용을 전달하는 방식이 제한되다 보니, 의도한 내용을 완전하게 전달하기 어려웠습니다.
- 새로운 디자인 툴(Figma) 사용
칸반 보드 사용이 처음이라 신경 써야 될 부분이 많고 익숙하지 않아서 사용하는 데 있어서 어려움을 느꼈습니다.
issue를 작은 단위로 나누어 작성하는 방법이 어려웠습니다.
작은 단위로 나누어 작성했다고 생각했지만 막상 이슈를 토대로 개발을 진행하다 보면 이슈와 연관성이 다소 떨어지는 코드를 만들기도하며,
issue 작성 후 개발을 진행을 한다는 점에서 개발 전에 issue와 관련된 개발 내용들을 생각하는데 다소 어려움이 있었습니다.
개발뿐만 아니라 디자인 구상을 통해 디자인 툴(Figma)을 사용하여 진행해야 했는데,
팀원 모두 처음 사용하는 툴이었기 때문에 사용에 있어서 어려움을 느꼈습니다.
- 해결방안
- github 협업 팀원이 정리해서 제공해 준 자료를 숙지하여 적용하다 보니, 몇 번의 실수를 통해 이해하여 적용할 수 있었습니다.
- issue와 gitFlow 전략 사용 기존에 문서로 작성했던 프로토콜을 바탕으로 연습하다 보니, 전반적인 개발 과정을 이해할 수 있었고, 반복적인 연습을 통해 극복하였습니다.
- 회의 진행 다양한 협업 툴(slack, discord, zoom, figma 등)을 사용해 보며 의사전달에 적절한 도구들을 찾아나가기 시작하였습니다. 실시간으로 활동 여부를 시각적으로 확인할 수 있는 도구들을 발견하였고, 상황에 따라 필요한 협업 툴들을 동시에 사용해 나감으로써 물리적인 한계를 극복할 수 있었습니다. 특히, 회의툴의 화면 공유 기능을 활용하여 팀원들이 모두 같은 내용을 공유할 수 있어, 개발 과정에 있어서의 혼선을 최소화할 수 있었습니다.
- 새로운 디자인 툴(Figma) 우선적으로 팀원들에게 문제를 공유하여 해결하였고 이를 통해 해결되지 않는 문제들은 구글링을 통해서 해결해나갔습니다.
🛠기술스펙
Front-End
- CSS: styled-Component
- React: CRA, React Router
- State management Lib: context API
- HTTP 통신 : Axios
Build
- Deploy: Netlify
- Bundler: Webpack
- Builder: npm
Communication
- github
- slack
- discord
- notion
- zoom
IDE
- vscode
- webstorm
👨🎨 시안
디자인 요소

루트 페이지
.png)
프로필
.png)
포스팅 작성 페이지
.png)
회원가입 페이지
.png)
포스팅 상세보기 페이지
.png)
건강/행동심리, 추천애완용품, 펫플레이스, 산책 메이트, 입양 페이지

최종 정리
프로젝트 기획
- 주제 선정
- 기획서 작성
- 요구사항 분석서 작성
- 와이어 프레임 작성
- 기술스펙 및 아키텍처 구성
- 컴포넌트 분석 및 설계
- commit 컨벤션 및 code 컨벤션 구성
gitFlow 전략 기반 개발
- 프로젝트 세팅(issue, PR 템플릿 작성)
- issue 작성
- issue 기반 branch에서 개발 진행
- PR 작성
- 코드 리뷰
- 피드백 반영 및 Merge 진행
진척도

현재 프로젝트를 진행하며 어려웠던 점과 문제점, 해결방안을 팀끼리 논의한 후 회고록을 작성하였습니다.
- 어려웠던 점과 문제점
- github 협업
- issue 단위 지정
- gitFlow 전략 사용 gitFlow 전략을 처음 도입하다 보니, 시행착오를 많이 겪었습니다. 또한 그에 따라 브랜치를 생성하고, 머지 하는 과정에 적응하느라 어려웠습니다.
- 회의 진행 코로나로 인해 물리적으로 만나기 어렵다 보니, 온라인에서 협업 툴을 사용하여 협의해야 할 부분과 각자 해결해 나가야 할 부분을 나눠서 의견을 공유하는 방식으로 진행하였는데, 직접 만나 소통하는 것보다 내용을 전달하는 방식이 제한되다 보니, 의도한 내용을 완전하게 전달하기 어려웠습니다.
- 새로운 디자인 툴(Figma) 사용
칸반 보드 사용이 처음이라 신경 써야 될 부분이 많고 익숙하지 않아서 사용하는 데 있어서 어려움을 느꼈습니다.
issue를 작은 단위로 나누어 작성하는 방법이 어려웠습니다.
작은 단위로 나누어 작성했다고 생각했지만 막상 이슈를 토대로 개발을 진행하다 보면 이슈와 연관성이 다소 떨어지는 코드를 만들기도하며,
issue 작성 후 개발을 진행을 한다는 점에서 개발 전에 issue와 관련된 개발 내용들을 생각하는데 다소 어려움이 있었습니다.
개발뿐만 아니라 디자인 구상을 통해 디자인 툴(Figma)을 사용하여 진행해야 했는데,
팀원 모두 처음 사용하는 툴이었기 때문에 사용에 있어서 어려움을 느꼈습니다.
- 해결방안
- github 협업 팀원이 정리해서 제공해 준 자료를 숙지하여 적용하다 보니, 몇 번의 실수를 통해 이해하여 적용할 수 있었습니다.
- issue와 gitFlow 전략 사용 기존에 문서로 작성했던 프로토콜을 바탕으로 연습하다 보니, 전반적인 개발 과정을 이해할 수 있었고, 반복적인 연습을 통해 극복하였습니다.
- 회의 진행 다양한 협업 툴(slack, discord, zoom, figma 등)을 사용해 보며 의사전달에 적절한 도구들을 찾아나가기 시작하였습니다. 실시간으로 활동 여부를 시각적으로 확인할 수 있는 도구들을 발견하였고, 상황에 따라 필요한 협업 툴들을 동시에 사용해 나감으로써 물리적인 한계를 극복할 수 있었습니다. 특히, 회의툴의 화면 공유 기능을 활용하여 팀원들이 모두 같은 내용을 공유할 수 있어, 개발 과정에 있어서의 혼선을 최소화할 수 있었습니다.
- 새로운 디자인 툴(Figma) 우선적으로 팀원들에게 문제를 공유하여 해결하였고 이를 통해 해결되지 않는 문제들은 구글링을 통해서 해결해나갔습니다.
프로젝트 중간 발표 영상
🛠기술스펙
Front-End
- CSS: styled-Component
- React: CRA, React Router
- State management Lib: context API
- HTTP 통신 : Axios
Build
- Deploy: Netlify
- Bundler: Webpack
- Builder: npm
Communication
- github
- slack
- discord
- notion
- zoom
IDE
- vscode
- webstorm
👨🎨 시안
디자인 요소

루트 페이지
.png)
프로필
.png)
포스팅 작성 페이지
.png)
회원가입 페이지
.png)
포스팅 상세보기 페이지
.png)
건강/행동심리, 추천애완용품, 펫플레이스, 산책 메이트, 입양 페이지

최종 정리
프로젝트 기획
- 주제 선정
- 기획서 작성
- 요구사항 분석서 작성
- 와이어 프레임 작성
- 기술스펙 및 아키텍처 구성
- 컴포넌트 분석 및 설계
- commit 컨벤션 및 code 컨벤션 구성
gitFlow 전략 기반 개발
- 프로젝트 세팅(issue, PR 템플릿 작성)
- issue 작성
- issue 기반 branch에서 개발 진행
- PR 작성
- 코드 리뷰
- 피드백 반영 및 Merge 진행
진척도
