Installation

Prerequisites

Before you begin, make sure you have the following installed on your system:

• Node.js 22.12.0 or later — Astro 6 requires a modern Node.js runtime
• npm (comes with Node.js) or your preferred package manager (pnpm, yarn, bun)
• A code editor with TypeScript support (VS Code recommended with the Astro extension)

Creating a New Project

The fastest way to create an Astro project is using the create astro CLI tool:

npm create astro@latest my-project

This will launch an interactive wizard that guides you through project setup, including choosing a template and whether to install dependencies. For a content-focused project, the Blog template is a great starting point, but you can also start with the Minimal template and add content collections yourself.

Adding Content Collections

Content Collections are built into Astro — no additional packages needed. To set them up:

1. Create a src/content/ directory
2. Add a content.config.ts file to define your collections and schemas
3. Create subdirectories for each collection (e.g., src/content/blog/, src/content/docs/)
4. Add your Markdown files to the appropriate directories

Installing Tailwind CSS

For styling, we recommend Tailwind CSS v4. Install it with the Vite plugin:

npm install tailwindcss @tailwindcss/vite

Then add the plugin to your astro.config.mjs and import Tailwind in your global CSS file. See the Styling guide for complete setup instructions.

Running the Dev Server

Once your project is set up, start the development server:

npm run dev

This starts Astro’s dev server on http://localhost:4321 by default. The dev server supports hot module replacement (HMR), so your changes appear instantly in the browser.

Building for Production

When you’re ready to deploy, build your project:

npm run build

This generates a static site in the dist/ directory that you can deploy to any static hosting provider like Netlify, Vercel, Cloudflare Pages, or a simple web server.