33. [개발일지] - [피파 온라인 4 프로젝트] - 04. 닉네임 요청 기능 개발 (2), 입출력 화면 분리 (엄청난 성취감, 타임리프 활용)

💻  타임리프 활용(JSON -> html)

현재 결과 화면은(사진(좌) 참고) JSON 형식으로 User 객체가 넘어온다.

추후 프런트 개발도 해야겠지만 임시방편으로라도 타임리프를 사용하려고 한다.

 

 

(의존성 추가)

implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'

 

---

🧑🏻‍💻 코드 수정 (입 출력 화면 분리)

이전 글에 적었던 거처럼 입력과 출력화면이 다른 화면으로 처리되게끔 분리하고 싶었다.

따라서 코드 수정에 돌입했다.

 

그 결과 수정하는데 5일이 걸렸다 하루에 5시간 이상은 소요하여도

해결에 길이 안 보이니 계획까지 바꾸려고 했다(그냥 한 화면에서 요청과 데이터 응답 처리를 할까..)

 

'진짜 포기하고 싶지 않아서 악바리로 계속 찾아본 결과 겨우 성공했다.'

 

성공에 결정적 요인은 window.location.href 였다.

window.location.href = '/users/' + encodeURIComponent(nickname);

 

수정했던 코드 속에서 계속 Form에서 get으로 요청되어 요청 URL 망가졌었다.

하지만 저 코드로 URL변동 없이 Controller에 전달되어 잘 해결됐다.

 

 

---

😆 성공, 다음 스텝

이제  A 화면에서 닉네임으로 검색 ->  B 화면에서 출력까지 성공했다.

여기까지 프로젝트 시작부터 10일 정도가 소요됐다..

 

이제 다시 공식문서에서 사용할 API 목록을 확인할 차례이다.

그런데 닉네임으로 유저 정보를 검색하는 목록은 1가지뿐이고

나머지는 전부 '고유 식별자'가 검색의 Key로 사용되고 있었다.

 

 

 

 

잠시 당황했지만 재빠르게 생각했었다.

'닉네임 검색을 통하여 고유 식별자를 얻고 나서 2차적으로 그 식별자로 나머지 기능을 검색하는 거구나??'

 

아하.. 그런 거였구나.. 그렇다면 이제 할 일은 무엇인지 생각해 보자

닉네임이 아닌 이제 '유저 고유 식별자'로 유저 정보를 조회하는 걸 구현해 봐야겠다.

 

---

🐝 느낀 점

10일이라는 시간 동안 정말 많은 새로운 경험들을 했다.

 

API 발급, Ajax 요청과 응답, Json데이터, 타임리프 활용, Header인증

application.properties 파일 활용 등 벌써 너무 많은 경험을 했는데 했는데... 했는데..!?

 

'너무너무 재밌다.. 진짜로 해결 됐을 때 지금까지 학습 시 성공했던 쾌감과 달랐다.'

 

내가 좋아하는 피파 게임 관련하여 개발해서 그런 건지 몰라도

맨 처음 JSON 객체 응답 성공 당시 기분은 오랫동안 기억에 남을 듯하다.