• 🔗 서비스링크

• 🔒 서비스 이용을 위한 테스트 계정

  • ID: [email protected]
  • Password: 123456

1 프로젝트 소개
2 팀원 소개
3 개발 환경
4 팀 협업 방식
5 구현 기능
6 개선 노력
7 느낀점

입9팔9는 데일리룩과 취향을 공유하는 SNS로 공유한 제품판매가 가능합니다.
입9팔9는 새컨핸드 제품 사용과 지속가능한 패션을 지향합니다.

• 2023년 6월 1일 ~ 2023년 6월 28일

FE 최범관	FE 박경보	FE 유하은	FE 한상헌
팀장 🔗 KwanBeom	팀원 🔗 kyeongboo-coder	팀원 🔗yonainthefish	팀원 🔗 skyllerrr
팀 리딩 & 테크리딩	프로젝트 기획 & 진행, 문서화	로고 디자인 & 피그마제작	유효성검사 & UI 개선

• 404에러 페이지
• 팔로워 팔로잉 페이지 리팩토링
• 홈피드 페이지 기능 구현
• 게시물 상세 페이지 기능 구현
• 상품 등록 페이지
• 상품 상세 페이지
• 상품 리스트 페이지
• 프로필 페이지
• 프로필 수정 페이지
• 로딩 페이지
• 모달 컴포넌트
• 헤더 컴포넌트
• 바텀 시트
• 하단 탭바
• 디바운싱 활용해서 유저 검색 기능 최적화

• 스플래쉬 페이지
• 홈피드 UI
• 유저 검색 페이지
• 팔로워 팔로잉 페이지
• 하단 탭바

• 프로젝트 디자인 총괄
• 회원가입 페이지
• 게시물 업로드 페이지
• 댓글 등록, 수정, 삭제 UI구현
• 하단 탭바
• 버튼 공통 컴포넌트
• 리드미 작성
• 발표

• 서비스 컨셉 기획
• 로그인 페이지
• 게시물 업로드 페이지
• 댓글 등록, 수정, 삭제 기능 구현
• 버튼 공통 컴포넌트
• 회의록 작성
• 리드미 작성
• 발표

프론트엔드
백엔드	멋쟁이 사자처럼에서 제공받은 API 명세
도구 및 라이브러리
협업 및 프로젝트 관리
디자인

feat        : 기능 (새로운 기능)  
fix         : 버그 (버그 수정)  
refactor    : 리팩토링  
design      : CSS 등 사용자 UI 디자인 변경  
comment     : 필요한 주석 추가 및 변경  
style       : 스타일 (코드 형식, 세미콜론 추가: 비즈니스 로직에 변경 없음)  
docs        : 문서 수정 (문서 추가, 수정, 삭제, README)  
test        : 테스트 (테스트 코드 추가, 수정, 삭제: 비즈니스 로직에 변경 없음)  
chore       : 기타 변경사항 (빌드 스크립트 수정, assets, 패키지 매니저 등)  
init        : 초기 생성  
rename      : 파일 혹은 폴더명을 수정하거나 옮기는 작업만 한 경우  
remove      : 파일을 삭제하는 작업만 수행한 경우

 입9팔9
├──🗃️ public
└──🗃️ src
    ├──🗂️ assets/images
    ├──🗂️ components
        ├──📁 Button
        ├──📁 FollowButton
        ├──📁 FollowItem
        ├──📁 Footer
        ├──📁 Header
        ├──📁 HeaderMenu
        ├──📁 Modal
        ├──📁 Post
        ├──📁 Products
        ├──📁 Profile
        ├──📁 ShareModal
        ├──📁 UserList
    ├──🗂️ contexts/ModalContext
    ├──🗂️ hooks
    ├──🗂️ pages
        ├──📁 404
        ├──📁 FollowList
        ├──📁 HomeFeed
        ├──📁 IntroLogin
        ├──📁 Login
        ├──📁 Post
        ├──📁 PostDetail
        ├──📁 PostUpload
        ├──📁 ProductDetail
        ├──📁 ProductList
        ├──📁 Profile
        ├──📁 ProfileSettings
        ├──📁 Search
        ├──📁 SignUp
        ├──📁 Splash
        ├──📁 UploadProduct
    ├──🗂️ routes
    ├──🗂️ style
    └──🗂️ utils

- GitHub issue : 프로젝트 작업 개선사항 및 추가 될 기능을 기록하여 작업일정을 팀원들과 공유했습니다. 
- 데일리스크럼 : 매일 9시 ,17 금일 작업 내용과 진행 상황을 공유했습니다.
- GitHub wiki : 팀내 공유되야 하는 정보와 회의내용을 기록하였습니다.
- Live share : VSC 의 Live share를 사용하여 더 나은 코드를 위한 토론을 진행하였습니다.
- 오프라인 회의 : 정기 오프라인 회의를 통해 진행상황을 공유하며 일정조율 및 작업방향을 맞춰가는 시간을 가졌습니다

📌 GitHub Wiki

🔗 각 페이지에 대한 상세 설명 페이지로 이동하기

스플래시	이메일로 회원가입	프로필설정
로그인	홈피드	유저검색
로딩페이지

게시물등록(다중선택)	게시물 수정/삭제	게시물 상세 페이지

내프로필	내프로필수정	상품등록
상품수정/삭제	팔로잉/팔로워	로그아웃

- 추후 확장 및 유지 보수를 고려해 `재사용되는 컴포넌트`는 별도로 common 폴더에서 관리하고 있습니다. 
- 효율적인 작업상황을 고려하여 `반복되는 함수`는 utils 폴더로 따로 분리하여 사용했습니다.  
- 이후 리팩토링시 진행 예정인 다크모드, 반응형 작업을 위해 `변수컬러와, rem 단위`를 사용하여 작업에 진행했습니다. 
- 사용자 경험을 고려하여 `UX 디자인 제작` (Footer를 통해 화면에서 바로 접근하기 어려운 페이지를 라우팅 하였습니다.)
- `로딩 애니메이션`을 추가하여 사용자가 로딩 상태를 인지할 수 있도록 했습니다.
- `useParams`를 이용해 사용자의 아이디를 받아와 정보를 띄워줍니다. 내 프로필에서는 상품 등록 및 프로필 수정 페이지로 이동할 수 있는 버튼이 나타나고, 다른 유저의 프로필에서는 팔로우 버튼이 나타납니다.
- 댓글 모달 클릭시 내 댓글이면 삭제, 다른 유저의 댓글이면 신고 기능을 사용할 수 있습니다.

🐯최범관

문제를 해결하기 위해 끊임없이 소통하면 보다 나은 결과를 얻을 수 있음을 깨달았고,
각자의 의견을 나누며 모두가 함께 움직이는 것이 프로젝트의 성공에 필수적이라는 것을 깨닫게 되었습니다.
협업을 통해 함께 성장해 나갈 수 있는 즐거움을 느낄 수 있어 좋았고, 기술적으로나 정신적으로 한 발짝 더 나아갈 수 있는 좋은 경험이었습니다.

🐱‍💻한상헌

프론트엔드 팀 프로젝트 자체는 이번 멋사에서 처음해보는 경험이라 처음에 어떻게 갈피를 잡아야할지 많은 고민이 있었는데
프로젝트를 시작하기에 앞서 체계적으로 초기 설정을 잘 잡아야 원활하게 진행할 수 있다는 점을 느껴서,
앞으로 어떻게 효율적으로 프로젝트를 진행할 수 있는지 배울 수 있어서 좋은 경험이었습니다.
그리고, 리액트로 진행하는데 오류도 많이나고 구현하지 못하는 부분도 많이 생겨서 그럴때마다 저희 팀원분들이 옆에서 많은 도움을 주셔서 너무 감사드렸고, 부끄럼없이 끊임없는 질문을 하거나 코드의 오류를 잘 해결하고 리팩토링하는 능력은 지금 제가 많이 부족하다고 생각하는데 저희 팀원분들한테 이 장점들을 많이 배웠던 것 같습니다.
또, 프로젝트 기간동안 멘토님께서도 궁금한 점이나 따로 코드리뷰를 해주셨는데, 제 스스로 많은 도움을 받아서 너무 감사했습니다.
비록, 한달도 안되는 짧은 시간동안 급하게 프로젝트를 진행하게 되어서 많이 힘드셨을텐데 정말 고생많았고 마지막으로, 저희 팀원분들한테 프로젝트 진행하는동안 항상 감사했다고 말씀드리고 싶습니다.

🐠유하은

모든 순간이 배움의 연속이었습니다.
배움의 즐거움과 고통이 함께 있었지만 그렇기 때문에 프로젝트 기간 정말 많이 성장할 수 있었던 것 같습니다.
작업을 할 때 문서화와 기본기 그리고 기준의 중요성에 대해 다시 깨닫는 시간이었습니다. 모두가 처음하는 프로젝트로 시행착오도 많았지만 팀원분들과의 협업을 통해 기술적인 부분외에도 많은걸 느끼고 팀원분들의 열정적인 태도에 좋은 자극도 많이 받았습니다.
마지막까지 함께 해주시고 고생하신 21조 팀원분들 모두 감사하고 고생 많으셨습니다.

🦄박경보

저는 이번에 처음 진행하는 팀프로젝트여서 모든 과정이 배우는 과정이였습니다. 프로젝트 시작 전에는 어떤 이야기를 나누어야하는지 프로젝트 진행과정은 어떤식으로 이루어지는지 등등 사실 아직 배운 내용을 제대로 소화하지 못했고 실력이 많이 부족해서 UI나 기능을 구현함에 있어서 제 역할을 잘 해냈다고는 생각하지 않지만 그럼에도 불구하고 어쨌든 중간에 포기하지 않고 발표까지 왔다는 것에 대해서 제 자신이 너무 대견하고요. 제가 이렇게 온전한 정신으로 프로젝트 발표까지 마무리할 수 있었던것은 묵묵히 제 역할을 해내준 너무 고생 많으셨던 저희 21조 프로젝트 조원 분들과 항상 응원과 조언 아끼지 않던 회고조 분들 그리고 다소 답답한 질문에도 불편한 내색 없이 아주 자세하고 인내심있게 제 질문내용에 대해서 항상 발벗고 나서서 답해주셨던 김유진 멘토님과 항상 격려 아끼지 않고 도움되는 말씀 많이 해주셨던 강사님들과 멘토님들이 있었기 때문 아닌가 싶습니다.그리고 저희 조원 분이 아니신데도 질문에 정성스럽게 답변 주셨던 분들도 너무 감사드립니다. 모두 감사해요!