Next.js 공식문서 확인법 pages vs app router

새 프로젝트를 next로 하게 되었다.app router와 pages router를 고민이 되었다.

어떤 경력자 분이 pages가 상대적으로 오래되었기 때문에 참조 문서가 많다고,  오류가 생기거나 궁금한 걸 찾아볼수가 있다면서 추천하였다.    

매우 솔깃했다.   

오랜만에 코드를 짜는거라 예전 내 react 작업물들을 참고하면서 뼈대를 잡았다.   

데이터 패치를 연습하려고 axios를 설치했다. 그런데 next 요놈이 좋은 걸 가지고 있다네? ServerSideRendering 이였다.    

공식문서를 들어가보니 데이터패칭은 이렇게만 하면된단다. 

개꿀처럼 보였다. 그래서 바로 백엔드 url넣어서 내 프로젝트에 적용해봤다.   

 

근데 왠걸 죽어도 데이터가 안불러와졌다.. 도데체왜!!!!

 

몇시간을 구글링했다. 검색어는 “next js 13 데이터 패칭”.

근데 자꾸 getStaticProps 가 나왔다.
"아니 난 12버전 말고 13버전 쓸꺼야, 공식문서에서 보니깐 코드가 더 간단하던데?"라는 생각을 하며 몇시간을 뒤적였다… 아니 며칠이였나?

정신이 희미해져가던중 다시 공식문서를 샅샅이 살펴보고 싶어졌다.

 

그래서 공식문서를 들어왔다. 띠방… 왼쪽 상단이 이제 눈에 들어왔다.

며칠을 이렇게 보고있었네… 하아…

왼쪽 상단에 Using App Router로 삽질을 하고 있었던 것이다 ㅋㅋ

 

 

혹시 나같은 사람있으면 밑에로 바꿔서 보길 바라며…

(설마 나같은 애가 또 있겠어?)

 

이런 것도 헷갈리냐? 싶겠지만 진짜 있었던일이다. 감동실화.. (너무 아는게 없었어서...) 

Marais = stupid

 

 

++옵시디언으로 발행하다보니 간격이 난장판인데 다들 모바일을 통해서 들어오던데, 도데체 어떻게 보일지 모르겠다.. 그냥 막쓴다. 미리지송..
(이 글은 옵시디언을 통해서 발행되었습니다.)