Skip to content

Create a New Site

Using the Scaffold CLI

The @easy-web/create CLI scaffolds a new Astro site pre-configured with all easy-web packages:

pnpm create @easy-web my-site
cd my-site
pnpm install
pnpm dev

Manual Setup

Bootstrap a new site instance manually:

1. Create an Astro project

pnpm create astro@latest my-site
cd my-site

2. Install easy-web packages

pnpm add @easy-web/theme-core \
         @easy-web/i18n \
         @easy-web/content-blocks

3. Add the theme to your base layout

---
import '@easy-web/theme-core/theme.css';
import { ThemeToggle, Header, Footer } from '@easy-web/content-blocks';
---
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
  </head>
  <body>
    <Header>
      <ThemeToggle slot="end" />
    </Header>
    <main>
      <slot />
    </main>
    <Footer />
  </body>
</html>

4. Configure i18n (optional)

import { defineConfig } from 'astro/config';

export default defineConfig({
  i18n: {
    defaultLocale: 'en',
    locales: ['en', 'de'],
  },
});

5. Add i18n helpers

// Use localizedHref for locale-aware links
import { localizedHref } from '@easy-web/i18n';

const link = localizedHref('/about', 'de'); // → '/de/about'
const defaultLink = localizedHref('/about', 'en'); // → '/about'

Project Structure

my-site/
├── src/
│   ├── components/        # Site-specific components
│   ├── layouts/
│   │   └── Base.astro     # Uses easy-web-theme-core + content-blocks
│   ├── pages/
│   │   ├── index.astro
│   │   └── [lang]/        # i18n routes
│   └── content/           # Astro content collections
├── public/
├── astro.config.mjs
└── package.json