# SSR
Next.js에서의 SSR이란
Client-Side-Rendering 과 Server-Side-Rendering은 다른 velog나 블로그에 너무나 많이 정리 되어있어서 그거를 참고하면 좋을 것 같다. 나도 그런 것을 보고 공부를 더 확실하게 해야겠다.Next.js에서는 next의 SSR을 이렇게
Next.js 동적 라우팅 SSR
이전에는 Next의 getInitialProps를 활용하여 기본적인 SSR을 해보았다. 이제는 동적라우팅으로 되어있는 페이지들을 SSR하게 만들어 볼 것이다. 그리고 styled-components가 처음에는 csr로 실행이 되어 css가 적용되지 않고 나타났다가 적용
Next.js-Tutorial-1
안녕하세요. thsoon입니다.이번에 포스팅이란걸 처음 써봐 부족한 뉴비지만 차근차근 써보도록 하겠습니다.포스팅을 시작하게 된 이유는 언제 한번 블로그를 만들고 싶은 생각이었기도 하고, 지금 하고 있는 프로젝트가 인원들이 서로 다른 분야의 기술을 가지고 있어, 기술 교
Next.js SSR 해보기
저번에 하던 폴더에서 Next.js 공식문서를 보고 ssr을 해보려고 한다.ssr(server-side-rendering)으로서 서버로부터 그려진 view를 받아오기 때문에 초기 구동 속도가 빠르고 seo 최적화 하기에 좋다.자세한 설명들은 다른 글에 잘 작성되어 있는
SSR 개념 이해와 Next.js로 실습까지 해보는 SSR 환경 구축하기
서론 안녕하세요, 영훈입니다. 엄청 오랜만에 글을 썼네요. 이번 글에서는 SSR은 어떤 개념이고 react와 같은 SPA에서 어떻게 SSR 환경을 쉽게 구축하는지에 알아보려고 합니다. 또한 실습을 통해서 Next.js와 좀더 친숙해질 수 있도록 하려고 합니다. 차근차근 따라하면 개념을 쉽게 익힐 수 있게 글을 썼습니다. SSR은 무엇인가요? SSR은 S...
SSR in Serverless using React , AWS Lambda - 1
들어가기 전에 준비물 Aws Account Nodejs Serverless framework cli. Parcel 위의 준비물을 모두 갖췄다면, 다음을 터미널 환경에서 진행해보도록 하겠습니다. 위 작업은 서버리스 프레임워크의 대쉬보드를 이용하기 위한 것입니다. 웹 브라우저를 통한 로그인이 되는 것만 확인하신 후 넘어가시면 됩니다. 추가적으로 샘플 서비...
SSR in Serverless using React, AWS Lambda - intro
해당 내용은 최근 업무 중 발생한 니즈 "아 프론트엔드 서버 관리에 대한 부담을 줄이고 싶은데, 서버 사이드 렌더링 로직을 서버리스로 옮겨볼 수는 없을까?"을 바탕으로 AWS 서버리스를 활용해 리액트 서버 사이드 랜더링 예제입니다. 기본적으로 참고할 내용은 How to implement Serverless Server-Side Rendering in Re...
[주니어탈출기] Apollo Client 시작하기
회사 프로젝트 기술 스펙을 정리하자면, > - next.js > - styled-components > - apollo-client ⇒ 그래프큐엘 서버연동 라이브러리 > - apollo-cache(apollo-client) ⇒ 로컬 상태 관리 > - jest, enzyme > - eslint > - prop-types ⇒ 컴포넌트 props 타입 체킹 > ...
SPA에서의 SSR과 CSR
이 글은 SPA(Single Page Application)에서의 SSR과 CSR을 비교하기 위해 작성되었다(편의를 위해 반말 사용). - 최근 수정: 2019. 09. 22 초기 View 로딩 속도 먼저 전통적인 SSR과 CSR의 가장 큰 차이 중 하나인 '초기 View 로딩 속도'를 살펴보도록 하자. 전통적인 SSR의 경우에는 View를 서버에서 ...
NextJS는 왜 쓰는 걸까?
이 글을 쓰기 전에 NextJS에서 제공하는 Quick Start를 따라 간단한 예제를 구현한 경험이 있었다. 하지만, 그저 쓰면 좋다고만 알았지, NextJS를 왜 써야하고 무엇을 위해 존재하는지를 알지 못했기 때문에 이번 기회를 통해 제대로 NextJS를 사용한다는 것이 무엇을 의미하는지를 이해하고 입문해보려 한다. 더불어 지금 회사에서 인턴 생활을...
[주니어탈출기] 서버사이드렌더링(SSR) & 클라이언트사이드렌더링(CSR)
서버사이드렌더링 & 클라이언트사이드렌더링 왜 모바일의 시대에 등장한 클라이언트사이드렌더링 Single Page Application(SPA)! 고려해야할 점들이 있다. SPA는 최초 한 번 페이지 전체를 로딩한 후 데이터만 변경하여 사용할 수 있는 애플리케이션을 의미한다. 렌더링 방식 SPA는 클라이언트사이드렌더링방식 이다. 기본적으로 페이지 로드가 없...