Files

Tim Krampitz 01046b01e4 Neue Skills, Referenzen & OpenWiki-Doku integriert

Umfangreiche Erweiterung der Skill-Bibliothek: Neue Skills für Humanisierung (Englisch/PT-BR), Design-Validierung, AI-SEO und Coolify-Deployment inkl. Regelwerke, Presets, Pattern-Referenzen, Testfälle und Automatisierungsskripte. Zusätzliche Skills für Revenue-Centric Design, Pier Cloud, OKF, Lebenslauf- und LinkedIn-Optimierung sowie zahlreiche Referenzdateien, Checklisten und YAML/JSON/Markdown-Templates. Einführung einer vollständigen OpenWiki-Dokumentation mit Architektur-, Domain- und Workflow-Beschreibungen, zentralem Index und automatisierten Updates. Modularer Aufbau, restriktive Lizenzen und umfassende Qualitäts- und Evaluationsmechanismen für alle neuen Inhalte.

2026-07-26 14:00:58 +02:00

5.4 KiB

Raw Permalink Blame History

Astro v6 Features (still current in v7)

These features were introduced or stabilized in Astro v6 and remain fully supported in v7.

1. Content Collections v2

Type-safe content management with Zod schemas and flexible data loaders.

// content.config.ts
import { defineCollection, z } from 'astro:content';

const blog = defineCollection({
  loader: glob({ pattern: '**/*.md', base: './src/content/blog' }),
  schema: z.object({
    title: z.string(),
    date: z.date(),
    draft: z.boolean().default(false),
  }),
});

export const collections = { blog };

Loaders:

file() — single file (JSON, YAML)
glob() — match files by pattern
Custom loaders — fetch from CMS at build or request time (live collections)

Querying:

import { getCollection, getEntry } from 'astro:content';

const posts = await getCollection('blog', ({ data }) => !data.draft);
const post = await getEntry('blog', 'my-post');

2. Server Actions

Type-safe RPC endpoints with Zod validation.

// src/actions/index.ts
import { defineAction } from 'astro:actions';
import { z } from 'astro:schema';

export const server = {
  subscribe: defineAction({
    input: z.object({ email: z.string().email() }),
    handler: async ({ email }) => {
      // process subscription
      return { success: true };
    },
  }),
};

Usage in components:

import { actions } from 'astro:actions';

const result = await actions.subscribe({ email: 'user@example.com' });

Form integration with progressive enhancement:

<form method="POST" action={actions.subscribe}>
  <input type="email" name="email" />
  <button type="submit">Subscribe</button>
</form>

3. Sessions

Server-side session management with pluggable drivers.

Config:

// astro.config.mjs
export default defineConfig({
  session: {
    driver: 'cookie', // also: node-fs, redis, etc.
  },
});

Usage:

// In pages/endpoints
const user = await Astro.session.get('user');
await Astro.session.set('user', { name: 'Alice' });

// In middleware
const user = await context.session.get('user');

4. Server Islands

Defer component rendering to request time while keeping the page static.

---
import UserGreeting from '../components/UserGreeting.astro';
---
<UserGreeting server:defer />

Placeholder rendered at build time
Component fetched and rendered at request time
Perfect for personalized content in otherwise static pages

5. Environment Variables (astro:env)

Type-safe, validated environment variables.

import { MY_SECRET } from 'astro:env/server';
import { PUBLIC_API_URL } from 'astro:env/client';

Schema definition:

// astro.config.mjs
export default defineConfig({
  env: {
    schema: {
      MY_SECRET: envField.string({ context: 'server', access: 'secret' }),
      PUBLIC_API_URL: envField.string({ context: 'client', access: 'public' }),
    },
  },
});

Variables are validated at build time — missing or invalid values cause build failures.

6. On-Demand Rendering

Hybrid static/SSR on a per-page basis.

---
// This page renders on every request
export const prerender = false;
---

Adapters:

@astrojs/node
@astrojs/cloudflare
@astrojs/netlify
@astrojs/vercel

Hybrid mode: static by default, opt individual pages into SSR with prerender = false.

7. View Transitions

Client-side navigation with animated transitions between pages.

---
import { ViewTransitions } from 'astro:transitions';
---
<head>
  <ViewTransitions />
</head>

<h1 transition:name="title" transition:animate="slide">Hello</h1>
<div transition:persist>
  <!-- State preserved across navigation -->
</div>

Lifecycle events:

astro:before-preparation
astro:after-swap
astro:page-load

8. Middleware

Request/response pipeline with access to context.

// src/middleware.ts
import { defineMiddleware, sequence } from 'astro:middleware';

const auth = defineMiddleware(async (context, next) => {
  const token = context.cookies.get('token');
  context.locals.user = await validateToken(token?.value);
  return next();
});

const logging = defineMiddleware(async (context, next) => {
  console.log(context.url.pathname);
  return next();
});

export const onRequest = sequence(auth, logging);

Access to context.locals, context.cookies, context.redirect().

9. Image Optimization

Built-in image processing with automatic optimization.

---
import { Image } from 'astro:assets';
import hero from '../assets/hero.png';
---
<Image src={hero} alt="Hero" width={800} />

Automatic format conversion, lazy loading, responsive sizes
Remote images configured via image.domains and image.remotePatterns:

// astro.config.mjs
export default defineConfig({
  image: {
    domains: ['cdn.example.com'],
    remotePatterns: [{ protocol: 'https', hostname: '**.example.com' }],
  },
});

10. Internationalization (i18n)

Built-in i18n routing with locale-aware URL generation.

// astro.config.mjs
export default defineConfig({
  i18n: {
    defaultLocale: 'en',
    locales: ['en', 'pt-br', 'es'],
    routing: {
      prefixDefaultLocale: false,
    },
  },
});

URL generation:

import { getRelativeLocaleUrl } from 'astro:i18n';

getRelativeLocaleUrl('pt-br', '/about'); // → /pt-br/about

Strategies: pathname prefixes or domain-based routing.

5.4 KiB Raw Permalink Blame History