Next.js로 정적사이트를 빌드하기 위한 설정

이번에 참가하게된 프로젝트에서는 Next.js를 사용하게 되었다.

여기저기서 많이 듣고 있었던 Next.js

처음 사용해 보는 마음에 이런저런 설정들을 집에서 따로 공부하며 하나씩 정보를 모아가던 중 정적사이트에도 많이 사용되고 있다는 것을 알았다. 그래서 build를 하는데 계속 에러만 뿜어대고 진행을 시켜주진 않았다.

버전에 대한 차이가 있기 때문인지 몇몇 정보들은 동작을 하지 않았었고 trailingSlash, images 설정을 잡아주고서야 잘 되는 것을 확인할 수 있었다.

const nextConfig = {
  output: 'export',
  trailingSlash: true,
  images: {
    unoptimized: true,
  },
	...
};

trailingSlash이란?

trailingSlash은 URL의 끝에 위치하는 /를 가리키는데 Next.js에서는 trailing slash의 설정이 가능하며 설정여부에 따라 리다이렉트 처리를 해주는 것이라고 한다. 결과적으로 /about이라는 URL로 접속을 시도할 경우 /about/으로 리다이렉트를 시켜주는 설정이라는 것을 알았다.

record 17

알아야 할건 넘쳐나고 따라가긴 힘들고 버릴건 버려야 하고

그나마 그동안은 개발자가 아니라서 조금 편하게(?) 업무를 처리했었는데 뷰, 리액트가 나오면서는 단순 퍼블의 입지가 점점 좁아지고 있는 것 같다. 대체로 경력이 일정 이상이 되면 프런트엔드는 아니어도 준프런트엔드 수준까지는 작업을 해야 하는 분위기가 조성되고 있는 것 같았다. 그런데.. 의외로 주변을 보면 나보다 편하게 일하며 어려운 것도 하지 않고 돈 잘 벌고 일 잘 찾는 사람들이 많은 것 같다. ㅠㅠ

지인으로부터 편하게 일 잘하는 사람들도 많은데 나는 항상 뭔가 어렵고 힘든 곳으로만 다니는 것 같다는 이야기를 들으며 든 생각..

그리고, 개발이 타입스크립트로 일처리를 하는 것 같아보여서 타입스크립트를 경험해 볼 수 있는 기회라 생각하고 공부하면서 프로젝트에 조금 .tsx를 사용하며 작업해보려 했건만, 개발자로부터 화면단은 .jsx를 사용하고 타입스크립트는 사용하지 말아 달라는 이야기를 좋은 말로 듣게 되었다. 성격 나쁜 사람이었으면 욕먹을뻔.. 뭣 좀 막히면 그냥 :any를 사용하니 써먹을 수가 있을리가.. 결국 내가 데이터의 타입을 정의하거나 관리할게 아니라면 바통을 내가 가지고 있을 이유가 없다. 오히려 일만 키울 뿐. 어중간한 욕심은 빨리 포기.. 버릴 건 빨리 버려야 한다.

** 바톤으로 알고 있었다. 바통이었구나.. 바톤터치도 아니고 바톤패스가 맞는 말이라니..