코드스테이츠 - 프리 프로젝트 일지

공부 일지/회고

Joshbla 2022. 11. 14. 01:43

코드스테이츠에서 진행된 첫번째 프로젝트다.

4주간 진행될 메인프로젝트에 앞서서 미리 해보는 프로젝트라서 프리 프로젝트다.

프리프로젝트는 2주간 진행됐고 주제가 정해져있었는데 'StackOverFlow'사이트를 클론코딩하는 것이다.

조원은 프론트엔드 4명, 백엔드 3명으로 구성되었다.

모두 비전공자에 프로젝트가 처음이라 방향성을 잡는데 시간이 많이 소요됐다.

첫 날은 코드 컨벤션을 정하고 프로젝트 규칙등을 정했다.

다음날 부터는 사용자요구 정의서와 테이블명세서, 화면 정의서, API 명세서를 작성했다.

칸반은 깃허브 이슈와 마일스톤, 프로젝트를 이용해서 작성하기로했는데

각자 자기 작업을 하느라 바빠서 생각보다 잘 지켜지지 않아서 아쉬웠다.

그리고 백엔드 팀원들끼리 파트를 나눠서 각자 작업을 시작했다.

프로젝트가 처음인지라 그냥 무작정 작업을 시작했지만

며칠이 지나다보니 작업속도가 더딘 팀원도 있고

시간은 점점 흘러가는데 결과물이 안나오는 일이 발생했다.

기한을 정하지 않으니 어떤 팀원들은 혼자 모르는 부분을 해결하려고 장기간 끙끙 앓고 있던 것이다.

따라서 작업기한을 정하고 모르는 부분을 최대한 공유하고 빨리 해결하기로 회의를 했다.

기존에는 백엔드 작업에 대한 것만 배웠는데 프로젝트를 진행하면서

프론트엔드 팀원들이 어떻게 작업하고 어떤 정보를 원하고, 어떻게 백엔드와 프론트엔드가 교류하는지를 알게되었다.

또 기존에는 혼자 작업만 해봐서 같이 백엔드 팀원끼리 협업하는 방식을 전혀 이해못하고 있었는데

프로젝트 진행 시 협업하는 방식, 그 과정에서 지켜야할 내용들을 배웠다.

그리고 코드스테이츠 과정 중에서 글로만 학습했던 내용을 실전에서 적용시켜 봤고 정말 좋았던 부분인 것 같다.

내가 구현한 기능

아래는 내가 프로젝트를 진행하면서 마주한 에러들과 그것을 해결한 과정이다.

연관관계 맵핑 시 [beanserializerbase] 관련 내용으로 stackoverflow 발생
☞@JsonBackReference 사용으로 해결
ngrok cors문제 발생 : https로 바꿔주는 과정에서 문제가 생기는 걸로 보임
☞이 당시에는 해결을 못했지만 cors필터나 @CrossOrigin 을 사용하여 해결 할 수 있다.
깃허브 로그인 구현 : 구글 oath인증과 방식이 달라 따로 깃헙로그인용 설정을 해줄 필요가 있었다.

깃허브 로그인 진행 과정

URL에 /넣고 빼고 차이가 있다.
생성된 code 를 "https://github.com/login/oauth/access_token" 에 클라이언트id와 시크릿키를 함께 넘겨준다.
정제되지 않은 토큰을 깃허브에서 발급해준다.
해당 토큰을 accesstoken으로 암호화하여 헤더에 넣는다.
헤더에 엑세스토큰이 있는 상태로 "https://api.github.com/user" 에 GET 요청을 보낸다.

빌드 중 contextloadstest fail에러 발생
☞ 테스트 관련 에러로 asciidoc 설정해준 곳에서 문제가 발생해 해당부분 삭제
서버에 배포후 실행하는데 HikariPool-1 - Starting… 에서 에러 발생
(이 부분에서 상당히 많은 시행착오가 있었다...)
☞ yml에서 코드가 꼬인 부분이 있었다 그 부분을 삭제하고, 시간대 아시아-서울로 설정
소셜로그인 코드가 해독이 안된다.
☞ 프론트 엔드에서 주소로 돌아온 코드를 반환해주는 방식으로 진행했는데
주소창에서 띄어쓰기는 %20 으로 변환돼서 프론트엔드쪽에서 파싱하는 과정에서 잘못했던 것이다.
배포 시 소셜로그인 리다이렉트 주소
☞ 소셜로그인 리다이렉트 url은 ec2서버쪽으로 설정하고
로그인 성공시 토큰을 리다이렉트해주는 주소는 s3 주소로 설정한다.
추천을 중복불가능하게 만들기
☞ 나는 다대다 연관관계에 중간엔티티 만들어서 해결했다.
(추천status를 만들어서 1: 추천 /0: 아무것도 안누름/ -1: 비추천 으로 설정)