본문 바로가기

SSR

(4)
Next.js 킬포 Pre-rendering 2. Server-side Rendering 그리고 Client-side Rendering Pre-rendering중 하나인 Static-Generation은 저번시간에 실습해봤고, 이번엔 Server-side Rendering이야 Next.js 킬포 Pre-rendering 1. Static-Generation Next.js의 킬링포인트 Pre-rendering 개념은 잘 보고 왔지? Next.js Pre-rendering 안녕친구들! 스타일링까지 잘 따라오고 있어? Next.js 스타일링 팁 (classnames, postCSS, Sass) 튜토리얼 잘 따라오고 있어? 오.. ppsu.tistory.com 지금 하고있는 튜토리얼에는 적용하지 않지만, 원하는 친구들도 있을것 같아 정리해봤어! Server-side Rendering 이전 Static-Generation이 "빌드타임"에 HTML..
Next.js 킬포 Pre-rendering 1. Static-Generation Next.js의 킬링포인트 Pre-rendering 개념은 잘 보고 왔지? Next.js Pre-rendering 안녕친구들! 스타일링까지 잘 따라오고 있어? Next.js 스타일링 팁 (classnames, postCSS, Sass) 튜토리얼 잘 따라오고 있어? 오늘은 쉬어가는 페이지! 알아두면 좋은 몇가지 라이브러리들을 소개할께! 지� ppsu.tistory.com Pre-rendering 첫번째 시간! Static-Generation을 실습할꺼야! Next.js의 Static-Generation은 말그대로 그냥 빌드타임에 미리 HTML을 생성해 두는 건데, 요기 또 쿨한 옵션이 하나 있다! 페이지를 생성할 때, 외부 데이터를 읽어와서 조합할 수 있다는 거야! 빌드할때 API를 호출한 결과로 페이지 ..
Next.js 킬포! Pre-rendering 안녕친구들! 스타일링까지 잘 따라오고 있어? Next.js 스타일링 팁 (classnames, postCSS, Sass) 튜토리얼 잘 따라오고 있어? 오늘은 쉬어가는 페이지! 알아두면 좋은 몇가지 라이브러리들을 소개할께! 지금당장은 중요하지 않으니 이번 튜토리얼은 스킵해도 좋아! 깔끔하게 classname 초이스! - ppsu.tistory.com 오늘은 Next.js의 완전 킬포! Pre-rendering 기능에 대해 이야기 할꺼야! Pre-rendering이 뭐야? Next.js는 기본적으로, 모든 페이지를 pre-render 해! 보통 성능이 더 좋고 SEO(Search Engin Optimization)에 더 좋아. "Pre"라는 말이 붙으면 "미리", "먼저" 한다는걸 말해. 예를들면 predi..
리액트(React)로 서버까지 구현하는 Next.js 소개 (버전9 기준) 이제 웹팩 바벨설정은 그만!리액트를 하다보면, 웹팩과, 바벨등 부가적인 여러 설정때문에 결국 개발보다 설정하느라 시간 보내지 않아?이를 해결해주는 리액트용 프레임웤이 있지!바로 Next.js! 요게 벌서 9버전까지 나와있다구!많은 기능들이 있지만 한마디로 정리하자면, "만들고 싶은 사이트를 가장 빠르게 만들어주는 프레임웤"이야. 1. 페이지 별로 URL을!URL에 따라 또 서버에 링크 만들어 주어야 하기도 하고, URL을 어떤 규칙으로 할지 고민고민하지마! Next.js는 그냥 페이지별로 URL 정리해줍니다. 그래서 Framework!! 나만 따라와!2020/05/30 - [React] - Next.js - 페이지 자동 생성하기 - Dynamic Routes (동적 경로)Next.js - 페이지 자동 생..