Uploaded August 2024 | Updated September 2026, 2 weeks ago

---

Strapi 5 Crash Course Part 2: Building our first component to represent our top nav data
Course notes: codingafterthirty.com/dashboard/strapi-5-crash-course-2024/building-our-first-component Strapi Docs: strp.cc/3yHOhAw

Hey everyone! Welcome back to the second lesson in our Strapi crash course where we learn how to build our backend with headless cms.

Last time, we set up a basic Strapi application, created our first collection type, and learned how to fetch data via an endpoint.

We're taking things a step further by building out the navigation that can be dynamically updated and displayed on your front end.

In this lesson, I'll show you how to create a flexible navigation system using Strapi, so you won't have to hard-code your navigation items.

This lesson focuses on structuring your data in a way that makes it reusable and adaptable for different projects.

We'll create a "link" component, set up a single type for global settings, and configure our top navigation and footer.

Then, I'll show you how to fetch this data via an API using Postman and ensure you're not over- or under-fetching data.

By the end of this video, you'll have a solid understanding of how to manage your data in Strapi and be ready to use it for multiple front-end applications. Let's dive in!

### Key Topics Summary:
1. Creating a flexible navigation system in Strapi.
2. Building a landing page with hero, heading, and feature sections.
3. Setting up a global settings single type to manage navigation and footer.
4. Using Strapi's query builder to fetch data efficiently.