[PROJECT] pre-project stackoveflow 클론 코딩 / WEEK2 기록

 

📌 pre-project D+6.5 (주말)

#me

-주말동안 tag 기능 추가

☑️ Entity, TagController ,  TagMapper, TagService, Dto...

- 내가 작성한 코드 팀장님 코드와 작성법 맞추기

* 우리 조는 프론트의 요청으로 OAuth2는 빼고 JWT만 하기로 했다. 🗝️

 

# team - BE

주말동안 우선 Answer와 Question 부분도 대략적인 CRUD가 완성이 되었다.

그리고 나는 팀장님과 많은 이야기를 나누었다. 😶‍🌫️

Answer 부분이 PR올라왔는데 문제가 많았기 때문이었다.

Answer 부분에서 많은 오류가 발생하다보니 test를 진행하기 어려워 나와 팀장님은 모두 주석 처리하여 작업을 진행하였다. 문제 부분들은 코드 리뷰 시 하나하나 작성해 놓았고 월요일날 담당한 팀원에게 전달하기로 했다.

또한, 내가 작성중인 도메인을 건드려서 내가 pull 할 때 마다 에러가 나고 나는 하나 씩 수정해주어야 했고 내 코드가 PR이 안 된 상태이니 계속해서 또 오류가 나고 오류가 났다. 🥹 그래서 나는 해결하기 위해 PR을 올리고 머지 충돌을 해결해달라고 했지만... 팀원들은 내 상황을 모르기에 그냥 conflict 수정해서 쓰라고 했다. 나도 사실 한 두 번 했을 때는 그렇게 해도 되는 줄 알고 그렇게 했는데 그게 아니었던 것이다. 계속 이전 코드로 돌아오고 돌아오고(지금 생각해보니 당연하다.. 내 코드는 아직 PR이 안 되었으니 pull하는대로 받아와 질 수 밖에.. 그리고 그 코드를 내가 수정해버렸다고 인식하니 당연히 conflict나는 게 맞는 상황이었다ㅋㅋㅋ) 계속 고치는 걸 반복하다가 도저히 안되겠다 싶어 팀장님한테 얘기했다. 

그리고 머지 충돌 해결 완료..! 내 상황을 팀원들에게 계속해서 업데이트 해주는 것이 얼마나 중요한지 깨달았다!

➕

아 ! 그리고 주말동안 모각코 했는데 모각코하면서 또 새로운 기능을 배웠다.


나는 깃에서 항상 터미널 명령창으로 명령어를 작성하곤 했는데 GUI 를 사용한 편한 방법들을 배웠다. 파일 하나 씩 커밋이 가능하다니.. 넘 짱 좋다.. 파일을 직접 입력하지 않아도 된다는 것이 넘 좋다.그리고 내가 변경하는대로 변경하면 변경한 것을 볼 수 있었다. (쵝오 👍)

커밋 한 후에는 이전에 진행한 작업들을 볼 수가 없었는데 그럴 땐 우측 상단에 있는 시계모양을 클릭하면 이전 기록들이 나온다. 너무 짱... 간혹 이전 코드가 기억 안 나고 내가 어떤 걸 고쳤는지 모르는 경우가 많은데 진짜 너무너무 좋은 기능인 듯 하다!

 

 

📌 pre-project D+7 

#me

- Spring Security 기능 추가
☑️ JWT 작성 시작

 

# team - BE

위의 이슈들을 바탕으로 오전 시작과 동시에 백엔드 회의 진행

✅ 코드 수정 시 규칙

- 서로의 파일은 건들지 않는다.
- 만약 수정할 부분이 있다면 review 댓글 또는 DM으로 보낸다.
- 연관관계 매핑 시 다 함께 작업

✅ @Positive 정리해도 괜찮을 듯 (Answer 도메인 전달사항)
-> controller 에서 @Positive 로 유효성 검사하는데 굳이 또 해줄 필요 없을 듯..?

1. 순서 post / patch / get / delete
2. post 작성통일 (response는 URI로 보내자)
3. AnswerPost, Patch -> 댓글창 나누는 것 어떤지 front 분들한테 의견 (API 서버 하나 더 만드는 거 괜찮은지)
4. controller 파라미터 전체 수정
5. Delete 부분 - return 값 수정
6. getAnswers(long questionId) 또는 getAnswerList(long questionId)

✅ 완성되지 않은 기능은 PR올리지 않는다.
- 커밋만 계속할 것!

아..! 그리고 이렇게 conflict를 해결하던 도중 갓텔리제이의 또 미친 기능을 발견했다. 🙌

이렇게 편하게 conflict를 해결해주시다니요... (진작에 발견할걸.. 팀장님과 answer부분 충돌 나면서 알았던 부분이다ㅋㅋㅋㅋ)

 

#team

✅ Post
- URI만 보내도 괜찮은지? yes

✅ Answer Post & Patch 방법 논의
- Answer 작성이 실제 stackoverflow에서는 question 창 내부에서 바로 이루어지고 있는데 question API 주소를 하나 더 만들어서 보내도 괜찮은지? yes

✅ pagination 적용 하는지?
(무한 스크롤로 해도 pagination으로 작성하는 게 좋다고 하는데(데이터를 불러오는데 걸리는 시간들 때문에) 프론트에서 무한 스크롤 pagination으로 구현이 가능한가?)
- 배운 것이 List 로 작성하는 방법이라 시간 안에 끝내려면 List 로 하는 것이 맞을 것 같다.

post 부분과 patch 부분을 새로운 창에서 작성하도록 하는 것이 어떤지 물어보았다. 페이지를 프론트에서 하나 더 만들어야 하는 부분이기에 우리끼리 정하고 전달할 수 없는 사항이라 판단하였기 때문이다. 

그리고 주변에 프론트분들과 소통을 1도 안 한다는 팀들 이야기를 들었다. 팀장님과 부팀장님이 많은 소통을 하려고 노력하신 덕분에 하나 씩 더 잘 맞춰지고 있는 것 같다는 생각을 했다. 

서로 소통하면서 맞춰가는 부분들 덕분에 재미있다 : )

그리고 Spring Security 를 맡아서 진행하게 되었다. 다시 해보면서 공부하고 싶었는데 할 수 있어서 너무 좋다!ㅎㅎ (사실 걱정이 태산🫠) JWT 기능 구현을 위해 security 를 배울 때 봤던 영상을 다시 봤다.  CRUD는 이제 그래도 여러 번 해서 그런지 조금 익숙하고 어떻게 흘러가는지 알겠는데 아직 Security는 흐름을 이해하기 너무 어렵다. 

이것도 익숙해지지 않을까! 기대한다~~ 화이팅하자

🔗 https://www.youtube.com/watch?v=ewslpCROKXY&t=118s

🔗 https://www.youtube.com/watch?v=DCKE-bWYFxg&t=32s

 

📌 pre-project D+8 ~ D+11

#me

Spring Security JWT 구현 완료

 

# team - BE

10일차 백엔드 오전 회의 내용

✅ 각자 도메인 완성 → 다음주 월요일까지

✅ global (Security, JWT) 기능 구현 ok

✅ API 명세서 수정

 API 명세서가 계속 수정된다. 원래 이런 게 맞는 거겠지..?! ㅎㅎ

처음 하는 프로젝트라 우여곡절이 많다... 😵‍💫

 

# team - BE

11일차 백엔드 오전 회의 내용 

✅ Answer 부분 postman 작동 시 에러 발생

→ controller, service, mapper, dto 등 전체 수정 필요

✅ Answer → 인수님, 해영님 같이 작성

✅ API 명세서 재수정 필요

✅ Answer response 필요한 값 더 자세히 나타내기

1차 → response (userId, content) 수정해서 Answer reponse는 Question 개별 조회 시 보이는 것으로 변경 예정

✅ Question 조회 시 tag 보이게 수정

✅ User에서 MyPage 조회 시 QuestionList 보일 수 있게 작성, AnswerList 보일 수 있게 작성

✅ 예외처리 작성 주말까지 완료

✅ 접근권한 재설정 필요

 

#team

JWT 구현이 다 되고 프론트에서도 로그인 기능 구현이 진작에 다 되었기에 가장 먼저 테스트 해보았다.

그 악명높은 CORS 문제... 계속해서 나를 괴롭히다. (며칠 간 해결 했다..) - 10일차 ~ 

 

🚨 에러 기록 남기기!

문제 1. CORS 에러 

🔻 CORS 설정을 관리하는 corsConfigurationSource 메서드

* setAllowedOrigins 와 setcredential 함께 사용 못 함 ➡️ 주석 처리

다시 하니까 또 CORS 에러 → corsConfigurationSource() 주석 처리 & corsFilter 넣어서 test 성공

🔻 CORS 설정을 관리하는 corsFilter 추가

문제 2. CORS 문제 사라진 후 프론트에서 토큰을 못 받아오는 문제 발생 → 프론트 해결

문제3. 콘솔이 안 찍힘 Header를 header  소문자로 변경 해봄..  →  그리고 다시 CORS 문제 발생

문제4. 회원가입은 되지만 로그인에서 여전히 undefined

문제5 . withCredentials: true 하니까 CORS 발생

CorsConfigurationSource corsConfigurationSource() {
        CorsConfiguration configuration = new CorsConfiguration();
        configuration.setAllowCredentials(true);
        configuration.setAllowedOriginPatterns(Arrays.asList("*"));
        configuration.setAllowedHeaders(Arrays.asList("*"));
        configuration.addExposedHeader("*");
        configuration.setAllowedMethods(Arrays.asList("GET", "POST", "PATCH", "DELETE", "OPTIONS"));

모두 백엔드 설정의 문제였다.

✅ configuration.setAllowCredentials(true); // 자격 증명(쿠키, HTTP 인증 등)을 허용할지 여부를 설정
✅  configuration.setAllowedOriginPatterns(Arrays.asList("*")); //허용된 오리진 패턴을 설정
✅  configuration.setAllowedHeaders(Arrays.asList("*")); // 허용된 HTTP 헤더를 설정
✅  configuration.addExposedHeader("*"); // 클라이언트에게 노출할 헤더를 추가
✅  configuration.setAllowedMethods(Arrays.asList("GET", "POST", "PATCH", "DELETE", "OPTIONS")); // 허용된 HTTP 메소드를 설정

이렇게 설정하고 나니 위에서 발생한 문제 모두 해결 완료 !

 

 

2주차가 지나갔는데 잠을 못 자고 있다아.. 그 동안 JPA 공부와 Security 공부를 하고싶었는데 JDBC를 보다가 프로젝트를 시작했다. 신기한 것이 못 할 거라 생각하고 엄청 두려웠던 프로젝트를 그래도 하나씩 해나가고 있다는 것이다! 

팀원들에게 피해를 줄까봐 시작 전부터 정말 정말 걱정도 많았는데 시작하고 나니 공부도 오히려 많이 되는 듯 해서 매우 재미있기도 하고 앞으로의 결과물이 매우 기대되기도 한다. CORS 문제를 이전에 마주했을 때는 이게 뭐지? 했는데 CORS 문제도 마주해보니 뭔가 만들고 있긴 하구나 생각이 들기도 한다.

남은 프로젝트 기간도 힘내서 팀원들과 멋진 결과물을 내고싶다!!  아!! 다른 팀에 비해 정말 많은 소통을 하고 있는 것 같아 정말 뿌듯 하다. 다른 백엔드 동기들의 이야기를 들어보면 프론트엔드 팀원 분들의 목소리도 못 들어보았다고 하는데 우리는 그래도 많은 소통이 오가고 있다. : )

매일 회의를 하기 위해 이야기 하려 하고 서로의 역할에 대해 조금 더 알아보려고 하는 노력들이 좋은 결과를 가져 올 수 있지 않을까? 

 

 

+) 계속 추가 추가 하다보니 임시저장 글에서 발견된 프리 프로젝트 회고 기록! : )