190902-100908

REFLECT

• 초보를 위한 React JS Challenge
• Amazon Prime 메가드롭다운메뉴 / 메뉴 네비게이션 만들기
• 알고리즘 2-3문제 풀고 정리하기

• 리액트 챌린지 과제를 하는데 버튼 클릭 시 페이지 전환 없이 Nested Routes를 노출하는 방법을 찾다가 결국 해결하지 못하고 제출했다.. 과제 하는데 필요한 부분만 수강하고 바로 과제 시작할껄 괜히 무관한 부분을 먼저 하다가 시간낭비를 한 기분이다ㅠㅠ 괜히 이틀짜리 과제가 아니었을텐데.. 내가 작성한 코드와 솔루션을 비교해보니, Detail Route를 withRouter로 감싸고 그 안에 nested Routes를 삽입한 뒤, props를 인자로 전달해서 노출여부를 제어하는 방향성은 같았지만 몇몇 다른점이 있었다.

내 코드

1. Router.js에 nested Routes(markets, exchanges)를 추가했지만 이건 불필요한 작업이었다.
2. Detail Route에서 {match}을 인자로 전달해서 match.url을 활용하려고 했지만 경로입력이 잘못됐다.

솔루션

1. Nested Routes는 Router.js에 추가하지 않았고 Link와 nested Routes의 경로 입력을 올바르게 했다.

• 리액트 챌린지 후반은 Hooks 과제가 나왔다. 개인적으로는 Hooks의 함축적이고 추상적인 특성 때문에 class를 쓰는게 더 명확하고 다루기 쉬운 느낌이었다. 아직 함수형 프로그래밍에 익숙하지 않기도 하고 Hooks의 필요성도 잘 느끼지 못해서 그런가. 이번 챌린지는 리액트와 리액트 라우터 까지만 하고 마무리 했지만 앞으로 영화앱을 추가로 develop하면서 Hooks를 써보면 좋을 것 같다는 생각이 든다:)

• Amazon Prime은 계획과 다르게 카드 네비게이션을 먼저 작업하고 있다. 오늘로 작업 이틀째. 첫날에 마크업과 CSS를 전면 수정하고 무한looping 없이 슬라이딩 애니메이션까지 구현했는데 둘째날인 오늘 무한 looping을 구현하려고 보니 기존의 코드로는 제약이 생겨서 작성했던 js 코드 대부분을 갈아 엎었다:( 요구사항에 나와있는대로 무한 looping을 먼저 작업했어야 했는데.. 삽질을 하긴 했지만 그 과정에서 배운게 있으니 괜찮다. 다음 주중엔 완성해봐야지!

• 추석 연휴가 지나면 바로 유튜브 클론 코딩 챌린지가 시작된다. 백엔드까지 다뤄보는건 처음이라 설레기도 하고, 6주라는 기간을 잘 버틸 수 있을까 긴장도 되지만, 열심히 해서 ‘완주’라는 유종의 미를 거두고 싶다:)

PLAN NEXT WEEK

• 유튜브 클론 코딩 Challenge 예습
• Amazon Prime 카드 네비게이션 완성하기
• 알고리즘 2문제 풀고 정리하기

CONTENTS OF THIS WEEK

null :)