본문 바로가기

TIL(Today I Learned)

TIL-230720(항해99 미니 프로젝트-ANABADA 마무리)

📝오늘 공부한 것

  • 미니프로젝트 - ANABADA 사이트 만들기 마무리(프로젝트 회고)

 

📌미니 프로젝트 - ANABADA

● 배포링크

https://fe-anabadastore.vercel.app/

 

아나바다 || 아껴쓰고 나눠쓰고 바꿔쓰고 다시써보자

 

fe-anabadastore.vercel.app

 

● Github 주소

https://github.com/anabada-123/BE

 

GitHub - anabada-123/BE

Contribute to anabada-123/BE development by creating an account on GitHub.

github.com

 

● 프로젝트 소개 및 주제 선정 이유

프로젝트 소개 : 물물교환 사이트

주제 선정 이유 : 아나바다란 ‘아껴쓰고 나눠쓰고 바꿔쓰고 다시쓰기’의 줄임말이다. 현대 사회에서 젊은 층들은 빠른 소비와 일회용 제품에 의존하는 경향이 높아지고 있습니다. 이러한 소비 문화로 인해 자원 낭비와 환경 오염이 심각해지고 있습니다. 환경 문제와 지속 가능한 생활에 대한 관심이 높아지면서 재활용과 재사용성에 대한 필요성이 부각되고 있습니다. 이러한 변화에 발맞추어, 젊은 층들이 더욱 쉽게 물건을 교환하고 나눌 수 있는 플랫폼이 필요하다고 생각하여 프로젝트를 진행하게 되었습니다.

 

● '아나바다' 사이트 주요 기능

구현 기능

  • 전체 교환 물품 조회 : 메인페이지에서 전체 교환 물품 조회를 할 수 있습니다.
  • 교환 물품 상세 정보 조회 : 교환 물품의 상세 내용을 조회할 수 있습니다. 또한 이미지들을 대표 이미지로 변경하여 볼수 있습니다.
  • 교환 물품 등록 : 아나바다 교환을 위한 물품을 등록하기 위해 교환 조건과 제목 이미지들을 업로드 할 수 있습니다.
  • 교환 물품 정보 수정 : 등록했던 물품의 정보를 수정할 수 있습니다. 또한 대표 이미지를 수정할 수 있습니다.
  • 교환 물품 정보 삭제 : 교환 물품 정보를 삭제할 수 있습니다.
  • 회원가입 / 로그인 : 회원가입과 로그인을 할 수 있습니다.

미구현 기능

  • 마이페이지 기능 : 개인 프로필을 수정하고, 본인이 등록한 물품을 조회할 수 있습니다.
  • 채팅 기능 : 채팅으로 물건을 교환할 상대방과 실시간으로 연락을 할 수 있습니다.

 

● 트러블 슈팅

발생한 문제 : 로그인 진행 시 프론트로 쿠키값이 전달되지 않음.

구현하고 싶었던 것 : 로그인 성공 시, 보안을 위해 JWT 액세스 토큰을 쿠키에 담아 프론트로 보내기로 하였다.

해결 방안 :

토큰을 쿠키에 담아 보냈지만 프론트쪽에서 ‘로그인에 성공하였습니다’는 메시지만 나오고 쿠키값은 나오지 않았다.

해결해보려 하였지만, 'Same-Origin Policy'로 인해 시간 관계상 JWT관련 코드들을 없애고 단순히 유저 아이디, 비밀번호만 확인하는 로직으로 변경하였다.

로그인 기능 구현이 아닌 단순히 문자열의 일치만 확인으로 변경하게 되어 아쉬웠다.

CORS 에러나, access token, refresh token 등을 더 공부해봐야겠다.

 

● 총평

처음으로 진행해본 프론트엔드와 백엔드의 협업이었다. 기술적인 문제들 뿐만 아니라 그 외적인 소통부분에서도 어려움이 많았지만 프로젝트를 진행하면서 소통하는 방법들을 배울 수 있었고, 완성된 결과물을 보니 잘 나와서 뿌듯했다.

협업에 대해서 많이 배울 수 있어서 좋은 경험이 되었다고 생각한다.

 

● 프로젝트 피드백

- 와이어프레임을 봤을 때 플로우가 어떻게 되는지 알아야한다. 관심사로 정렬하는 것이 좋을 것 같다.

- ItemController 부분에서 param을 늘리는 것 말고, dto로 만들 수 있음. 컨벤션으로 회사나, 팀에 맞추기.

- 유저 아이디, 비밀번호를 확인하는 로직은 로그인 기능이라고 할 수 없음.

 

느낀 점🤔

결국 로그인 기능을 구현해내지 못했다.

토큰을 헤더나 바디에 보내는 방식이 아닌, 쿠키에 담아서 보내고 싶었지만 에러를 해결해내지 못했다.

다음 프로젝트에서는 그 부분에 대해 공부를 더 해서 꼭 해결할 것이다.

그리고 1차 목표로 잡았던 것들을 모두 기능 구현을 해냈지만, 2차 목표로 잡았던 채팅기능, 마이페이지 기능은 시간부족으로 기능을 완성하지 못했다. 

웹소켓을 공부해보고 싶었는데 다음에 꼭,,채팅 기능!!해본다!!