반응형
목록 2024/11 (6)
반응형
이로
Vue3의 빌드 도구란 무엇인가?빌드 도구는 개발자가 작성한 코드(주로 JavaScript, TypeScript, CSS, 등)를 프로덕션 환경에서 사용할 수 있도록 최적화하는 데 사용됩니다. 이를 통해 코드를 압축하거나, 최신 자바스크립트 기능을 구형 브라우저에서도 사용할 수 있도록 변환하는 등의 작업을 수행합니다.Vue3에서 사용하는 빌드 도구들Vite장점빠른 개발 서버와 빌드 성능을 제공합니다.번들링 과정 없이 네이티브 ES 모듈을 통해 소스코드를 직접 제공변경된 모듈만 교체하는 HMR(Hot Module Replacement) 지원으로 빠른 리로딩초기 서버 구동 시간이 webpack 대비 매우 빠름모듈을 동적 로드하여 초기 로딩 시간을 단축합니다.Rollup 기반의 번들링으로 최적화된 프로덕션 빌..
Transaction 이란?트랜잭션(Transaction)은 데이터베이스의 상태를 변환하는 하나 이상의 작업들을 묶은 것으로, 일련의 작업들이 모두 성공하거나 모두 실패해야 하는 원자적(atomic) 단위를 의미합니다. 이를 통해 데이터의 일관성(consistency), 격리성(isolation), 지속성(durability)을 보장합니다. 트랜잭션의 4가지 주요 특성은 ACID라고 불리며, 각각 원자성(Atomicity), 일관성(Consistency), 고립성(Isolation), **지속성(Durability)**을 가리킵니다. 트랜잭션의 사용처트랜잭션은 데이터 일관성을 보장해야 하는 모든 상황에서 사용됩니다.예를 들어:주문 처리 시스템: 재고 감소, 결제, 주문 기록 등이 모두 성공하거나 모두 ..
axios.create 주요 용도 기본 설정 공통화baseURL, timeout, headers 등의 공통 설정환경별(개발/스테이징/운영) 다른 설정 적용인증 토큰 등의 공통 처리요청/응답 전처리요청 전 헤더 설정응답 데이터 가공에러 처리 통합코드 재사용성여러 컴포넌트에서 동일한 설정 재사용설정 변경 시 한 곳에서 관리 설계기본구조// @/apis/modules/user-api.jsimport { defaultAPI } from '../config/axios-config'export const userAPI = { getProfile: () => defaultAPI.get('/user/profile'), updateProfile: (data) => defaultAPI.put('/user/profile..
정적 사이트맵 생성정적 사이트 맵 생성은 특정 파일에 내가 원하는 페이지만 직접 작성하는 방법입니다.Case 1. vite.config.ts에 sitemap 내용 직접 정의npm install -D vite-plugin-sitemapimport { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' import { sitemap } from 'vite-plugin-sitemap' export default defineConfig({ plugins: [ vue() , sitemap({ hostname: 'https://your-domain.com', // 라우트 직접 정의 urls: [{ url: ..