
npm init svelte@next
npm i
npm run dev
Thats it! Thats all you need to know to get your app started.
All you need now is:
- An interpreter to process the command.
- A terminal to type in the commands.
The Interpreter
The commands starting with npm
are Node command. Node is very powerful tool that will help us install, run and build our web app.
-
Download the latest version here: https://nodejs.org/en/download/
-
Install Node
This should be a seamless process
The Terminal
The terminal we will be using to type our code is Visual Studio Code. VS Code is not just a terminal, it is a very powerful IDE that can easily be extended.
-
Download the latest version here: https://code.visualstudio.com/
-
Install VS Code.
This should be a seamless process
-
Install “Svelte for VS Code” Extension (Optional).
Although not required to get your app started, This Extension will later come in handy when we start coding our web app.
- Click on Extensions on the side bar
- Search for “Svelte for VS Code”
- Select it in the search result
- Click on Install
This extension adds great features to VS Code like: code highlighting, code completion, code formatting, error linting and many more.
Lets get started
-
Create a new folder for your project
-
Open VS Code
-
In VS Code, open the folder you created
-
Open the terminal window
-
Type in the first command and press Enter
npm init svelte@next
You will be prompted with some questions. Answers according to the image below.
This will scaffold a new project in the folder you created.
- Type in the second command and press Enter
npm i
This is the short form of ‘npm install’. This will install your app dependencies.
- Type in the third command, and press Enter
npm run dev
This will start a development server on ‘localhost:3000’.
- Open your browser and type ‘localhost:3000’ in the address bar
Viola!!!
You did it!
You have just created your first working Svelte app. This is the beginning of greater things to come.
What you have created is a skeletal project which is the most basic form of a Svelte app. This app can be expanded into an extremely high-performance web app.
You can learn more and get more details at Svelte and SvelteKit.