[회고록] 2차 팀프로젝트 후기

프로젝트 소개

Github 보러 가기 👈

필링 Demo 영상 보러 가기 👈

• 필링 (필리 클론코딩)
• 개발기간 : 2021/9/13 ~ 2021/10/1
• 개발 인원 : 프론트엔드 3명, 백엔드 2명

적용 기술

• -Front-End : JSX, React, Hooks, Styled Component
• -Back-End : Python 3.8, Django 3.2.7, MySQL 8.0.23, Unittest
• -Common : Postman, Slack, Trello, AWS

내가 맡은 부분

회원가입 / 로그인 페이지

• 회원가입, 토큰을 이용한 로그인, 로그아웃 기능
• 카카오소셜 로그인 기능
• 유효성 검사 로직에 따른 레이아웃 구현
• 모두 동의하기 기능 구현

내비게이션 바

• 메뉴 클릭시 해당 페이지로 이동하도록 라우팅 구현
• 로그인, 로그아웃 시 내비게이션 바 레이아웃 변경 구현

설문조사 결과

• 로그인한 유저의 설문조사 결과 상세페이지 렌더

상세 페이지

• 장바구니 추가 기능 구현
• 장바구니 추가 여부 팝업창 구현

프로필

• 프로필 내 설문조사 결과 메뉴에서 로그인한 회원의 설문 결과 렌더
• enum 패턴을 활용한 코드 간결화

기억에 남는 코드

  const kakaoSignIn = e => {
    e.preventDefault();
    window.Kakao.Auth.login({
      success: function (authObj) {
        fetch('백엔드 카카오 로그인 API 주소', {
          method: 'POST',
          headers: { Authorization: authObj.access_token },
        })
          .then(res => res.json())
          .then(res => {
            localStorage.setItem('Kakao_token', res.access_token);
            if (res.access_token) {
              alert('Filling에 오신걸 환영합니다!');
              history.push('/');
            }
          });
      },
      fail: function (err) {
        alert(JSON.stringify(err));
      },
    });
  };

카카오 소셜 로그인 기능이 가장 기억에 남는다. 시작하기 전에는 카카오 소셜 로그인이 공식 문서에 설명이 잘되어 있어 소셜 로그인 중 가장 쉽다는 말을 들어서 쉽게 생각했는데 막상 시작해 보니 쉽지 않았다.... 내 이해력이 부족한 건지 공식 문서의 설명이 부족하다고 느껴졌고 구글링을 했는데도 생각보다 그렇게 자료가 많지 않았다. 그리고 백엔드에게 무엇을 전달해야 하는지도 명확하지 않았었다. 그래서 몇 시간 삽질을 하다 authObj를 콘솔에 찍어보았는데 여기에 access 토큰, 사용자 이메일 등이 찍혀 여기서 데이터를 뽑아서 백엔드에게 전달해 주면 되는 걸 알게 되었다.

회고

좋았던 점

• 새로운 기술. 2차 프로젝트에는 React Hook, Styled Components를 사용하게 되었다. 클래스 형 컴포넌트에서 함수형 컴포넌트를 사용하게 되고 SASS에서 Styled Components를 사용하게 되어 새로운 기술을 익히느라 며칠을 고생하긴 했지만 이런 기술을 바로 프로젝트에 적용 한다는 게 뿌듯하고 재미있었다. 그리고 Styled Components에서 props로 전달받은 값을 통해 스타일을 적용하는 건 정말 신세계였다.....😱

아쉬웠던 점

• 완성도. 추석 연휴를 포함하면 3주라는 시간이 있었다. 그러면 나는 당연히 필수 기능을 모두 구현하고 추가 기능을 구현할 줄 알았다.... 하지만 프/백 모도 새로운 기술이 추가되다 보니 적응하는 데 시간이 걸렸던 거 같다. 프로젝트 발표하는 당일 발표 시작 20분 전까지 계속 백엔드와 맞춰보고 코드를 수정하고 추가했다. 겨우겨우 어느 정도 보여줄 수 있는 수준이 됐지만 완성도가 좀 떨어지는 거 같아 다행이면서 조금 아쉬움이 있었다.

주절주절 마무리

아쉬움이 많은 프로젝트이지만 아직은 배워가는 단계이기 때문에 결과물보다는 프로젝트를 진행하면서 그 안에서의 성장이 더 중요하지 않을까라는 생각이 든다. 다음주면 기업 협업이 시작된다! 학원이 아닌 실제 현업은 어떨까 기대되고 조금 걱정도 된다.... 아무튼 한 달 동안 화이팅 🔥