팀 프로젝트

프로젝트 종료

오늘로 지난 며칠간 붙잡고 있었던 팀 프로젝트가 종료되었다.
다음 영상은 종료된 프로젝트의 간단 시연 영상이다.

아래에 팀원들과 함께 작성한 회고록을 남긴다.

KPT 회고

Keep - 현재 만족하고 있는 부분

• 업무 분담 방식 - 전체 프로젝트를 기능별로 나누고, 기능 내에서도 세부 기능으로 나누어서 여러 사람이 동시에 프로젝트 진척을 이루어낼 수 있는 구조를 만들어냈음
• 깃헙 머지를 순서대로 차근차근 진행하면서 머지 별로 업데이트 사항과 에러 여부를 확인하고, 해결이 된 후에 순차적으로 머지를 진행해서 에러의 즉각적인 원인 파악과 해결을 추적할 수 있었음
• 1차적으로 업무 분담 후에 2차적으로 진행이 덜 된 부분을 체크하면서 꼼꼼하게 작업한 점이 좋았음
• 피그마를 디테일하게 설계하여 이후 작업할 때 구상하는 시간이 없어 효율적이었음
• Supabase를 처음 사용해본 것이라 걱정이 되었으나 결국 원하는 기능을 다 구현할 수 있었음.
• react query를 이용해 서버와 관련된 부분은 편리하게 기능할 수 있음
• 정기적인 git merge로 인해 충돌을 최소화한 것이 좋았음

Problem - 불편하게 느끼는 부분

• Next.js 사용이 미숙해서 Next.js 에서 제공하는 기능들을 전부 다 활용하지 못했음.
• Tailwind를 처음 써봐서 사용법을 익히느라 디자인을 원하는 만큼 하지 못했음
• 시간 제한 때문에 마지막에 typescript 몇 가지를 any로 설정해두었음
• yarn berry 의 unstable 한 버전(v4)을 사용하여 PnP 기능을 제대로 활용하지 못했음.
• mui 컨트롤이 미숙해서 원하는 UI부분을 만들어내지 못했음.
• tanstack/query 와 TypeScript를 함께 사용할때 발생하는 에러가 많아서 개발이 어려웠던 부분이 있었음.
• 적절한 date picker library를 찾는 데 굉장히 긴 시간을 소요했음
• Git rebase를 활용하면서 계속 branch를 왔다갔다 하며 commit history가 헷갈렸음
• auth 기능의 유효성 검사를 제대로 만들지 못했으며 서버 쪽의 이해가 부족하여 시도해보고자 한 기능을 만들지 못했음
• 드라이브 안에 로컬 작업물을 넣었더니 오류가 발생하였음

Try - Problem에 대한 해결책, 당장 실행 가능한 것

• Next.js 공부 꾸준히 계속 하기. 특히 이번에는 pages router 사용해 보았으니 app router도 따로 공부해보기!
• Tailwind 사용법 익혀야겠음
• 매개변수로 넘겨주는 type을 더 정교하게 설계하고 통일할 수 있는 방안을 모색하여 any를 한 번도 활용하지 않겠음
• yarn berry 를 쓰게 된다면 v3를 사용하면 PnP 기능도 제대로 활용 가능할 것으로 보임.
• tanstack/query를 쓸때 TypeScript 쪽에서 부여하는 제네릭 타입들에 대해 더 공부하면 사용이 수월해질 것으로 보임.
• 생소한 library를 무작정 프로젝트에 바로 적용하기보다, 1) 라이브러리 설명서와 데모를 미리 꼼꼼하게 파악 및 숙지해두고, 2) 더미 프로젝트를 별도로 만들어둬서 빠르게 구현해서 오류가 없는 라이브러리에 한해 본 프로젝트에 적용하겠음
• Git rebase의 논리를 정확히 이해할 수 있는 다양한 실습 프로그램을 도전해보겠음
• 서버에 데이터를 보내고 가져오는 원리에 대해 더 많은 공부가 필요할 것 같음.
• 로컬 작업물은 로컬 환경에서만 사용해야겠음

personal remark

팀 프로젝트가 끝나서 조금은 개운한 기분인데 이번 프로젝트를 통해서 스스로의 부족함을 많이 느낄 수 있었다. Next.js 를 이용한 개발을 하는것도 처음이었는데, Supabase사용도 처음이었고, 외부 UI 라이브러리를 사용해본 것도 처음이었으며, Yarn berry 사용도 처음이었고, Tailwind 사용도 처음이었어서 정말 처음부터 끝까지 이런 저런 어려움을 많이 겪은 프로젝트 였다.

개인적으로 완성도에 대한 아쉬움이 많이 남는 프로젝트이지만 그래도 거의 모든걸 처음 경험해본 프로젝트 였던 만큼 배우기도 많이 배웠다. 오히려 매일 매일 모르는 부분 찾아보고 공부하고 하느라 TIL 적는것에 소홀해 졌는데 다시 내일부터 새로 배우는 것들을 제대로 정리하려고 노력해야겠다.

Next.js 에 대해서는 공부를 더 해야겠다는 생각밖에 들지 않는다. 어떤 css 프레임워크처럼 선택적으로 사용하고 싶지 않다면 다른걸 사용할 수 있는 부분도 아니기에 반드시 어느정도 능숙하게 사용할 정도가 될때까지 스스로 노력해야 한다고 느낀다. 특히 이번에 pages router를 사용해 봤으니 따로 app router에 대해서도 공부해 봐야겠다는 결심을 해 본다. 이번 프로젝트에서는 아직 너무 미숙하여 Next.js 가 제공하는 장점들을 십분 활용하지 못해서 아쉬운데 다음에는 반드시 meta data 작성이나 ssr 에도 공을 많이 들일 생각이다.

Tailwind 에 대해서는 좋은 경험만 남는다. 처음에 className 부분이 길어지는 것에 대한 저항감이 조금 있었지만 조금 쓰다보니 금방 익숙해졌고, Tailwind 식으로 줄여쓰는 것을 몰라서 매번 검색해 봐야 했던 것만 제외하면 상당히 쓰기 편했다고 느낀다. 매번 컴포넌트 함수 밖에 선언해 줘야했던 styled-components 보다 오히려 편하다고 생각한다. 또한 className이 지나치게 길어지면 템플릿 리터럴을 이용해 변수화 할 수 있다는 것도 이번에 알았기 때문에 앞으로도 자주 사용할 것 같은 css 프레임워크이다.

tanstack/query 에 대해서는 아직 공부가 부족했다고 느낀다. 개발 중에 TypeScript를 사용하지 않았을때는 몰랐던 수많은 에러들을 직면했으며 이런 에러들을 깔끔하게 해결하지 못해서 결국 query 사용을 포기해야 했던 경우도 있었다. 특히 TS에서 query 에 부여하는 제네릭 type 들에 대한 이해가 부족하여 자료들을 검색해 보아도 이해하지 못했던 것이 답답하게 느껴졌다.

Supabase를 사용해 본 것에 대해서는 잘한 일이라고 느낀다. Firebase 보다 오히려 사용하기 편한 부분도 있었다. 프로젝트의 내용에 따라 noSQL 이 필요한 프로젝트에서는 Firebase를 쓰고 SQL이 필요한 프로젝트에서는 Supabase를 쓴다는 선택지가 생겼다는 것 만으로도 배운 보람은 충분하다고 생각한다. 물론 지금 사용해본 기능들은 Supabase에서 제공하는 전체 기능의 10%도 되지 않기에 아직 갈 길은 멀다.