Gmmq 72 feat 라우터 설정하기

[backward99]

📃 PR 설명

라우터 설정을 진행했습니다.

• 와이어 프레임에서 나온 페이지에 대해서 경로 설정을 진행했습니다.
• react-router 에서 제공하는 outlet을 적용 시켰습니다.

📃 참고사항

예시로 파일을 만들어두었고 경로에 적용시켜 둔 상태 입니다.
Heading 부분을 지우고 Header 컴포넌트와 같은 내용을 넣으면 될 것 같습니다.

import { Heading } from '@chakra-ui/react';
import { Outlet } from 'react-router-dom';

const Layout = () => {
  return (
    <>
      <Heading>예를 들어 Header가 들어갈 공간, Outlet에는 경로가 "/"일 때 null 값이 들어감</Heading>
      <Outlet />
    </>
  );
};

export default Layout;

App에서 Layout 을 적용하고 있습니다.

import { Layout } from './routes';

const App = () => {
  return <Layout />;
};

export default App;

기본경로에서 App을 보여주고 기본 경로에 대한 하위 경로로 다른 페이지를 보여줍니다.

{
    path: '/',
    element: <App />,
    children: [
      { index: true, element: <MainPage /> },
...

🔎 PR포인트와 궁금한 점

1. routes 폴더에 들어가는 내용이 적절한지 잘 모르겠습니다.
2. 일단 함수 표현식으로 작성했습니다. 호이스팅이 무서워서.. 표현식이 좋을 것 같다는 생각을 하게 되었는데 아닌 것 같으면 다시 함수 선언식으로 고치겠습니다..!

[leeminhee119]

페이지 다 만드시느라 고생 많으셨습니다 👍
화살표 함수를 사용하셨는데, 관련해서 좀 더 찾아보니까 화살표 함수랑 함수 표현식은 호이스팅이 되지 않아서, 코드 짤 때 메인 로직이 담긴 함수 외에 추가 함수가 필요할 때 추가 함수를 메인 함수 위에 작성해줘야 한다고 하더라고요! 그렇게 되면 메인 로직이 담긴 함수가 가장 위에 있는 게 아니라 밑에 있게 돼서 보기가 불편해진다는 단점이 있다고 합니다.
근데 화살표함수로 작성하면 return을 더 간결하게 할 수 있다.. 이런 장점이 또 있다고 해서 이건 취향 차이일 수도 있을 것 같아요!
스크럼 시간에 같이 얘기해봐요

[leeminhee119]

id가 더 상위 개념이니까 :id가 url에서 먼저 오고 edit, review 같은 것들이 뒤에 오는 게 더 자연스러울 것 같은데 어떠신가요? 이렇게 되면 detail은 생략해도 될 것 같습니다!
ex. resume/:id, resume/:id/edit, resume/:id/correction

[backward99]

오... :id를 중간에 넣을 생각을 못했네요 가운데로 변경하겠습니다!

[leeminhee119]

review는 첨삭의 의미로 쓰신 건가요? 맞다면 첨삭 '후기'랑 겹치는 것 같아서 워딩을 다른 걸로 가져가는 게 좋을 것 같아요! (correction이나 comment? 어떨까요)

[backward99]

아 넵 첨삭의 의미로 사용했는데 comment가 더 어울리는 것 같네요! 추천 감사합니다!

[leeminhee119]

이 페이지가 멘토 첨삭에 대한 멘티의 후기 작성 페이지인거죠 ?!

[backward99]

넵 맞습니다!

[leeminhee119]

어떤 이벤트 신청 페이지인지 이벤트 아이디가 path 중간에 있어야 할 것 같아요!

[backward99]

넵! view를 없애는 것도 좋겠네요

[leeminhee119]

넵 좋습니다

[leeminhee119]

컴포넌트에서는 인덱스를 안 만들기로 했었는데, 페이지 폴더는 index를 생성하는 건가요? 저번에 지호님이 말씀하셨던 이유와 같은 이유인가요!

[backward99]

아하 인덱스 파일이 전체적으로 없는거였군요! 바로 없애도록 하겠습니다

[leeminhee119]

앗 그때 전체적으로 없애자 했던 건 아니긴 한데, 저는 없어도 크게 상관 없을 것 같다는 의견입니다!