조아마시

쓸모 있는 상세페이지 만들기

VUE 3

Vue 3 및 Router 4 기초부터 상세 가이드

Vue 3 소개Vue 3는 프론트엔드 웹 개발을 위한 JavaScript 라이브러리입니다. 2020년 9월에 출시된 최신 버전은 TypeScript 지원, Composition API, Reactivity API 등 여러가지 개선 사항을 제공합니다. Vue 3는 가볍고 사용하기 쉽고, 배우기 쉬우면서도 강력하고 유연한 프레임워크로 평가받고 있습니다.Vue Router 4 소개Vue Router 4는 Vue 3와 함께 사용되는 공식 라우팅 라이브러리입니다. SPA(Single Page Application) 구축에 필수적인 기능을 제공하며, URL 변경에 따라 동적으로 뷰를 렌더링하고, 라우트 간 이동을 관리하는 역할을 합니다.Vue 3 & Router 4 사용 장점SPA 구축: 페이지 이동 없이 URL ..

웹개발/vuejs 2024.07.20

[Vue] Vue3에서 setup() 함수와 함께 Axios와 Async/Await 사용하기

Vue3에서 setup() 함수와 함께 Axios를 사용하여 비동기 API 호출을 처리하는 방법은 다음과 같습니다.1. 설치먼저 Vue와 Axios를 설치해야 합니다. 아직 설치하지 않았다면 다음 명령어를 사용하여 설치하십시오.npm install vue axios2. 기본 사용법다음은 setup() 함수, Async/Await를 사용하여 API 호출을 수행하고 응답 데이터를 반환하는 간단한 예제입니다.3. 오류 처리위 예제에서는 try...catch 블록을 사용하여 API 호출 중 발생하는 오류를 처리합니다. 오류가 발생하면 catch 블록 내의 코드가 실행되고 오류 내용이 콘솔에 출력됩니다.4. 여러 API 호출setup() 함수와 Async/Await를 사용하여 여러 API 호출을 순차적으로 수행할..

웹개발/vuejs 2024.07.16

[Vue] Vite에서 환경변수 env 사용하기

Vite는 프론트엔드 개발을 위한 빠르고 현대적인 빌드 도구입니다. 환경변수를 사용하여 개발, 테스트 및 프로덕션 환경에서 앱의 구성을 쉽게 관리할 수 있습니다.1. 환경변수 설정Vite는 .env 파일을 사용하여 환경변수를 설정합니다. 이 파일은 프로젝트 루트 디렉터리에 위치해야 합니다..env 파일에 각 환경변수를 다음 형식으로 정의합니다.KEY=VALUE예를 들어, 다음은 API_KEY 및 BASE_URL 환경변수를 설정하는 .env 파일입니다.API_KEY=my-secret-api-keyBASE_URL=https://my-app.com주의: 민감한 정보(예: API 키, 비밀번호)는 .env 파일에 저장하지 마세요. 이러한 정보는 환경변수로 설정해야 합니다.2. 코드에서 환경변수 사용Vite는 i..

웹개발/vuejs 2024.07.16
728x90