[SvelteKit] 스벨트 킷 프로젝트 시작하기

Javascript/Svelte

SeongJo 2024. 11. 13. 23:58

안녕하세요, 성조입니다.

지난 포스트에서 스벨트와 스벨트킷의 차이점을 다뤘는데요

이번에는 스벨트 킷 프로젝트를 세팅하고 시작하는 방법을 정리해보려 합니다 🤓

참고로, 이번 프로젝트는 VSCode(IDE)와 Node.js 22.11.0 버전을 기반으로 한 0.6.6ver으로 개발되었습니다🫡

프로젝트 생성 cmd

프로젝트 생성 명령어는 다음과 같다.

npx sv create .
npm install

Svelte CLI는 세 가지 템플릿을 기본으로 제공한다.

1. SvelteKit minimal

최소한의 설정만 포함된 기본 구조이며, 프로젝트 구성의 처음부터 끝까지 커스터마이징을 하고 싶을 때 추천된다.

2. SvelteKit demo

SvelteKit의 기능을 학습할 수 있도록 기본 구조와 세팅이 되어 있는 데모 템플릿이다.

작동 방식을 이해하거나 빠르게 테스트하면서 학습하기 좋으며, MVP를 테스트하기 좋은 세팅이라 볼 수 있다.

3. Svelte library

재사용 가능한 Svelte 컴포넌트를 개발하기 위한 템플릿이라고 한다. NPM에 배포할 라이브러리를 만들거나, 팀 라이브러리로 만드는 것이 좋다고 판단된다.

본인은 demo를 사용하였다.

프로젝트에 타입스크립트를 적용할 것인지 기본 JS를 적용할 것인지를 다룬다.

데이터베이스 선택

프로젝트가 시작됐다.

로컬에서 5173 포트에 접속하면 다음과 같은 간단한 Count 데모 프로젝트 구성 품이 보인다

잘못된 부분이나 궁금한 부분이 있다면 언제든지 댓글로 문의해 주시면 감사드리겠습니다!

다음 포스트에서 뵙겠습니다!