Description #
Astro is a modern frontend framework focused on delivering ultra-fast websites by shipping less JavaScript. It allows developers to use multiple UI frameworks (React, Vue, Svelte, etc.) in one project and renders pages as static HTML by default, enhancing performance and SEO.
History #
Astro was launched in 2021 by Fred K. Schott and the team at The Astro Technology Company. It quickly gained popularity for its innovative “Islands Architecture” and zero-JS-by-default approach. Astro is now widely adopted for static sites, blogs, documentation, and modern web apps.
Hello World Code #
---
// src/pages/index.astro
---
<html>
<head><title>Hello</title></head>
<body>
<h1>Hello, World!</h1>
</body>
</html>
How to Run #
Option 1: Online
Option 2: Local
- Create a new project:
npm create astro@latest
Navigate to your project:
cd my-astro-site
npm install
npm run dev
- Visit:
http://localhost:4321
Key Concepts #
- Zero-JS by default
- Partial hydration with “Islands Architecture”
- Supports multiple UI frameworks
- Static Site Generation (SSG)
- Markdown and MDX support
- Built-in image optimization
- Lightning-fast performance
- File-based routing
- Server-side rendering (optional)
- Integrates with CMSs and APIs
Try It Online #
Fun Facts #
- Astro lets you use React, Vue, and Svelte in the same project.
- Its architecture was inspired by web performance research.
- Astro sites often score 100 on Google Lighthouse by default.