라우터 관련 질문드립니다.

App.js에서 남자카테고리, 여자카테고리를 고르면 해당 Route로 가서 상품을 나열합니다.

남자,여자 카테고리는  신발의 리스트를 가지는 ShoesList 컨테이너에서 다음과 같이 경우를 나눠서 보여주게 했습니다. 

위의 남자카테고리, 여자카테고리는 <Man/> , <Woman/> 은 각각  신발 Item 화면을 구성하는 ShoesItem을 불러옵니다.

ShoesItem은 강사님 코드와 똑같습니다.

그런데 여기서 문제가 각각의 신발 상품들을 클릭했을 때, 라우터 처리를 어떻게 해야될지 모르겠습니다. 

애플님은 App.js에서 페이지를 만들고 parmas로 받아 UI 구성을 하셨는데, 저는 해당 상품을 클릭했을 때 해당 상품의 정보를 가진 detail 페이지를 만들어야 합니다. 순서가 잘못됐나요?

남자카테고리 선택시 -> /manshoes

여자카테고리 선택시 -> /womanshoes

페이지에서 상품 선택시 -> /manshoes/3

              (...)                        -> /womanshoes/4

요렇게 동작시키려 했습니다.

처음에 생각한 것은 ShoesItem을 클릭했을때 onClick 이벤트에서 <Route>를 집어 넣는 것이였습니다. 그런데 클릭이벤트가 동작이 되지 않아 실패했습니다.

2.  ShoesItem을 클릭했을때, <Link>로 이동시키는 건데요 to="/ " 경로값에 어떻게 props를 집어넣어야할지 모르겠습니다. 그리고 페이지가 만들어있지 않은 상태라 아무것도 뜨지 않았습니다.

3. ShoeItem 컴포넌트에 직접 들어가서 onClick 이벤트를 작성해봤습니다. 그래도 동작이 제대로 되지 않습니다. http://localhost:3000/manshoes/3 로 직접 쳐서 들어가도 /manshoes 페이지만 보이네요. 어떻게 해결해야되나요?ㅠㅠ