# SSR
HTTP / 네트워크
일반적인 모바일앱들을 보았을 때 인터넷 연결 없이 잘 작동하지 않는다. 그 이유는 상품 정보를 인터넷 어딘가에 존재하는 서버로부터 받아와야 하기 때문이다.만약 상품 정보들이 앱 안에 모두 담긴 경우라면 그 앱은 끊임없이 업데이트를 진행해야 한다. 새로운 상품, 삭제되
React-Query (tanstack-query) SSR 대응하기 (app directory)
React-Query는 기존 Zustand나 Recoil 혹은 Redux와 같은 상태 관리 라이브러리에서 어려운 점들을 해소할 수 있도록 도와주는 라이브러리다. 기존의 상태 관리 라이브러리들은 충분히 훌륭하지만 서버측 상태관리를 하기엔 그다지 적합하지 않은 부분들이 있
서버사이드렌더링(SSR)
: 서버에서 만들어진 HTML파일을 받아와 페이지 전체를 렌더링하는 방식이다. 클라이언트가 초기 화면을 로드하기 위해 서버에 요청을 보낸다.서버는 화면을 그리는데 필요한 데이터와 CSS를 모두 적용해 HTML과 JS코드를 브라우저에 전달한다.브라우저에서는 전달받은 페이
NEXT.js 파고들기
Next.js 는 React로 SSR(Server Side Rendering) 을 보다 쉽게 구현하기 위한 프레임워크 이다. 따라서 그 전에 SSR과 그와 관련한 CSR, SSG에 대해서 먼저 알아보자.
Next.js vs React: SSR과 CSR의 차이점을 알아보자
현 직장에서 리엑트를 처음 사용하면서 궁금한 점도 많고 Next.js에 대해서도 관심이 있었는데 정작 '왜 사용하는건가?' 에 대한 의문이 들기 시작하면서 이번 포스팅을 작성하게 되었습니다. 서로간의 여러 차이점이 있는데 그 중에서 SSR(Server-Side R
React에서 Next로 넘어가기(SSR)
Nextjs공식 웹페이지 NextJS 공식 웹사이트에 접속하면 웹을 위한 React framework라고 명시되어있다. 말 그대로 대규모의 양산형 React 앱을 더 편리하게 구축할 수 있도록 많은 기능을 제공하고 있습니다. 또한 NextJs를 프레임워크라고 얘기하
SSR 컨텍스트에서 API 호출 시 왜 Client 요청 헤더가 넘어가는가?
결론: nuxt/axios 설정이 있음proxyHeaders(https://axios.nuxtjs.org/options/요청 IP 를 통해 특정 값을 판단하여 리턴하는 getDataByIp API 가 있다. getDataByIp API는 IP를 파라미터로 받고
[요약] 2023년 리액트에 무슨 일이 일어나고 있는가?
What's Happening in React? 리액트(React)는 여전히 세계에서 가장 인기 있는 자바스크립트 라이브러리 중 하나지만 새로운 트렌드와 기술의 등장으로 리액트 개발 생태계는 계속 변화하고 있다. 위 영상(출처; Lama Dev)은 최근 React의
Front-end에서의 렌더링 방식
Next.js는 리액트 기반의 프레임워크로 웹 애플리케이션을 만드는 데 필요한 전체적인 솔루션을 제공한다. 기본적으로 React로 만든 애플리케이션은 SPA로 간주하는데 이는 Client Side Rendering 방식을 채택한다. Next.js를 사용하면 Server
SSR과 CSR의 차이점
SSR(Server Side Rendering) 이란?장점 1\. 검색 엔진 최적화(SEO)가 용이 2\. 초기 페이지 로드 속도가 빠름 3\. 브라우저가 JavaScript를 지원하지 않는 경우에도 콘텐츠가 표시 4\. 서버에서 데이터를 미리 불러올 수
Next JS, SSR, CSR?
React의 SSR(server side rendering)을 쉽게 구혈할 수 있게 도와 주는 간단한 프레임워크입니다. (리액트는 라이브러리)리액트로 개발할 때 SPA(single Page Application)을 이용하며 CSR(Client Side Renderin
SPA, MPA / CSR, SSR 줄임말 시리즈 이해 하기 👀
SPA가 SEO가 어렵다는 설명을 더 이해하고 싶어서 SPA에 대해 추가 학습하는 겸 정리해 본 자료들!! SPA, MPA / CSR, SSR을 각각 비교해보쟈