7월 21일 회고(sitemap.xml,robot.txt, getLayout)

Facts(사실/ 객관)

[일상]

1. 투투메이트 100% 달성!!

[업무/ 공부]

1. [업무] next 배포를 위한 테스트 및 필터 & 스크롤 에러를 손봤다.

2. [공부] sitemap.xml, robot.tsx에 대해 알아보았다. 

3. [공부] next에서 특정 페이지에서 다른 레이아웃을 쓰고 싶을 때 방법에 대해 알아봤다. 

---

Feelings(느낌,주관)

1. 하루를 알차게 계획하고, 하나씩 채워나가는 습관, 그리고 그렇게 하나씩 채워간 하루를 뒤돌아 보며 느끼는 보람. 
   그런 하루가 좋다. 
   
   
2. next 배포를 위해 바쁜 나날을 보내고 있다. 월, 수는 늦게까지 야근했고 화요일은 약속이 있어 술 한잔했다. 그래서 목요일인 오늘 이번 주 첫 회고를 쓴다. 
   단순히 바쁘게만 살지말자. 오늘 하루를 꼭 돌아보고 무엇을 배웠고 어떤게 궁금하고 어떤걸 채워나가야 할지 끊임없이 생각하고 고민하자. 그래야 채워진다. 

---

Findings(배운점)

1. SEO를 공부하며 얼핏 들었던 sitemap.xml과 robot.txt에 대해 알아 보는 시간을 가졌다.

sitemap의 경우 웹크롤러 봇에게 우리 사이트에 대한 개괄적인 정보를 제공하는 가이드 역할을 한다. 
비유하자면 높은 빌등에 들어가면 제일 먼저 마주하는 각 층의 정보를 제공하는 표지판의 역할과 같다.

크롤러에게 어떤 정보가 우선 순위로 검색이 되어야 하는지에 대한 정보를 준다. 

 

sitemap 적용을 위해 여기저기 찾아보다가 한 블로그글에 웬만한 큰 사이트가 아니면 큰 의미가 없다는 것을 알게 됐다.

 

robot.txt의 경우 크롤로 봇에게 로봇이 지켜야 하는 규칙과 사이트맵 파일 위치를 알려주는 역할이라고 한다. 

주로 어떤 특정 크롤러를 제외시키거나 허용시키거나 하는 역할을 하며 웹사이트 내의 특정 콘텐츠, 페이지, 서브폴더 등에 크롤러 접근을 제어하는 역할도 한다. (사이트 리뉴얼이나 구축중에 외부 협업을 위해 억세스는 가능하지만 검색 결과에 나타나지 않게함) 

 

또한 검색 크롤러에 의한 과부하를 방지하는 역할도 한다(네이버, 구글 말고 각 회사 마다 웹 크롤러가 있는데 이들이 한번에 요청을 하며 서버에 부담이 되기 때문)

 

2. next에서 공통된 레이아웃이 아닌 별도의 레이아웃을 쓰고 싶을때 방법을 알게 됐다. 

 

//다른 레이아웃을 쓰고 싶은 페이지
// 밑의 경우 아무 레이아웃을 안쓰고 싶기에 Fragment만 줬다. 

DamhwaMarketListing.getLayout = (page: React.ReactElement) => {
  return <>{page}</>;
};

//_app.tsx
type NextPageWithLayout = NextPage & {
  getLayout?: (page: ReactElement) => ReactNode;
};

type AppPropsWithLayout = AppProps & {
  Component: NextPageWithLayout;
};

const MyApp = ({ Component, pageProps }: AppPropsWithLayout) => {
//중략

  const BasicLayout = (page: any) => (
    <Nav>
      <ContainerComponent>{page}</ContainerComponent>
    </Nav>
  );

  const getLayout = Component.getLayout ?? (page => BasicLayout(page));
  
  return (
  //중량
    <PersistGate persistor={persistor}>
    <CookiesProvider>{getLayout(<Component {...pageProps} />)}</CookiesProvider>
  </PersistGate>
  )