이번 주제에서 알아볼 주제는 아래 다섯 가지로 나뉜다. (주로 정적 데이터를 활용하는 방법에 대해서 다룬다.) - How to add static files (images, etc) to Next.js. - How to customize what goes inside the First Post Back to home ) } 위와 같이 입력하여 서버를 돌리고, localhost:3000/posts/first-post 로 접속해보면 title이 "First Post"로 바뀐것을 확인 할 수 있다. CSS Styling styled-jsx 라이브러리를 통해 React component를 만들 수 있다. 이외에도 styled-components , emotion 라이브러리를 사용할 수 있다. Layout Com..

이번 Tutorial을 통해 배울것은 크게 아래 3가지로 나뉜다. 1. file system routing을 이용한 새로운 페이지 추가 2. 'Link' 의 사용법 3. code splitting, prefetching 2021.08.03 - [개발/Next.js] - [Next.js] 1. 프로젝트 생성 및 시작하기 에서 만들었던 프로젝트를 그대로 사용한다. 1. Pages in Next.js Next.js 에서의 페이지란 각 디렉토리의 파일을 뜻한다. 이게 무슨 소리인가 하면 Node.js Express 에서는 원하는 routes 파일을 원하는 routes 폴더 내부 원하는 위치에 만들고 app.js 에서 명시해주었다면, Next.js 에서는 폴더와 파일 그자체가 route를 뜻하게 된다. 예를들어,..

Next.js 를 한번 해보라는 지인의 소개에 한번 찾아보니 create-react-app 후 Express와 연결해줄 필요없이 한번에 routing까지 쉽게 할 수 있다는 것을 알게되었다. Web Framework을 한번 시도해보려고 할때마다 느끼는 것이지만, 공식홈페이지가 다른 Tech에 비해 월등히 잘되어있음을 느낄 수 있었다. Next.js 공식홈페이지 : https://nextjs.org/ Next.js by Vercel - The React Framework Production grade React applications that scale. The world’s leading companies use Next.js by Vercel to build static and dynamic websi..