Next.js (2) 썸네일형 리스트형 [Next.js] SSR + CSR SSR + CSR → 사용자가 동일 사이트 내에서 url 을 이동하여도 서버에서 새로운 html 을 내려 받지 않고 클라이언트에서 렌더링을 하기 때문에 화면 깜빡임 없이 앱과 같은 사용자 경험을 제공해주는 장점 → 번들링된 js 의 파일의 크기가 크기 때문에 사용자가 웹사이트를 처음 접속할 때에 interaction할 수 있는 데 까지 시간이 오래걸리는 단점 → 해당 문제는 code splitting 이라는 URL 마다 각각의 번들링된 js 파일을 나누어 만드는 방법으로 단점을 보완할 수 있다. → SEO 대응이 어렵다는 단점, 검색봇들이 html 기반으로 요소를 찾는데, CSR은 html이 거의 비어있으므로 검색에 잘 노출되지 않는다는 단점 → 이를 대응하기 위해 첫 페이지는 서버 사이드 렌더링을 하고.. [Next.js] React, Express.js 그리고 SSR을 한번에 npm run dev 개발환경실행 npm run build 배포 파일 생성 npm run start 서비스 시작 Next.js 는 서버까지 내장되어 있는 올인원 솔루션! Route /pages/index.js 기본파일 https://a.com/sub/1 == /pages/sub/[id].js // pages/sub/[id].js import {useRouter} from 'next/router'; export default function Sub() { const router = useRouter(); const id = Number(router.query.id); return ( /pages/sub/[id].js Parameter id : {id} /pages/index.js } API Route → .. 이전 1 다음