Javascript/NuxtJS 3

[NuxtJS] nuxt.config.js

ssr (Server-Side Rendering)Nuxt.js 애플리케이션이 페이지를 렌더링 하는 방식을 제어한다. 서버 사이드 렌더링(SSR)과 클라이언트 사이드 렌더링(CSR) 중에서 선택할 수 있다. ssr: true: 서버 사이드 렌더링을 활성화하여 페이지를 서버에서 렌더링 한다. 이 경우, 사용자가 페이지를 요청할 때 서버가 HTML을 생성하여 클라이언트에 전송한다. 이 방식은 초기 로딩 속도가 빠르고 SEO(검색 엔진 최적화)와 페이지 로딩 성능이 향상될 수 있다. Nuxt.js의 기본값이다. ssr: false: 클라이언트 사이드 렌더링만 수행하여 서버에서 렌더링하지 않는다. 이 경우, 페이지는 클라이언트 브라우저에서 JavaScript를 통해 렌더링 된다. 초기 페이지 로딩 시 HTML이 ..

Javascript/NuxtJS 2024.08.25

[NuxtJS] Plugin

플러그인은 Nuxt.js 애플리케이션의 전역적으로 사용할 수 있는 기능을 확장하는 JavaScript 파일이다. 플러그인은 애플리케이션 초기화 시 실행되며, Vue 컴포넌트, Vue 인스턴스, Vuex 스토어 등에서 공통적으로 사용할 수 있는 메서드나 서비스를 정의한다. 플러그인 정의플러그인은 plugins 디렉토리 또는 nuxt.config.js에서 설정된 다른 경로에 저장된다. 플러그인의 정의는 기본적으로 다음과 같은 형식으로 이루어진다:// plugins/my-plugin.jsexport default (context, inject) => { // context는 Nuxt.js의 컨텍스트 객체이다. // inject 함수는 전역으로 사용할 수 있는 메서드를 등록한다. inject('myMeth..

Javascript/NuxtJS 2024.08.25

[NuxtJS] 전역 객체

$nuxtNuxt 애플리케이션의 루트 인스턴스에 대한 참조로, 애플리케이션의 전역 상태나 기능에 접근할 때 사용된다. Vue 컴포넌트 내에서 this.$nuxt를 통해 접근할 수 있다.refresh(): 현재 페이지를 강제로 리프레시하고 데이터를 다시 가져온다.navigateTo(path): 특정 경로로 프로그래밍적으로 이동한다. (Nuxt 3에서 도입된 기능)isOffline: 애플리케이션의 네트워크 연결 여부를 확인할 수 있다. $routerthis.$router는 Vue Router 인스턴스를 나타낸다. Vue 애플리케이션 내에서 라우팅 관련 작업을 관리하는 객체로, 라우트를 변경하거나 라우트 관련 정보를 처리할 때 사용된다. 이 객체를 통해 애플리케이션의 내비게이션을 조작할 수 있다.push(pa..

Javascript/NuxtJS 2024.08.25