Server-Side Rendering
-
[Nuxt.js] Nuxt 학습기 - (2) LifeCycle & 렌더링 모드Front-End(Web)/Vue 2021. 11. 28. 19:54
🤔 서론 앞서 언급한, Nuxt.js의 SSR모드는 Universal SSR 이라고 지칭하며, 이는 고전적인 정적 SSR 방식과는 조금 다르다. 새로운 SSR 모드가 반영되게 된 배경으로는, 아무래도 기존 SSR의 단점인 데이터 통신 비효율성과 클라이언트 퍼포먼스를 개선하기 위해 CSR의 장점을 일부 차용한 것이다. 이러한 Universal 모드를 비롯해서, Nuxt.js 에서 지원하는 3가지 렌더링 모드(SPA, Universal, Static) 에 대해 자세히 알아보겠다! 📗 Nuxt.jsLifecycle 마지막으로, Nuxt.js의 각 사이드(Server, Client 및 라우팅 Navigation 시) Lifecycle을 좀 더 구체적으로 알아보고 포스팅을 마무리하고자 한다. 1. Server ..
-
[Nuxt.js] Nuxt 학습기 - (1) 개념 및 설치Front-End(Web)/Vue 2021. 11. 16. 01:06
🤔 서론 일전 Next.js를 공부하면서도, 그리고 회사의 이전 포털 사이트에 Nuxt.js를 사용하면서 SSR 프레임워크 환경을 어느정도 경험했었다. SSR(Server Side Rendering) 개념 자체가 이슈인 만큼, 학습뿐만이 아닌 다양한 경로(유튜브 등)를 통해 이를 접해왔었다. 회사의 리뉴얼 버전 코드에선 팀장님께서 Vue를 활용한 임의의 SSR 환경을 구성해주셨고, 여기서 역시 Nuxt와 유사한 개발경험을 해볼 수 있었다. (head 프로퍼티, asyncData 등) 이러한 개념들을 근본적으로 Nuxt.js 환경에서 개발해보고, 또 이외의 다양한 기능들을 학습해보고자 오픈API를 활용한 간단한 Nuxt.js 토이 프로젝트를 진행하였다. 이후 포스팅에선 Nuxt.js에서 활용한 주요 기능들..