하루를 마무리 하기 전, 오늘 있었던 일들을 잔잔히 되짚어봅니다.
성공과 실패의 모든 요소에서 '배울 점'을 찾아내어 기록하고,
더 성장하는 내일의 나를 위해 'action plan'을 세웁니다.
오늘도 어김없이 알람이 울리기 5분 전에 눈이 떠졌다.
알람 전에 눈이 떠지면 은근-히 아쉬운 마음인데. ㅎㅎㅎ
컨디션이 영 아니라서 오늘은 웬일로 알람을 좀 미루고 누워있다가 평소보다는 좀 늦게 일어나 집에서 키보드를 두드렸다.
어제 밤 자기 직전에 적어놓은 메모였다.
상품 목록을 하드하게 불러오는 것.. ㅎㅎ 즉 내가 넣어둔 데이터 그대로를 받아오는 것은 어찌 어찌 해냈다. 그다음 지난주 강의에서 잠깐 언급되었던 '페이지네이션'을 해보는 것을 오늘 목표로 두었다.
사실 이 메모를 적을 때 까지만 하더라도 페이징을 강의를 따라 하면 자연스레 되는것인 줄 알았다. -_- ㅋㅋㅋㅋ.... 어휴.
역시 페이지 만드는 건 전혀 쉬운일이 아니었다. 아주 예전에 한번 페이지 때문에 굉장히 고생한 적이 있었고, 지금 다시 만들라고 한다면 아예 엄두도 못낼 것 같은데 ㅎㅎ. 어쨌든 오늘 목표를 '페이지네이션'이라고 결정했다면 지금 이 글을 쓰고 있는 시점까지 해결하지 못했다.
음.. 그렇게 오전에 페이징과 관련된 강의 내용을 듣고 적지 않은 시간을 쓰다가 외부일정이 있어서 두어시간 자리를 비우고.
또 바로 카페로 이동하여 여러가지 시도를 해봤으나 결국엔 되지 않아 이 부분은 우선 뒤로 미루기로 결정했다.
상품 목록을 단수의 ProductDto로 불러오니, 갑자기 '그럼 하나의 프로덕트에 대한 상세 페이지는 누가 데려오나?' 라는 질문이 머리를 스치면서 백엔드 쪽에서 사용하는 ProductDto를 ProductsDto로 바꿔줘야 겠다는 생각이 들었다.
페이징을 포기하고 좀 헷갈려서 지난주 transactions 쪽 강의를 다시 들었는데 거기서도 List를 뿌려주는건 TransactionsDto가, 단건의 Transaction을 담당하는 것은 TransactionDto가 담당하고 있었다.
이 부분은 금방 해결이 되는 문제였고...
진짜 문제는 상세정보를 보기 원하는 물품을 클릭했을 때 해당 물품에 부여되어 있는 id값을 url뒤에 붙여주고 페이지를 이동하게 하는 것이었다.
직감적으로 '프론트쪽이 더 어려울 것 같다'는 생각이 들어 마음의 난이도를 낮추기 위해 백엔드쪽을 먼저 만들기 시작했다.
여기서도 @PathVariable이라는 어노테이션이 사용되는데 지난번에 동료들에게 약간 푸념섞어 이야기했었지만 @PathVariable이랑 @RequestParam같은 어노테이션이 왜이렇게 익숙해지지 않는지 모르겠다고..ㅎㅎ 오늘도 좀 버벅이면서, 예전 과제들을 참고하면서 만들었다.
어제와 마찬가지로 테스트페이지부터 만들고 그리고 실제를 구현해나가려 노력했다. 좀 더 솔직하게 말하면, 백엔드 쪽에서는 테스트코드를 먼저 만드는 게 좀 더 자연스럽게 진행되는데 프론트엔드 쪽에서는 그게 잘 안된다. ㅎㅎ.
프론트 쪽에서 상품 목록을 출력하는 것을 우선은 버튼에 담아두고, 그 버튼을 누르면 제품 상세페이지로 이동하게 하는 것이 목표였다.
근데 몇 가지 걸리는 부분이 있었다.
- 버튼을 누르면 그 제품의 id값을 활용해서 상세페이지로 이동하는 건 어떻게 하지?
- 상세페이지로 이동했을 때 '그 제품'의 정보는 어떻게 얻어오지?
몇가지 걸리는 부분이 사실은 프론트쪽 구현의 전부라고 해도 이상할게 없는데..ㅎㅎㅎ
도무지 어떻게 해야할지 감이 오지 않았다.
동료와 함께 오늘 검색했던 Page에 대해 이야기하다가 위에 적어둔 내용에 대해 도움을 얻고 해결했다.
사실 navigate나 location 등은 강의에서도 나온 내용이기도 하고, 또 공식문서를 통해서도 더 구체적인 사항들에 대해 알 수 있다.
물론 navigate의 state에 대한 내용은 몰랐었고, 상세페이지에서 어떤 방법을 통하여 내가 선택한 제품의 id값을 얻어올 수 있을지 고민은 했으나 답은 찾지 못했다.
react-router-dom에서 제공하는 Route에서 path에 '내가 선택한 제품의 id값'을 추가로 붙이는 방법 등.
내가 고민하고 알아낸 방법들이라기 보다는 뭔가 그럴것 같은데~ 하다가 힌트나 방법을 얻고 바로 사용하게 된 것이라 좀 현타가 왔다.
뭔가 '돌아가는' 상태이긴 한데 마음이 전혀 편하지 않아서 잠깐 키보드에서 손을 뗐다.
할 건 무지하게 많고 갈길은 먼데도 솔직히 잠시 잠깐 손을 멈추었다.
이번 레벨테스트에서만큼은 정말 단 하나라도 배우고 가겠다는 마음이었는데 또다시 반복되는 느낌이었다. 지금 내 컴퓨터에 무지막지하게 띄워져있는 지난 과제들 페이지가 차마 닫힐 수 없는게 이런 이유때문 아니었나.
심호흡을 좀 하고. 이미 늦은 시간이기에 오늘 추가로 정리할 시간은 부족하지만.
내일 오전에는 오늘 정확한 사용 이유와 명분을 찾지 못하고 '되는'상태를 만든 (1) location, (2) navigate의 state, (3) @PathVariable에 대해 정확히 정리하고 가려 한다.
그리고 필요한 부분만 강의를 듣느라 아직 만들지 못한 백도어를 만들어보는 것을 목표로 하자.
