Vue.js/Nuxt.js 2021. 5. 21.
Nuxt.js 란? 개념과 예제 (SSR, CSR, Universal, asyncData, fetch...)
📢 들어가기 전에 이번 포스팅에선 Nuxt.js 의 개념과 구조에 대해 알아보고 간단한 예제를 구현해본다. CSR vs SSR Nuxt.js 에 대해 알아보기에 앞서, SSR과 CSR에 대해 알아보자. 이 두가지 개념은 Nuxt.js의 가장 큰 특징이라고 할 수 있다. CSR (Client Side Rendering) 클라이언트 사이드 렌더링. SPA(Single Page Application)에서 사용되는 방식이다. SPA란, 최초 한번 페이지를 전체 로딩한 후 데이터만 변경해서 사용할 수 있는 웹 어플리케이션을 말한다. 최초 페이지를 로딩한 시점부터는 페이징 리로딩(깜빡임) 없이 필요한 부분만 서버로부터 받아서 화면을 갱신하는 렌더링 방법이다. 필요한 부분만 갱신하기 때문에 페이지 이동이 자연스럽다...
Spring/Spring Boot 2021. 4. 2.
Spring Boot Maven + Nuxt.js 연동하는 법 (CORS, Proxy)
📢 들어가기 전에 Intellij IDEA Community Edition 2019.3.2 에서 진행했다. 버전이 달라도 상관 없음. Spring Boot Maven 프로젝트와 Nuxt.js 를 연동하는 방법을 알아본다. Vue.js도 거의 동일한 방법으로 진행할 수 있다. 🍃 Spring Boot (Maven) File - New - Project 로 새 프로젝트를 생성한다. 초기 화면의 Create New Project 로 생성할 수도 있다. 클릭하고나면 위와 같이 New Project 라는 창이 뜰텐데, 여기서 좌측의 Maven 을 클릭한다. (Gradle 프로젝트를 생성하고자 할땐, Gradle 을 선택해주면 된다.) 위쪽의 Project SDK 도 선택해준 뒤 다음으로 넘어간다. (아마 각자의 ..