Kevin De Baerdemaeker

Astro Documentation

Modified 2022-10-07

Getting Started

Installation

Integrations

Deployments

Core Concepts

Why Astro?

  1. Content-focused: Astro was designed for content-rich websites.
  2. Server-first: Websites run faster when they render HTML on the server.
  3. Fast by default: It should be impossible to build a slow website in Astro.
  4. Easy to use: You don’t need to be an expert to build something with Astro.
  5. Fully-featured, but flexible: Over 100+ Astro integrations to choose from.

Astro Islands

The term “Astro Island” refers to an interactive UI component on an otherwise static page of HTML. Multiple islands can exist on a page, and an island always renders in isolation. Think of them as islands in a sea of static, non-interactive HTML.

The most obvious benefit to building with Astro Islands is performance: the majority of your website is converted to fast, static HTML and JavaScript is only loaded for the individual components that need it. JavaScript is one of the slowest assets that you can load per-byte, so every byte counts.

---
// Example: Use a dynamic React component on the page.
import MyReactComponent from '../components/MyReactComponent.jsx';
---
<!-- This component is now interactive on the page!
     The rest of your website remains static and zero JS. -->
<MyReactComponent client:load />

Basics

Guides

Integrations

Tailwind

Sitemap

Image Optimizations

Internationalization

Icons

Partytown (for analytics)

SEO

Metadata

Creator(s)

Fred K. Schott

  • Source
  • Recommended By

    Reason