Vite를 이용한 FrontEnd 프로젝트

이 게시물은 React 프로젝트를 생성하는 새로운 방법인 Vite에 대해 설명합니다.

Vite의 특징

• React뿐만 아니라 Vue, Svelte 등 다양한 프레임워크 지원
• CRA보다 가볍고 빠른 속도
• 프로젝트 생성 및 설정이 간단
• SSR 지원과 기존 CRA 사용자도 쉽게 적응 가능

프로젝트 구조 및 사용법

• index.html이 최상단에 위치
• src 폴더 내 main.jsx에서 App.jsx를 import하여 사용
• npm create vite@latest 명령어로 빠른 프로젝트 생성 가능

SSR 지원

Vite는 자체적으로 SSR을 지원하며 공식 문서에서 다양한 프레임워크별 예제를 제공합니다.

총평

CRA의 기능을 대부분 지원하면서도 빠르고 간편하므로 프런트엔드 개발에 효율적인 도구입니다.