Setting Up Your Development Environment

Before building modern frontend applications, you need to install several tools used throughout the track. These tools help you write code, run projects locally, and work with modern JavaScript frameworks like Svelte.

In this chapter, you will prepare your development environment for future projects.

1. Installing Visual Studio Code

Visual Studio Code, often called VS Code, is one of the most popular code editors used in web development.

VS Code provides features like:

• Syntax highlighting;
• Project navigation;
• Extensions;
• Integrated terminal support;
• Developer-friendly tooling.

After installation, you will use VS Code throughout the entire track.

Useful VS Code Extensions

VS Code supports extensions that improve the development experience. Some useful beginner-friendly extensions include:

• Prettier for automatic code formatting;
• ESLint for identifying code issues;
• Svelte for Svelte syntax support;
• Tailwind CSS IntelliSense for Tailwind autocompletion.

Extensions help make development faster and more comfortable.

2. Installing Node.js

Modern frontend development relies heavily on Node.js and npm. Node.js allows developers to run JavaScript outside the browser, while npm is used to install libraries, frameworks, and project dependencies.

You will use Node.js later to create Svelte projects, install packages, run development servers, and build applications.

Understanding the Terminal

Modern frontend developers frequently use the terminal to run commands and manage projects.

At first, terminal commands may look intimidating, but most frontend workflows only require a small set of commonly used commands.

Throughout the track, you will gradually become comfortable working with the terminal.