Skip to content
A browser window titled astro showing a page layout with text, images and an interactive toggle being clicked, beside two Markdown files.

Premium

Practical Guide to Astro

Build fast, content-focused websites with Astro. Learn how islands, content collections and server rendering fit together, then ship a real site to production.

Last updated Estimated reading time: 32minutes

Log in to enrol

Enrolling is free and keeps track of your progress.

Some lessons need Premium

2 lessons are free to start now. The remaining 9 lessons are part of Premium membership. Log in if you’re a member, or see what membership includes.

See membershipLog in

About this course

Astro sends zero JavaScript by default and adds interactivity only where you ask for it. This course takes you from an empty project to a deployed site, one practical step at a time.

You start with the project structure, pages and layouts, then organise Markdown content with type-safe content collections. Next you add interactive islands with the framework you already know, style everything with Tailwind, and move selected routes to on-demand server rendering with middleware and API endpoints.

The last part covers performance, images, SEO basics and deployment to Cloudflare, so you finish with a site you understand end to end rather than a template you copied.

Who it's for: developers who know HTML, CSS and some JavaScript and want a fast, maintainable way to build blogs, docs and marketing sites.

What you’ll learn

  • Set up an Astro project and explain its file-based routing
  • Build reusable layouts and components with props and slots
  • Model Markdown content with type-safe content collections
  • Add interactive islands only where a page needs them
  • Choose between static and on-demand rendering for each route
  • Protect routes with middleware and build API endpoints
  • Optimise images, fonts and Core Web Vitals
  • Deploy an Astro site to Cloudflare Workers

Course outline

5 sections · 11 lessons

  1. Section 1

    Getting started

    1. 1Why AstroFree preview
    2. 2Pages, layouts and componentsPremium, locked

  2. Section 2

    Content

    1. 3Content collectionsPremium, locked
    2. 4Pages from a collectionPremium, locked

  3. Section 3

    Interactivity and styling

    1. 5Islands and client directivesPremium, locked
    2. 6Styling with TailwindPremium, locked

  4. Section 4

    Server features

    1. 7On-demand renderingPremium, locked
    2. 8Middleware and API endpointsPremium, locked
    3. 9Structuring server codeFree preview

  5. Section 5

    Shipping it

    1. 10Images and performancePremium, locked
    2. 11Deploy to Cloudflare WorkersPremium, locked