Project setup with create-svelte - Mini Project: Build & Apply

Project setup with create-svelte

📖 Scenario: You want to start a new web project using Svelte, a tool that helps you build fast and interactive websites easily.To do this, you will use create-svelte, a command-line tool that sets up everything you need for a Svelte project.

🎯 Goal: Set up a new Svelte project using create-svelte and prepare it to run on your computer.

📋 What You'll Learn

Use the npm create svelte@latest my-svelte-app command to start the project setup

Choose the default options when prompted

Navigate into the project folder my-svelte-app

Install the project dependencies with npm install

Start the development server with npm run dev -- --open

💡 Why This Matters

🌍 Real World

Setting up a Svelte project is the first step to building modern, fast, and interactive web applications.

💼 Career

Knowing how to initialize and run a Svelte project is essential for frontend developers working with modern JavaScript frameworks.

1

Initialize the Svelte project

Run the command npm create svelte@latest my-svelte-app in your terminal to create a new Svelte project folder named my-svelte-app. Choose the default options when asked.

Svelte

# Run the command to create the Svelte project
# Your code here

Need a hint?

Use the exact command npm create svelte@latest my-svelte-app to start the project setup.

2

Navigate to the project folder

Change your current directory to the new project folder by running cd my-svelte-app in your terminal.

Svelte

npm create svelte@latest my-svelte-app
# Change directory to my-svelte-app
# Your code here

Need a hint?

Use cd my-svelte-app to enter the project folder.

3

Install project dependencies

Install all the required packages for the project by running npm install inside the my-svelte-app folder.

Svelte

npm create svelte@latest my-svelte-app
cd my-svelte-app
# Install dependencies
# Your code here

Need a hint?

Run npm install to download all needed packages.

4

Start the development server

Start the Svelte development server and open your browser automatically by running npm run dev -- --open inside the my-svelte-app folder.

Svelte

npm create svelte@latest my-svelte-app
cd my-svelte-app
npm install
# Start the dev server and open browser
# Your code here

Need a hint?

Use npm run dev -- --open to launch the server and open the app in your browser.