Uploaded August 2025 | Updated September 2026, 2 weeks ago
Let's learn Astro.js by building a full blog website with Strapi. In this session, we will cover Astro.js Component structure.
Lesson Resources: 👉 codingafterthirty.com/courses/astro-js-crash-course-2024/02-astro-components-explained
Curious about building your own website? This video is a simple and friendly guide to using Astro.js, a popular framework for creating fast websites that is beginner-friendly.
Topics Covered:
- Project Structure: A quick overview of the essential folders and files in an Astro project.
- Astro Components: An introduction to how components work, including scoped CSS and the use of frontmatter for server-side logic.
- Layouts and Slots: Learn how to utilize layouts for a consistent page structure.
- Data Fetching: A practical example of fetching data from an external API and rendering it in your component.
This series is perfect for beginners and anyone curious about using Astro with a headless CMS like Strapi.
Let's learn Astro.js by building a full blog website with Strapi. In this session, we will cover Astro.js Component structure.
Lesson Resources: 👉 codingafterthirty.com/courses/astro-js-crash-course-2024/02-astro-components-explained
Curious about building your own website? This video is a simple and friendly guide to using Astro.js, a popular framework for creating fast websites that is beginner-friendly.
Topics Covered:
- Project Structure: A quick overview of the essential folders and files in an Astro project.
- Astro Components: An introduction to how components work, including scoped CSS and the use of frontmatter for server-side logic.
- Layouts and Slots: Learn how to utilize layouts for a consistent page structure.
- Data Fetching: A practical example of fetching data from an external API and rendering it in your component.
This series is perfect for beginners and anyone curious about using Astro with a headless CMS like Strapi.
![Building My Project with Next.js and Strapi [ Learning to code by building projects ]](https://i.ytimg.com/vi/eB4fEO5vbtQ/mqdefault.jpg "Building My Project with Next.js and Strapi [ Learning to code by building projects ]
#learntocode2023 #webdevelopment #buildinpublic
Friday Night Hangout 8:00 PM CST. Its Friday night, I am single, so I might as well do some coding.
- Watch me try to code
- Ask questions
- Share some thoughts and ideas
Streaming my progress as I learn to code by building apps with Next.js and Strapi.")
![Strapi v5 Crash Course 2025 [ Part 8 Building our landing page with dynamic zones ]](https://i.ytimg.com/vi/ewgwNgEYp6I/mqdefault.jpg "Strapi v5 Crash Course 2025 [ Part 8 Building our landing page with dynamic zones ]
In Strapi tutorial part 8, we will start building our Landing Page with our next components: Content With Image, Markdown and Person Card.
👉 Lesson Notes: https://www.codingafterthirty.com/courses/strapi-5-crash-course-2025/building-our-landing-page-with-dynamic-zones
👉 Learn more about Strapi: https://strapi.link/learn-more
Welcome back to Part 8 of our Strapi Crash Course! In this tutorial, we’ll continue building our Content using Images, Markdown, and Person Card.
We learn how to use Strapis dynamic zones and allow non-technical users to manage content.
📚 What You’ll Learn:
- Creating Landing Page Content Types: Well set up a new single type for your landing page, complete with essential fields.
Dynamic Zones Explained: Discover how dynamic zones allow multiple components and can help you manage variations in content structure.
- Step-by-Step Section Creation: Continue to build out our landing page sections.
- Using Queries for Data Population: Understand how to implement populate logic to prepare your content for display.
- Middleware for Improved API Calls: Ill show you how to create middleware that automatically populates your data, making your API calls cleaner and safer.
🛠️ Key Takeaways:
- Flexible Content Management: Dynamic zones allow for easy rearrangement and addition of components.
- Better API Integration: Middleware enhances data fetching efficiency and security.
- User-Friendly Interface: Strappys intuitive content type builder simplifies creating and managing content.
- Reusable Components: Create components that can be used across multiple pages for consistency.
- SEO-Friendly Structure: The ability to manage content dynamically helps in optimizing search engines.
💬 Join the Discussion. Have questions or need clarification? Drop your comments below, and dont forget to subscribe for more Strapi tutorials!")
