Awesome Astro
Curated resources on building sites with Astro, a brand new way to build static and server rendered sites, with cross-framework components, styling and reactive store support. If you appreciate the content 📖, support projects visibility, give 👍| ⭐| 👏.
Astro is super duper new, improving, and becoming more expressive + powerful, but few of the APIs are still evolving. This page aspires to collect all the valauble references out there, and be a useful go-to resource when astro hits it's first stable version.
Official Docs | Launch a new project , or use Code Sandbox
Look for NEW against the post titles to find the blogs published after Astro 1.0
- Introducing Astro: Ship Less JavaScript - Fred K. Schott
- A Look at Building with Astro - Chris Coyier
- Thoughts on Astro - Chris Coyier
- Our experience with Astro - Georges
- Astro with Netlify CMS, Forestry CMS(re-visited), and Snipcart - Navillus
- How to Use Astro to Build React Apps without JavaScript - Colby Fayock
- Build wicked fast sites with Astro: An Introduction - Cassidy Williams
- A first look at Astro, astronomical results
- Why Astro matters
- SvelteKit to Astro
- Getting Started With Astro — The Innovative Static Site Generator
- Astro Will Become Your Favorite Static Site Generator
- Build a Recipe collection website with Astro - Parts → 1 - 2 - 3 - 4 - 5
- Astro: Build faster apps with less JavaScript
- Series - Learn Astro while building Ink - Get Up & Running
- Series - Learn Astro while building Ink - Astro and Site Structure
- Series - Learn Astro while building Ink - Astro and Data
- Series - Learn Astro while building Ink - Astro and Interactivity
- Series - Learn Astro while building Ink - Astro and Dynamic Pages
- Getting started with Astro
- Migrating from SvelteKit to Astro
- Personal website with Astro, Tailwind CSS, and Nx
- Astro on Cloudflare Workers
- The case about Astro
- Explore the Benefits of Astro.js by Building a Quick App NEW
- Experiments with Astro and the Shared Element Transition API NEW
- Building serverless applications with Fauna + GraphQL + Astro NEW
- Learn how to install Astro with Tailwind CSS and Flowbite NEW
- Automatic article suggestions in Astro NEW
- Learn Astro by creating your web portfolio (Spanish) NEW
- Animated SVGs - The Ultimate Web Format NEW
- An introduction to Astro's content system NEW
- Astro just Launched.... Could it be the ultimate web framework?
- Brad Traversy's Astro Crash Course
- What’s New in Astro v1?
- I Try Astro For the First Time!
- Astro and Svelte
- Modern Websites with CSS Cascade Layers and Astro
- The Next Wave of Web Frameworks is BYOJS
- Taking Astro for a ride - portfolio edition
Pre 1.0
- Ship Less JavaScript with Astro - Fredd K. Schott & Jason Lengstorf
- Speakeasy JS – Astro: A New Architecture for the Modern Web - Fred K. Schott (YouTube - Speakeasy JS)
- Astro in 100 Seconds - Jeff Delaney (Fireship)
- Yapping About Astro - Chris Coyier (CSS Tricks)
- Astro FTW! Vue and React can work together in the same app - Jamstack Fridays
- Learning Astro with Nate Moore - Nate Moore (YouTube - React Wednesdays)
- Ship less JS with Astro - Jamstack Training
- Create template layouts for your HTML with Astro SSG - Kevin Powell
- Build faster websites with Astro
- Add comments with Airtable and Netlify
- Grow Community Through Open Source | Fred K. Schott of Astro| The Secret Sauce
- Georges on Astro as a meta web framework
- Nate Moore on Incremental Framework adoption, Solid.js support, and a future without
import React from 'react'for components. - Matthew Phillips on Astro for Web Components, lit and server-rendered custom elements
- Matthew Phillips on Astro Loading
- Nate Moore on baseline JS bundle size
- Build a landing page in 30 seconds
- Client-side routing experience with Shared Element Transitions API
- Astro-react-vue-demo
- Astro-netlify-starter
- Astro Ink - Crisp, minimal, personal blog theme for Astro
- Astro Me - Crisp, minimal, personal portfolio theme for Astro
- Astro Starter Kit
- Astro Static Tweet
- Astro Translation Example
- Astro Ghost CMS Starter - A Ghost CMS starter for Astro
- Astro Theme - Creek - A Blog theme for Astro
- Astro Theme - Odessey - A marketing website theme built with Astro and carefully crafted for startups and businesses
- Astro Theme - Sarissa Blog - A responsive blog theme for Astro
- Astro Theme - Cactus - Simple, opinionated starter built with the Astro framework for blog or website
- Astro Theme - AstroWind - Started template to make a website using Astro and Tailwind CSS.
- Astro Theme - Bigspring Light Astro - Astro Business theme using Astro and Tailwind CSS.
- Astro TAP Stack - Opinionated astro starter kit (Typescript & Tailwind + Astro + Prisma & Planet scale)
- Astro Deno Starter
- Astro + Supabase + Vercel
- Astro + Snipcart
- Astro-MFE-Demo - Showcasing how to set up a microfrontend running on Astro.
- Refo - A static site and resume example with styled components.
- Astro Blog Starter with Netlify CMS - Template based on the Astro blog starter kit + Astro Netlify CMS integration.
- Catonaut - Browser extension template using Astro and Bun.
- Astro Saas - SaaS website tempalte built with Astro and Tailwind CSS.
- AstroMax - Brutalist landing page tempalte built with Astro and Tailwind CSS.
- SwissFolio - A Swiss style landing page template for personal use built with Astro and Tailwind CSS.
- Minimal Studio - An minimal landing page template for agencies, studios or freelancers built with Astro and Tailwind CSS.
- Gurido A super cool, playfull and modern landing page template for agencies, studios or freelancers built with Astro and Tailwind CSS.
- MicroBlog - An elegant blog website template built with Astro, Tailwind CSS and MDX.
- Quick Store - A minimal dark theme landing page to sell digital products.
- Astro SEO - Better SEO with Astro
- Astro Stylesheet Component - Abstract the monotony of adding stylesheets to any Astro project
- Astro Command - Statically render commands and build components in any language
- Astro Pandoc - Pandoc rendering for Astro
- Astro SPA - The SPA library for Astro that will turn your website into a Single Page Application
- Astro Icon - Straight-forward Icon component for Astro
- Astro ImageTools - Image Optimization tools for the Astro JS framework
- Accessible Astro Components
- Astro Eleventy Image
- Astro Forms - Forms in Astro made easy
- Astro Auto-import - Auto-import components in Astro projects
- Astro Collection - An Astro components and configurations collection
- Astro Link - Detects external / anchor / same domain / mail / telephone href, and apply optimizations accordingly
- Sarissa Pagination - Add page number buttons for pagination. Automatically add and disable numbers as current page number.
- Astro Google Fonts Optimizer - An Astro integration to optimize the Google Fonts loading performance
- Astro SEO Meta - Astro component to add tags that are relevant for search engine optimization (SEO) to your pages.
- Astro Heroicons - Heroicons as Astro components
- Astroad - A pre-configured setup for easy website development with Astro and Payload CMS using Docker.
- Astro Social Share - Social media share buttons for your Astro site
- Astro Gist - Astro component to easily add GitHub gists to your blog
- Astro Breadcrumbs - Well configurable breadcrumb component for Astro. Create breadcrumbs completely dynamically or specify exactly how they should look.
- Astro Content - A text based, structured content manager, for edition and consumption — AstroJS Integration
- @storyblok/astro - Astro module for the Storyblok, Headless CMS
- @unocss/astro - The UnoCSS integration for Astro
- @yeskunall/umami - Add Umami Analytics to your website
- Google Font Optimizer - An Astro integration to optimize the Google Fonts loading performance
- Astro Firebase - Deploy your server-side rendered (SSR) Astro app to Firebase
- Astro Font Picker - A Dev Toolbar Integration that lets you try out different fonts on your website
- ParaglideJS - A tiny, type-safe i18n integration that only ships messages used on islands to the client.
- https://astro.build/showcase/ (Official Showcase Directory)
- Designcember
- Serverless(CSS Tricks)
- Trivago - Tech Blog
- Rokt
- Backlight
- Apparently.cz
- Replicant.band
- animerdesateliers.com
- reindeere.ca
- Opensauced
- T3 Tools
- Easybank Landing Page(source)
- Humnutrition
- leosvel.dev
- eriksolsen.com
- hexarolls.com
- jadezak.com
- Overlayed
- okikio.dev
- bowling-reference.com
- component-party.dev
- linkhub.online (Source)
- firefla.me
- jmae.xyz
- meteor10
- Astro Hackathon Showcase
- andri.dk/
- alchemycodelab.com
- petar.radojevic.rs
- coolify.io
- zapp.run
- openspartan.com/
- aidankinzett.com (Source)
- ukuvota.world (Source)
- Oengi.com
- running.supply