Skip to content

코드잇 프론트엔드 2기 12팀 기초프로젝트

Notifications You must be signed in to change notification settings

SeanKim-416/team-12-rolling

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

👨🏻‍💻 코드잇 스프린트 2기 12팀 | 기초 프로젝트

서비스 소개

롤링

롤링

깃허브 링크 : https://github.com/codeit-sprint2-team-12/team-12-rolling

데모 사이트 : https://fluffy-shortbread-07838a.netlify.app/

프로젝트 참여자

코드잇 스프린트 2기 12팀

  • 김광현
  • 성은지
  • 박지원(여)
  • 박지원(남)

프로젝트 기간

2023.12.9 ~ 2023.12.21

🛠️ 기술 스택

⚙️ 동작 기능

랜딩 페이지

스크린샷 2023-12-21 오후 4 08 45 랜딩 페이지에서는 롤링페이퍼 만들기, 사용자들이 만든 롤링페이퍼 목록으로 이동하는 기능을 제공합니다.

롤링 페이퍼 만들기 /post

스크린샷 2023-12-21 오후 4 11 58 포스트 페이지에서는 롤링 페이지 만들기 기능을 제공합니다. 스크린샷 2023-12-21 오후 4 19 09스크린샷 2023-12-21 오후 4 19 34

기본 컬러, 또는 이미지로 내 롤링 페이지를 꾸밀 수 있습니다.

다른 사용자들의 롤링 페이퍼 보기 /list

스크린샷 2023-12-21 오후 4 22 04

다른 서비스 이용자들의 롤링 페이퍼를 볼 수 있습니다.

인기순, 최신순으로 정렬되어있습니다.

사용자 롤링 페이퍼 /post/{id}

스크린샷 2023-12-21 오후 4 23 53

해당 사용자가 받은 롤링 페이퍼 페이지입니다.

스크린샷 2023-12-21 오후 4 26 34

사람들의 메세지를 보거나, 이모지를 통해 반응을 추가할 수 있습니다.

메세지 보내기 /post/{id}/message

스크린샷 2023-12-21 오후 4 28 02

롤링 페이퍼 주인에게 메세지를 보낼 수 있습니다.

🤔 프로젝트  진행 경과 및 발생 이슈

2023 / 12 / 08

  • 프로젝트 선정
  • 팀 규칙 설정
  • 스타일 적용 방식 선정 - styled components

2023 /  12 / 09 

  • 멘토링 반영
  • 페어 프로그래밍 협의
  • prettier 설정
  • 깃 레포지토리 생성

2023 / 12 / 11

  • git push pull 테스트

  • 랜딩 페이지 구현

  • 버튼 컴포넌트 구현

  • 페어 프로그래밍 활용

    페이지 하나를 다같이 직접 만들어보는 경험을 함으로써 앞으로의 방향성을 예상해볼 수 있었다. 하지만 협의 없이 무작정 페어 프로그래밍을 시도하다보니 드라이버와 네비게이터 분리가 안되었고 심적으로 여유가 없어서 진행이 순차적으로 이루어지지 않는 등 수월하지 않았다.

2023 / 12 / 12

  • 커밋 메세지 컨벤션 설정
  • 정형화된 컴포넌트 제작 역할 분담

전날 페어프로그래밍에서 좀 더 정형화된 역할 분담이 없으면, 진행 과정에 문제가 생길 것 같다는 의견을 팀원과 공유했다. 그러나 페어프로그래밍 경험자가 없었다는 문제가 있어, 페어프로그래밍을 함으로써 얻을 수 있는 장점을 살리기 힘들것 같다는 결론에 다다랐다. 업무의 효율성을 위해 각자의 역량을 최대한 발휘할 수 있도록, 정형화된 업무분담을 협의했다.

2023 / 12 / 13

  • 분담한 컴포넌트 결합

업무 분담을 통해 각자 컴포넌트를 제작하고 결합하였으나 해당 담당자가 필요로 하는 props 등 세부적인 기능을 고려하지 못한 문제가 발생하였다. 현재로써 완벽한 사용 방향을 알 수 없기 때문에, 사용 시 제작자와 협의 하면서 용도에 맞게 수정하는 방향으로 협의를 했다.

  • swagger api 분석

api를 곧 다루기 위해 swagger 문서를 모두 처음보다 보니 어떤 api가 어디에 쓰이고 어떤 값을 필요로 하는지 이해 할 필요가 있었다. 동작 테스트를 해보는 단계에서, 접근 방식을 찾지 못해 분석에 지장이 생기는 문제가 있었다. 이미 api 분석 및 테스트를 해본 경험이 있는 다른 팀의 동기들에게 조언을 구해봤다.

2023 / 12 / 14

  • 분담한 컴포넌트 결합
  • api 합수 일부 작성 및 동작 테스트
  • post 페이지 구조도 구상
  • README.md 획일화

2023 / 12 / 15

  • 랜딩페이지 제작 (완료)
  • /post/{id} 페이지 제작 (진행중)
  • /post 페이지 제작 (완료)

2023 / 12 / 16

  • 모든 페이지 라우터 결합
  • post/id/message 페이지 완성
  • list 페이지 제작중
  • post/id 페이지 제작중

2023 / 12 / 17

  • 배달의민족 사옥투어 & 위워크에서 멘토님과 모각코
  • 멘토님에게 프로젝트 진행 중 문제 질문 및 코드리뷰
  • 회고록 작성

2023 / 12 / 18

  • post/id 페이지 제작 진행
  • list 페이지 제작 진행
  • 잘못된 경로 페이지 처리

2023 / 12 / 19

  • URL 복사시 toast
  • 최근 메세지 작성자 프로필 이미지 보이도록 구현

2023 / 12 / 20

  • 삭제 페이지 레이아웃 디자인
  • list 페이지 인기, 최신별 롤링페이퍼 가져오기 기능 구현
  • 카카오톡 공유하기 기능 구현

2023 / 12 / 21

  • meta 오픈그래프 설정
  • 모바일 환경 레이아웃 버그 수정
  • 페이지 배포

About

코드잇 프론트엔드 2기 12팀 기초프로젝트

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 98.8%
  • HTML 1.2%