Das Astro ist ein modernes Web-Framework, das auf inhaltsorientierte Websites spezialisiert ist — Marketing-Seiten, Blogs, Dokumentationen, Content-Plattformen. Im Unterschied zu klassischen JavaScript-Frameworks geht Astro vom HTML zuerst aus: Seiten werden standardmäßig statisch ausgeliefert, JavaScript läuft nur dort, wo es ausdrücklich angefordert wird.

Astro entstand 2021 und hat sich seither zu einer der attraktivsten Optionen für Content-Auftritte entwickelt — schnell zu lernen, robust im Betrieb, ohne den Overhead eines vollständigen Single-Page-Frameworks.

Designprinzipien

Astro folgt einigen klaren Leitplanken:

  • Content first — die meisten Seiten leben von Inhalt, nicht von Interaktion.
  • Zero JavaScript by default — Seiten enthalten nur das JavaScript, das tatsächlich gebraucht wird.
  • Islands Architecture — interaktive Komponenten werden als isolierte Inseln eingestreut; der Rest bleibt statisches HTML.
  • Framework-Agnostisch — innerhalb einer Astro-Seite lassen sich React-, Vue-, Svelte- oder Solid-Komponenten gleichberechtigt einsetzen.
  • Markdown und MDX — Inhalte als Dateien sind erstklassige Bürger; ganze Sites lassen sich aus einem content/-Ordner heraus generieren.

Bauarbeiten

Eine Astro-Site besteht aus .astro-Komponenten, die wie eine Mischung aus HTML, JavaScript und Templates aussehen. Sie können Frontmatter (TypeScript-Code), Markup und Stile enthalten. Routing erfolgt dateibasiert (src/pages/…), Inhalte werden über die Content Collections API typisiert eingelesen, Bilder über eine integrierte Image-Pipeline optimiert.

Builds erzeugen statische HTML-Dateien (output: 'static', Default), bei Bedarf auch ein Hybrid- oder Server-Modus mit On-Demand-Rendering.

Wann Astro passt

Astro ist eine sehr gute Wahl für:

  • Marketing-Websites, Blogs, Magazine, Dokumentationen — alles, was inhaltlich getrieben ist.
  • Auftritte mit hoher Performance-Anforderung — wenig JS heißt schnelles Laden, gute Web Vitals.
  • Mischprojekte — wenn Bestandteile aus React oder Vue eingebunden werden sollen, ohne ein ganzes SPA-Framework drumherum zu bauen.

Für hochinteraktive Single-Page-Anwendungen ist Astro nicht das passende Werkzeug — dann sind dedizierte Frameworks wie Next.js, Nuxt oder SvelteKit besser geeignet.

/ Weiter

Zurück zu Coding

Zur Übersicht