Create your project

Astro has a helper that builds your project folder for you. You type one line and answer one or two questions.

Step 1: Run the helper

Click in the terminal. Type this line exactly, then press Enter:

npm create astro@latest my-site -- --template minimal

It makes a folder called my-site, with the smallest starting files inside.

$ npm create astro@latest my-site -- --template minimal
         ✔ Template copied
    ✔  Project initialized!

next   Liftoff confirmed. Explore your project!

       Enter your project directory using cd ./my-site
       Run npm run dev to start the dev server. q + ENTER to stop.

Step 2: Go into your new folder

Your terminal is still outside the new folder. Go in:

cd my-site

cd means “change directory”. A directory is a folder.

Now open the folder in VS Code too. Click the File menu, then Open Folder, and pick my-site. If VS Code asks whether you trust the folder, say yes. You made it.

Your terminal panel may close when the folder opens. Just open a new one from the Terminal menu. It will start inside my-site this time.

Step 3: Start your site

Type this and press Enter:

npm run dev

This starts the dev server. It shows you your site on your own computer, and updates every time you save a file.

$ npm run dev
 astro  v7.4.7 ready in 350 ms
┃ Local    http://localhost:4321/
┃ Network  use --host to expose
22:00:13 watching for file changes...

That page is only on your computer. Nobody else can see it. You can’t break anything that matters.

Look around

On the left side of VS Code you’ll see your folders. Three matter right now:

There’s also node_modules. It holds the tools. You never need to open it.