[너는, 나는] 2주차 회고

비얌·2023년 12월 4일
0
post-thumbnail
post-custom-banner

📮 개요

멘토링 팀프로젝트 2주차가 끝나고 3주차가 시작되었다! 그래서
1주차 회고에 이어서 2주차 회고를 써보려고 한다.

🤓 이번 주 한 일

이번주 멘토링 팀프로젝트 관련 일정은 아래와 같았다. 일주일 내내 팀 프로젝트를 했다고 해도 과언이 아니다.. 바빴고 재미있었다!!

이번주에 한 일을 정리하자면 아래와 같다. 하나씩 자세히 알아보자!

  1. 기술스택 결정
  2. 개발환경 세팅
  3. 피그마 작업
  4. 개발 작업 순서 정하기
  5. 개발 관련 학습할 것 순서 정하기

기술스택 결정

프론트엔드 기술스택

프론트엔드 팀원과 기술스택을 정했다.

- 언어
    - TypeScript
- 프레임워크
    - Next.js page dir
- 스타일링
    - styled jsx
    - CSS 프레임워크(미정)
        - https://ant.design/
        - https://mui.com/
- 데이터패칭
    - react-query
- 전역상태 라이브러리
    - Recoil
- 패키지 관리
    - npm
- 배포
    - vercel

기술스택 결정 관련 고민들

  1. 프레임워크로 Next.js를 써도 될까?
    • Next.js로 프로젝트를 해보고 싶다는 생각을 했다.
    • 그런데 프론트엔드 팀인 나와 밤밤은 주로 React로 프로젝트를 해왔다.(정확히는 밤밤은 Next.js 경험이 있고 나는 없음) 따라서 Next.js를 쓴다면 개발과 동시에 Next.js 학습을 병행해야 한다.
  2. 디자인 시스템, 테스트, 모니터링을 해야 할까?
    • 프론트엔드 기술스택 관련해서 참고해볼 점을 버디가 올려주셨다.(참고만 하라고 하셨다!) 거기에 디자인 시스템, 테스트, 모니터링에 관한 언급이 있었다.
    • 프론트엔드 팀은 들어본 적만 있었고, 자세히는 몰랐다. 그래서 이걸 배워서 써야 하는지 고민이 되었다.

기술스택 결정 관련 조언

그 글을 올려주신 버디 이몬님과 질의응답을 하여 궁금증이 해결됐다. 그리고 프론트 팀 각각의 이력서를 보고 기술스택 관련 조언을 해주셨다!

  1. 프레임워크로 Next.js를 써도 될까?

    • Next.js를 배워가면서 하는 건 큰 허들이 되지는 않을 것 같다.
    • ‘가볍게 쓴다면’ 배워가면서 프로젝트를 할 수 있을 것 같다.
    • 그렇지만 Next.js만의 심화 개념을 배우기 어려울 것 같다.
  2. 디자인 시스템, 테스트, 모니터링을 해야 할까?

    • 테스트는 비즈니스 로직만 유닛테스트해보는 것도 좋을 듯!
  3. 그 외

    • 모달, 버튼 등을 어떻게 재사용하는 것이 좋을지 고민하면서 프로젝트를 하면 좋을 것 같다.
    • 이력서에 적을 것 상상하면서 프로젝트를 하자.
      • 이력서에 무슨 문구를 추가하고 싶은지?
      • 얻어가는 것이 있어야 한다!

개발환경 세팅

개발환경을 세팅해서 첫 커밋을 완료했다. 그리고 GitHub 프로젝트를 쓰기로 해서 프로젝트를 만들었다. 그리고 스프린트를 정해서 일정을 관리하기로 했다.

피그마 작업

피그마 작업을 했다. 이부분에서 이틀이나 걸렸는데, 디자이너처럼 피그마를 완벽하게 완성해야 한다고 생각해서였던 것 같다. 결국 타협해서 모두 디자인을 하지는 않았다. 대신 레퍼런스를 많이 찾아봤고 어디에서 어떤 레퍼런스를 참고할지를 정했다!

작업 순서 정하기

개발에 들어가기에 앞서 프론트엔드 개발 작업 순서를 정했다.

  1. global style 정하기(폰트, primary color 등 색상 변수)
  2. 공통 컴포넌트 작업
  3. 레이아웃 컴포넌트 작업(모바일 사이즈 관련 작업)
  4. 공통 페이지 스타일 작업(공통 레이아웃 요소인 navbar 등)
  5. MVP 목표에 맞춰서 페이지 작업

학습 순서 정하기

나는 이번 프로젝트에서 처음 써보는 기술이 많다. 처음 써보는 주요 기술이 3개인데, 이 기술을 동시에 공부할 수는 없을 것 같았다. 그래서 어떤 걸 먼저 공부하고, 어떤 걸 나중에 공부해야 할지 정하고자 했다. 그때 경험이 있는 프론트엔드 팀원 밤밤에게 조언을 구했다.

그래서 정해진 학습 순서는 아래와 같다.

  1. recoil (프론트엔드 전역상태관리) -> 로그인 상태를 쓸 때 사용할 것 같음
  2. Next.js (ssr, 라우팅)
  3. react query (서버 데이터 관리) -> api 연결시킨 이후에 쓸 것 같음

😌 아쉬운 점

  • 디자인 작업에 많은 시간을 쓴 것
    • 피그마 디자인을 완벽하게 할 수 있을 줄 알았다. 그리고 그렇게 해야 하는 줄 알았다. 다른 팀은 피그마 작업을 완벽하게 했길래 그렇게 생각했던 것 같다... 하지만 우리는 디자인 경험이 없어서 그점은 불가능했다! 그걸 늦게 알았던 것 같다.
    • 그러한 사실을 알려주고 방향을 잡아준 밤밤에게 감사하다.

🎉 잘한 점

  • 기술스택을 정할 때 버디께 도움을 요청해서 도움 받은 것
  • 코어타임 외의 시간에 팀플을 해서 이번주에 할 일을 모두 마친 것
    • 평일에 디자인 작업이 다 끝나지 않아서 주말에 작업을 했다.
    • 주말에 갑자기 병원에 가게 되어서 다음주로 아예 작업을 미룰까도 생각했는데, 그러지 않고 주말에 모두 끝냈다. 만약 안그랬다면 마음이 불편했을 것이다.

🚩 2주차 목표를 달성했는지

1주차 회고에서 2주차 목표를 세개 정했었다.

✅ 프로젝트 관련 고민이 있다면 멘토나 버디, 팀원에게 도움을 요청하자. 아니면 회의 때 가볍게라도 이야기를 꺼내보자. 👉 버디께 도움을 요청했다.
✅ 의견을 제대로 전달할 수 있도록 연습하자. 👉 연습은 안했지만 의식적으로 노력했다.
✅ 다른 팀 노션정독하기 👉 정독했다.

👉 👉 👉 모두 달성했다!

🐹 3주차에는?

  • 공부를 열심히 하자. 3주차에는 Recoil을 학습하기로 했다.
  • 코어타임을 최대한 활용하자. 그 외의 시간은 쓰지 않는다고 생각하고 코어타임에 몰입하자.
profile
🐹강화하고 싶은 기억을 기록하고 공유하자🐹
post-custom-banner

0개의 댓글