# SSR

221개의 포스트
post-thumbnail

[Network] AJAX, SSR, CSR, SSG

JavaScript, DOM, Fetch, XMLHttpRequest, HTML 등의 기술을 사용하는 웹 개발 기법웹 페이지에서 필요한 데이터만 비동기적으로 받아와 유저의 요구에 따라 변화해야 하는 부분만 렌더링한다.Fetch이전에 사용하던 XHR(XMLHttpRequ

21분 전
·
0개의 댓글
post-thumbnail

검색 엔진 최적화(SEO) 개념적 이해

SEO를 잘 해놓으면 값을 지불하지 않고도 사용자들을 유입시킬 수 있습니다. 일종의 공짜 마케팅 역할을 할 수 있습니다. SEO에서 개발자의 역할을 알아보기 위해 SEO의 동작과정과 개념들을 알아보겠습니다.

1일 전
·
1개의 댓글
post-thumbnail

SPA(Single Page Application)란 - CSR, SSR과 함께

SPA(Single-Page Application, 스파)는 단일 페이지로 구성된 웹 애플리케이션을 일컫는다. (구체적 설명은 아래에!)서버사이드 렌더링을 사용하는 기존 웹은 다른 화면으로 이동하기 위해서 서버에 리소스를 요청해야 한다. 요청 후, 웹(client)은

3일 전
·
0개의 댓글
post-thumbnail

first-child vs first-type-of

Next.js로 하던 프로젝트에서 위와 같은 경고 문구가 떳다. SSR 환경에서 first-child는 unsafe 하니까 first-of-type으로 바꿔라고 한다.바꾸니까 경고 문구가 사라지고, 제대로 동작하는 것을 볼 수 있었다. 그래서 first-of-type이

6일 전
·
0개의 댓글

CSR-SSR/SPA-MPA

서버로부터 HTML 파일을 받아 브라우저(Client)에 표현하고 그리는 작업을 렌더링이라한다. HTML, CSS, JS 등 개발자가 작성한 문서가 브라우저로 출력되는 일련의 과정TODO -> 렌더링 과정 링크 추가SSR: Server-Side Rendering(서버

7일 전
·
0개의 댓글
post-thumbnail

기술면접 4. 프론트엔드 (spa, react 등)

https://junilhwang.github.io/TIL/Javascript/Design/Vanilla-JS-Virtual-DOM/https://linked2ev.github.io/devlog/2018/08/01/WEB-What-is-SPA/과거의

2022년 1월 18일
·
0개의 댓글
post-thumbnail

Next.js - SSR, CSR, Next.js를 사용하는 이유

next.js는 React의 프레임워크로 SSR(Server Side Rendering)을 쉽게 구현하게 해주며, SEO(Search Engine Optimization)등의 여러기능을 제공한다. 또한 기본적으로 React에서 흔히 사용되는 CSR(Client Side

2022년 1월 15일
·
0개의 댓글
post-thumbnail

[KDT]FCFE - 8주5일 forwardRef, Deploy

useRef 사용forwardRef: 상위로 참조 전달하기!create react app 을 사용해 만든 프로젝트는 npm run build 를 통해 빌드 할 수 있다.build/static 폴더 안에 JS,CSS 파일들이 생성, 파일 이름에 hash 값이 붙는다.❗️

2022년 1월 14일
·
0개의 댓글
post-thumbnail

CSR, SSR

CSR과 SSR의 렌더링 방식과 장,단점

2022년 1월 13일
·
0개의 댓글

서버사이드 렌더링 (CSR/SSR)

서버에서 html을 렌더링해서 브라우져에 전달해 주는것서버에서 완성된 페이지를 한번에 브라우저에게 전달해서 사용자가 원하는 페이지를 보여주는 것이다.완성된 페이지를 보여준다는 장점이 있지만 그렇기때문에 서버사이드에서 렌더링이 늦어지면 그만큼 페이지를 리턴하는 속도가 느

2022년 1월 13일
·
0개의 댓글

1.11

서버에서 JSON파일로 가져와서 javascript를 이용하여 동적으로Server Side Rendering의 줄임말웹 페이지를 브라우저에서 렌더링하는 대신 서버에서 렌더링을 한다.서버에서 웹 페이지를 브라우저로 보내기 전에 서버에서 완전히 렌더링하였기 때문에 Serv

2022년 1월 11일
·
0개의 댓글
post-thumbnail

HTML, HTTP API, CSR, SSR

고정된 HTML 파일, CSS, JS, 이미지, 영상 등을 제공주로 웹 브라우저동적으로 필요한 HTML 파일을 생성해서 전달웹 브라우저: HTML 해석흔히 REST API라고 알고 있는 영역 또한 HTTP API범주 안에 있고,'자원의 식별', '메시지를 통한 리소스

2022년 1월 11일
·
0개의 댓글

SSR react next 쓰는이유

요약해서 말하자면 1\. 제일먼저 처음 접속한 웹 페이지 로딩 시간 단축하기 위해검색엔진 노출을 위해 react router 사용 간략화Next.js는 기본적으로 빌드 시에 만든 모든 페이지를 미리 렌더링을 하여 사용자에게 빠르게 보여준다. (전형적인 SSR 방식)그

2022년 1월 9일
·
0개의 댓글
post-thumbnail

[CS] 클라이언트 빌드와 배포 Day-44

웹 페이지를 브라우저에서 렌더링하는 대신, 서버에서 렌더링합니다. 브라우저가 서버의 URI로 GET 요청을 보내면, 서버는 정해진 웹 페이지 파일을 브라우저로 전송합니다. (웹 페이지가 브라우저에 도착하면 완전 렌더링 됩니다. 서버에서 완전 렌더링했기 때문에 SRR이라

2022년 1월 4일
·
0개의 댓글
post-thumbnail

[FE지식] CSR VS SSR (Next.js는 언제 사용할까요?)

현재 우리가 보고 있는 브라우저의 화면은 브라우저 렌더링 과정을 통해 만들어진 것입니다. 어디서 최종적으로 만들어서 보여주느냐, 어떻게 개발하느냐에 따라서 CSR과 SSR 두 가지 방식으로 나뉩니다. 두 방식의 차이를 이해하기 위해서는 SPA와 MPA의 이해가 선행되어

2022년 1월 2일
·
0개의 댓글

섹션1. 웹 애플리케이션의 이해

모든것이 HTTP 메시지에 모든 것을 전송서버간에 데이터를 주고 받을 때도 대부분 HTTP 사용

2022년 1월 1일
·
0개의 댓글
post-thumbnail

SSR/CSR, SPA/MPA, PWA 정리

SSR/CSR, SPA/MPA, PWA 개념정리

2021년 12월 31일
·
0개의 댓글

CSR, SSR, Next.js

서현씨 테크톡

2021년 12월 31일
·
0개의 댓글

CSR vs SSR

요청 받은 내용을 브라우저에 표시하는 것을 의미.Client Side Rendering은, SPA\*로 최초에 Html을 비롯해 CSS, JavaScript 등 각종 리소스를 받아온 뒤, 이후에는 서버에 데이터만 요청하고 자바스크립트로 뷰를 컨트롤 하는 방식을 말한다.

2021년 12월 30일
·
0개의 댓글
post-thumbnail

Nextjs Router를 활용하여 이전페이지 redirection 구현하기

next router query면 다 된다

2021년 12월 29일
·
0개의 댓글