1.1 Starlight Overview

Starlight Astro is a documentation theme built on top of the Astro framework. It’s designed specifically for creating static sites for documentation purposes, like personal or project docs. Starlight comes with features such as:

• Pre-built navigation.
• Support for table of contents.
• Search integration.
• Customizable frontmatter.
• Easy internationalization support.

1. Getting Started with Starlight Astro

1. Install Astro

   • First, make sure you have Node.js installed. Then, install Astro using the following command:

     npm create astro@latest

2. Install Starlight Theme

   • After setting up the Astro project, install the Starlight theme by running:

     npm install @astrojs/starlight

Alternative to Step 1, 2

npm create astro@latest -- --template starlight

3. Configure the Starlight Theme

   • Open the astro.config.mjs file and add the Starlight integration:

     import { defineConfig } from 'astro/config';
     import starlight from '@astrojs/starlight';
     
     export default defineConfig({
       integrations: [starlight()],
     });

4. Create Documentation Pages

   • In the src/pages/ directory, create markdown (.mdx or .md) files to start writing your docs. The basic structure might look like this:

     src/
       └── pages/
           └── index.md

5. Run the Development Server

   • Start the Astro development server to preview your documentation:

     npm run dev

6. Build and Deploy

   • Once you’re happy with the documentation, build it for production:

     npm run build

   • After that, you can deploy the static files in the dist/ directory to your preferred hosting service.

For more customization and features, you can explore the Starlight documentation.