저희 부트캠프에서는 수강생들의 니즈에 맞춰 과정 외 2개의 스터디가 진행 중인데요
그 중 사이드 프로젝트 후기에 대해 적어보겠습니다!
🚀 우리의 스터디 진행 방법
저희는 코딩을 처음 시작해본 팀원이 2명 있었고 다들 어리고 초보자인 팀이었어요!
부트캠프의 코스가 자기 주도적으로 학습하라는 분위기라 모두 정신없이 달려왔는데요.
react를 제대로 알고 사용하고 싶다는 팀원이 있더라고요.
모두 여기에 공감했고 먼저 4주간 react 공식문서를 읽으며 스터디를 했어요.
각 주마다 몇개의 챕터를 읽고 정리해서 md파일로 깃허브에 올렸어요!
2주 동안은 조금씩 나눠 발표하며 배운 내용을 공유했는데 뭔가 시간 낭비라고 느껴졌어요.
공식문서 하단에 개념에 관련된 문제가 있는데 그것처럼 챕터당 2개씩 문제를 내보는 것을 제안했고 팀원들이 오케이해줘서
다른 2주 동안은 공식문서처럼 문제를 내고 풀어봤어요.
다같이 학습하고 공유하며 기본기를 기를 수 있는 뜻깊은 시간이었어요 ☺️
그 후 본격적인 프로젝트를 진행했습니다!
💫 우리 팀의 프로젝트
1. 프로젝트 소개
저희는 왓챠처럼 영화나 시리즈를 보고 평가를 공유하는 사이트를 만들어보기로 했어요.
TMDB API를 사용해 영화, 시리즈 데이터를 받아와 정보를 띄우고 사용자들이 평점과 평가글을 등록할 수 있게 했어요.
페이지 디자인은 왓챠와 넷플릭스를 참고했어요.
2. 우리의 컨벤션
이슈 템플릿, pr 템플릿, project같은 깃허브 설정을 해두고, 코드 컨벤션을 정했어요.
그리고 prettier, eslint를 활용해 컨벤션을 적용했어요.
코드 컨벤션을 열심히 정해 두고 그냥 안 지키면 의미가 없기 때문에 설정한 정책을 강제적으로 지키도록 하기 위해 husky를 사용했어요.
pre-commit, commit-msg 파일을 통해 커밋메시지 린트를 적용하고 커밋 전 타입 검사, 린트 검사를 적용했어요.
그 외 자세한 사항은 깃허브 레포를 참고해주세요
https://github.com/Team-HandinHand/Side-project-HandinHand
✨ 솔직 후기
본 부트캠프 과정의 프로젝트로 정신 없는 와중에 틈틈이 사이드 프로젝트 회의도 하고 오류도 공유하고 해결하고 정말 다들 고생이 많았어요. 그래도 가만히 있으면 얻지 못했을 것들을 얻는 좋은 경험이었어요.
부트캠프에 대학생이 3명인데 다 저희 팀에 있더라고요?? 팀원들이 다들 착하고 나잇대도 비슷해서 고민도 많이 나눴던 것 같아요 (회의 끝나고 1시간은 수다 타임ㅎㅎ)
프로젝트 경험이 많지 않을 땐 코드 리뷰 다는 게 많이 미안해서 적극적으로 못했는데 점점 경험이 쌓일 수록 오히려 코드 리뷰를 제대로 하지 않아 발생하는 문제가 더 골치 아픈 걸 느꼈고, 더욱 객관적으로 하려고 노력중이에요!
이번 프로젝트에서 초기에 회원가입, 로그인, 프로필 수정 페이지를 맡았어요!
홈 페이지 외에는 로그인 후 페이지 접근을 허용하기로 해 책임이 막강했답니다 🥶
Supabase의 Auth 기능을 사용했는데 확실히 백엔드를 개발해 사용하는 것보다 쉽더라고요!
개인 프로젝트에서는 또 사용해보고 싶은 서비스에요.
구글 로그인도 추가하기로 했는데
redirectTo: `${getURL()}/auth/callback` 이 부분에서 이틀을 눈물을 흘리며 헤맸어요.
redirectTo: getURL() // 앱 주소처음엔 이렇게 쓰고 supabase users테이블엔 레코드가 추가되는데 리다이렉트가 안되서 눈물이 났는데요...
signInWithOAuth를 호출할 때, 콜백 경로를 가리키는 redirectTo URL은 리디렉션 허용 목록(redirect allow list)에 추가되어야 한다고 해요.
저는 기본 앱 주소에 인증되지 않은 사용자는 접근하지 못하게 해 놔서 리다이렉트가 안됐던 거였어요.
signInWithOAuth 호출
-> 구글 로그인 페이지로 리다이렉트, 구글 인증 완료
-> 지정된 redirectTo URL로 리다이렉트 (이 시점에서 세션 초기화 시작)
-> 세션 설정 완료 이 단계로 이뤄지므로 redirectTo URL은 꼭 인증되지 않은 사용자도 접근할 수 있는 주소여야 해요!!
코드 자체는 간단한데 오류가 뜨는 이유를 모르겠어서 한숨만 나왔던 경험이었네요...
이번 프로젝트가 난이도가 엄청 높다는 생각은 안 드는데요. 다른 프로젝트를 하며 조금씩 시간을 내서 하다보니 오류를 만났을 때 더 당황스럽고 빨리 해결해야 한다는 압박감이 있었던 것 같아요.
천천히 생각하는 힘도 기를 필요가 있다고 생각합니다. 별 거 아닌 것도 부풀리는 경향이 있는 것 같기도,,,
이전 토이 프로젝트에선 빌런이 조금 있었는데
이번 사이드 프로젝트에선 팀원들도 누구 하나 귀찮아 하는 사람 없이 잘 따라와줬고 최선을 다하는 게 느껴져서 참 고마웠어요.
이제 파이널 프로젝트만 남았는데 기회가 된다면 같이 프로젝트를 진행해보고 싶어요!!
