Astro Course

Here is the current list of modules for the Astro course:

Understanding Astro’s core philosophy (Why Astro? Island Architecture, Zero JS by default).
Setting up your development environment (Node.js, VS Code).
Creating your first Astro project.
Deep dive into Astro’s project structure.
Basic routing and .astro components.
Project Step: Initialize the “Developer Portfolio & Blog”, set up BaseLayout, and create basic Header and Footer components.
Module 0 Files 📁

Understanding Astro components in depth.
Reusability and composition of components.
Passing data to components using props.
Basic styling in Astro (Global CSS, Component-Scoped CSS, Introduction to Tailwind).
Working with static assets (public/).
Project Step: Refine project structure, create Hero.astro and Card.astro components, and integrate them into the homepage.
Module 1 Files 📁

Understanding Markdown & MDX in Astro: Content is King.
Introduction to Content Collections: Structured Data.
Defining Content Schemas with Zod (Type Safety!).
Querying Content Collections: Getting Your Data.
Dynamic Routing for Content: Individual Pages.
Project Step: Powering the Blog Section (Create src/content/ & config.ts, create sample blog posts, create BlogPostLayout.astro, create src/pages/blog/index.astro, create src/pages/blog/[…slug].astro, update SiteHeader.astro with blog link).
Module 2 Files 📁

You can find the GitHub repository for the finished files for this course here.