# server side rendering
next ssr
next를 쓰는 주된 이유는 서버 사이드 렌더링 때문이다.서버 사이드 렌더링이란 무엇인지 부터 정확히 개념을 짚고 넘어가보자.서버 사이드 렌더링클라이언트에서 요청을 하면 html 리소스를 서버로 넘기고 서버에서 데이터를 받아와 html이 완료되고 이를 다시 클라이언트로

Project Note : Next.js tips 01
2022-02-20 / 이번 프로젝트에서 Next.js 프레임워크를 처음 사용해보며 여러 문제에 마주쳤는데, 기억 나는대로 정리해보려고 한다.
서버 사이드 렌더링과 클라이언트 렌더링
server-side rendering 서버에서 웹브라우저가 출력할 화면을 HTML로 만들어 보내는 것을 "서버측 렌더링(server-side rendering)"이라 부른다. -클라이언트 사이드 또는 유니버셜 앱 HTML을 서버를 통해 렌더링 장점 검색 엔진 SE

서버 사이드 렌더링(Server Side Rendering, SSL)
서버 사이드 렌더링(Server Side Rendering, SSR) 은 최근 개발자들이 집중하고, 강조하는 기술이다. 도대체 어떤 기술이며 왜 서버 사이드 렌더링인지 궁금했다. 서버 사이드 렌더링에 대한 이론을 공부하며 정리한다.
Client Side Rendering / Server Side Rendering
웹페이지가 사용자에게 보여지는 과정에 대해서 설명하세요.Client Side Rendering 과 Server Side Rendering 의 차이에 대해서 설명하세요.Bundling이 무엇이며 왜 필요한가요?프론트엔드 입장에서 신경써야 할 보안은 어떤 것들이 있나요?C
서버사이드 렌더링(SSR)
\-페이지 요청시마다 새로고침이 일어나며 서버에 새로운페이지에 대한 요청을 하는 방식이다. 예를 들자면 필요한 물건이 있을때마다 마트에 장을 보러 가는 것과 비슷하다. 그리고 페이지가 어떻게 보여지는지 또한 서버에서 해석하여 보내주는 방식이다.\*Rendering: 웹

[Styled-Components] Server Side Rendering을 위한 style 추출
현재 개발중인 프로젝트는 React와 Express를 사용하고 있다. 사용자가 처음 접속할 시에는 Express 서버에서 React 앱을 Server Side Rendering한 페이지를 제공하도록 작성했는데, 첫 로드 시에 Styled-Component를 사용한 el

Sapper - Svelte의 SSR 버전인가?
바로 전 Svelte를 설치하고 ie지원이 안되서 중도포기했었다.새로운 자바스크립트 프레임워크를 찾던 중 시간이 얼마 지나지않아React.js에서 Webpack의 조잡한 설정으로 구현했던 SSR(Server Side Rendering)이기본지원되는 Svelte에서 만든

[번역] Next.js 시작하기 2. Navigate Between Pages
지금까지, 우리가 만든 Next.js 앱은 오직 하나의 페이지만을 가졌습니다. 일반적으로 웹사이트와 웹앱은 다른 많은 페이지들을 가질 수 있습니다. 어떻게 우리의 앱에 더 많은 페이지를 추가하는지 탐험해보죠. 이번 레슨에서 당신이 배울 것 들입니다. 이번 레슨에서
[번역] Next.js 시작하기 1. Create a Next.js App
처음부터 React로 완벽한 웹 앱을 만들려면, 당신은 많은 세부사항들을 고려할 필요가 있습니다.코드는 웹팩같은 번들러를 이용해 묶고, Babel 같은 컴파일러를 이용해 변환되어야 합니다.코드 스플리팅과 같은 생산 최적화를 해야 합니다.검색 엔진 최적화를 위해 정적으로

SSR를 파헤치기 전까지의 일정
타입스크립트로 넘어온지 2,3주일이 지났다. 아직 모르는 컴파일 설정이 많고 타입을 효율적으로 분리하는 법을 모르지만 strict모드에서 코딩이 가능하게 되었다.

C언어와 React로 Server Side Rendering 만들기
C언어와 React를 이용해 Server Side Rendering을 만들어 봅시다.

Server Side Rendering 레시피 3가지
서버 사이드 렌더링을 직접 구성하는 일은 너무 까다습니다. 특히 최근에 웹팩이 버전 4로 업그레이드 되면서 설정 관련해서 많은 부분이 바뀌어서 참조할만한 코드도 줄어들었습니다. 그래도 얼마간의 삽질(?) 끝에 웹팩 4 및 여러가지 스택과 함께 사용할 수 있는 보일러