World Congress 2023 Aug 11, 2023

One Framework To Rule Them All: Faster Websites With Astro

Eddy Vinck

Why ship huge JavaScript bundles for static content? Discover how Astro's Islands Architecture lets you mix React, Vue, and Svelte while delivering zero-JS websites by default.

Pause
Mute Enter Fullscreen
#1 about 3 min

Introduction to Astro for content-focused websites

Astro provides a streamlined development experience specifically designed for content-heavy sites rather than complex web applications.

#2 about 2 min

Flexible UI frameworks and content management integrations

Developers can build with multiple JavaScript frameworks and integrate various headless CMS options or Markdown.

#3 about 3 min

Understanding zero JavaScript and the Islands architecture

Astro ships zero JavaScript by default while allowing specific interactive components through client directives.

#4 about 3 min

Comparing Astro to PHP and static site generators

A personal website evolution demonstrates how Astro reduces unnecessary complexity compared to existing solutions.

#5 about 2 min

Extending projects using community integrations and themes

Pre-built themes and integrations for tools like Tailwind and React accelerate the initial development process.

#6 about 2 min

Community support and enterprise adoption in production

Large engineering teams from companies like Google and The Guardian utilize Astro for their content platforms.

#7 about 2 min

Initializing an Astro project and directory structure

The command-line setup script generates a standardized folder structure for pages, layouts, and components.

#8 about 2 min

Understanding front matter, HTML, and scoped CSS

The custom file format combines component logic, templating, and isolated styling into a single location.

#9 about 2 min

Type-safe Markdown using Astro content collections

Content collections validate required front matter data during the build process to prevent missing information.

#10 about 3 min

Live demo of generating and customizing a blog

Applying a community theme quickly establishes a working site with customized styling and properties.

#11 about 4 min

Deploying to Netlify and reviewing site features

Integrating a GitHub repository with Netlify enables fast deployment and showcases built-in search and authoring features.

#12 about 2 min

Integrating interactive components and alternative rendering modes

Passing content collection data into client-rendered components bridges static content with dynamic interactivity.

#13 about 2 min

Final recommendations and automated transcription tool

Astro serves as an ideal choice for static sites but presents constraints for complex web applications.

#14 about 5 min

Audience Q&A on Astro project constraints and integrations

Questions cover project disqualifiers, container queries, CMS recommendations for non-technical users, and static site SEO strategies.

Matching moments

2:28 min

Introduction to the Astro web framework

Francesco Napoletano Francesco Napoletano · World Congress 2024

2:11 min

Key features and advantages of the Astro framework

Francesco Napoletano Francesco Napoletano · World Congress 2024

1:43 min

Understanding the multi-page focus of the Astro framework

Maciek Palmowski Maciek Palmowski · Europe 2026 Virtual

3:46 min

Astro project file structure and application routing

Francesco Napoletano Francesco Napoletano · World Congress 2024

1:45 min

Switching content sources from Markdown to WordPress in Astro

Maciek Palmowski Maciek Palmowski · Europe 2026 Virtual

4:30 min

Tracking open source community trends in JavaScript native frameworks

Dan Cranney +2 · LIVE

Upcoming sessions on this topic

Open session

World Congress 2026 North America

September 24, 2026 · 12:50–13:20

Stage 7

Architecting AI in Angular: WebMCP, A2UI, and the Agent Experience

Ankita Sood

Sr. Principal Engineer @ Secureworks | Angular GDE

Ankita Sood
Open session

World Congress 2026 North America

September 25, 2026 · 15:30–16:00

Stage 6

Small LLM in your Browser: Huge Opportunities for Web Applications

Daniel Ostrovsky

UI/UX Architect at Payoneer | AI Architect | Full Cycle Development Expert | Public Speaker | Open Source Contributor |

Daniel Ostrovsky
Open session

World Congress 2026 North America

September 25, 2026 · 11:00–11:30

Stage 7

Beyond Vibe Coding: An AI Builder’s Guide to Migrating 10k+ React Components

Shubham Chaurasia

Senior Software Engineer @ Meta

Shubham Chaurasia
Open session

World Congress 2026 North America

September 24, 2026 · 11:00–11:30

Stage 6

Accelerating development and managing agents with the GitHub Copilot app

Christopher Harrison

Senior Developer Advocate, GitHub

Christopher Harrison
Open session

World Congress 2026 North America

September 25, 2026 · 11:00–11:30

Stage 2

Build Fast, Deploy Faster: Cross Platform AI development in 2026

Charlie Cheever

CEO & Co-Founder of Expo

Charlie Cheever
Open session

World Congress 2026 North America

September 24, 2026 · 17:30–18:00

Stage 7

Full Stack with Flutter - are we there yet?

Nemanja Stošić

Senior Flutter Developer

Nemanja Stošić