# CSR
클라이언트 사이드 렌더링(CSR), 서버 사이드 렌더링(SSR), 정적 사이트 생성(SSG) 의 정의와 장단점
우선 웹브라우저가 웹서버에 요청을 하면 웹서버는 응답을합니다.서버가 브라우저에게 전달한 응답인 HTML문서를 브라우저는 읽어들이고 해석후 사용자 (Client) 에게 보여줍니다.클라이언트 사이드 렌더링이란 초기 웹사이트 접속시 서버로부터 모든 파일을 불러와 클라이언트에
SSR CSR
SSR은 Server Side Rendering의 줄임말입니다. 웹 페이지를 브라우저에서 렌더링하는 대신에, 서버에서 렌더링합니다. 브라우저가 서버의 URI로 GET 요청을 보내면, 서버는 정해진 웹 페이지 파일을 브라우저로 전송합니다. 그리고 서버의 웹 페이지가 브라
SEO (CSR, SSR, SSG)
CSR(Client-Side-Rendering) 클라이언트 브라우저에서 어플리케이션을 렌더링을 진행한다. 즉 어플리케이션 구동에 필요한 HTML, JS, CSS 파일 등을 모두 다운로드 한 뒤에 뷰가 구성된다. > SSR(Server-Side-Rendering) 서버에서 뷰 구성에 필요한 전체 HTML을 요청을 받은 즉시 생성해서 반환한다. 이렇
SEO (CSR, SSR, SSG)
웹 페이지를 렌더링하는 방식에는 크게 CSR, SSR이 있고, 각각의 정의와 특징 및 장단점, 더해서 SSG까지 알아보도록 하자. 또한 이러한 렌더링 방식이 SEO(검색엔진 최적화)에 얼마나 유리한지 까지도 짚어볼 것이다.검색엔진 최적화, 즉 검색엔진에서 찾기 쉽도록
SEO (CSR, SSR, SSG)
클라이언트 브라우저에서 어플리케이션을 렌더링을 진행한다.즉 어플리케이션 구동에 필요한 HTML, JS, CSS 파일 등을 모두 다운로드 한 뒤에 뷰가 구성되게 된다.초기 Javascript 파일을 전부 로드한 후, 뷰를 구성해야하기 때문에 어플리케이션이 커질수록 구동시
SPA와 CSR은 같을까?
결론은 "NO" SPA, MPA는 페이지를 하나만 쓰는지, 여러개 쓰는지의 차이이고 CSR, SSR은 렌더링을 어디서 하냐의 차이로 비교 대상이 아니다. SPA에서는 첫 페이지만 받아오고 이후에 데이터의 수정,조회를 하고 싶기 때문에 CSR이란 방식을 채택한 것이다.
🧐 CSR, SSR, SSG, ISR 개념 정리 ( Next.js )
Next.js를 기반으로 CSR, SSR, SSG, ISR에 대한 개념을 정리한 작성한 포스트
CSR, SSR 방식 이해하기
이전에 사용되던 방식으로 html은 server에 배포되어 있고 client에서 특정 주소에 접속하면 server에서 html을 받아와서 보여줌문제점 : 페이지 내에서 다른 링크 클릭 시 서버에서 다시 html 문서를 가져옴, 페이지 전체가 업데이트 된다.Single
[웹개발 로드맵] 6. CSR & SSR
CSR 어제 알아본 SPA(Single Page Application)는 CSR(Client Side Rendering)로 동작한다. CSR은 Client Side Rendering, 즉 클라이언트 측에서 렌더링이 동작하는 방식이다. 렌더링이란 쉽게 말하자면 화면에 사
CSR vs SSR
Next.js로 프로젝트를 생성하게 된 이유를 정리하다보니 기본적인 개념부터 계속해서 정리해나가고 싶어서 글을 계속 임시저장하며 새 글을 작성하기까지 벌써 3번째 글,,, CSR과 SSR의 차이부터 다뤄보려고 한다!
[Next.js] Next.js?
Next.js는 Node.js를 기반으로 구축된 오픈 소스 웹 개발 프레임워크로, 서버 측 렌더링 및 정적 웹사이트 생성과 같은 React 기반 웹 애플리케이션 기능을 가능하게 합니다. React 문서에는 "Node.js로 서버 렌더링 웹사이트 구축"할 때 개발자에게
CSR vs SSR
한개의 페이지를 가진 어플리케이션사용자 친화적초기 렌더링 후 데이터만 받아오기 때문에, 상대적으로 서버 요청이 적음Virtual Dom프론트엔드와 백엔드 분리로 개발업무 분업화 및 협업이 용이개발이 상대적으로 효율적기본적으로 SPA 는 클라이언트 사이드 렌더링이지만 그
SSR과 CSR
플라스크로 JWT를 다루는 로그인 예제에서'새로고침시 엑세스 토큰이 만료되면, 리프레시 토큰을 통해 다시 엑세스토큰을 재발급 받고, 그 사이트에 접근'을 구현하는 부분에서 해결이 잘 이루어지지 않았다.SSR방식에서는 @jwt_required()로 감싸서 return r
[TIL] 0619
과제+기술 면접을 보고 부족하다고 생각한 부분과 의문점이 들었던 부분을 복습/학습했다.화면이 이미 만들어져 있냐? 요청하는 즉시 만들어지냐?정적 웹(ssg) - 이미 만들어진 화면을 보여줌동적 웹 - 클라이언트 요청에 따라 실시간 데이터가 반영된 화면을 보여줌요청 즉시
React의 SSR과 CSR
예전에는 웹 어플리케이션을 개발 할 때 하나의 웹 어플리케이션 안에 해당하는 페이지가 각각 html문서로 하나씩 저장되어있었다.서버 안에 해당하는 주소의 웹 페이지가 저장되어 있었고, 하나의 웹 어플리케이션에서 화면을 전환 할 때 해당하는 페이지가 서버에서 랜더링해 하
CSR & SSR
이번 포스트에서는 프론트엔드의 대표적인 렌더링 방식인 CSR(Client Side Renering)과 SSR(Server Side Rendering)에 특징과 어떤 시기에 사용해야 가장 좋은지에 알아보겠다.
[TIL] CSR과 SSR이란? 그리고 그 차이점은?
항해99를 수료하고 휴식기 그리고 다시 공부 시작! (티스토리와 노션은 다시보니 부족한 점이 너무 많아 버리고 다시 보충하고 정리해서 올리기로 결정...)