Chapters (27)
- 0:00Course introduction and project overview
- 11:37How to follow this course and local project setup
- 15:59Getting started with Next.js 15 and Strapi 5
- 22:26Section 1- Building the home page
- 1:29:20Section 2 - Building the experience page
- 1:41:16Section 3 - Building top navigation
- 1:54:21Section 4 - Building out the footer
- 2:04:02Section 5 - Building the blog page
- 2:17:08Section 6 - Form submission with server action
- 2:41:23Section 6.5 - How to structure our blog data in Strapi
- 2:58:07Section 7 - Custom data loading content list component
- 3:14:41Section 8 - Implementing search and pagination in Next.js
- 3:45:48Section 9 - Building a single blog detail page
- 4:12:17Section 10 Building the events page and form
- 4:55:25Conclusion
- 4:57:03Where to next?
- 4:58:18Interview with Niklas on styling and Figma Design
- 5:22:06Why use Next.js
- 5:28:22Setting up Next.js
- 5:32:12Routing
- 5:36:20Layout Page
- 5:41:32Links and Navigation
- 5:44:30Server and Client Components
- 5:52:25Data fetching
- 5:59:34Dynamic Routing
- 6:11:44Not Found Page
- 6:16:26Figma for developers
Show the creator's full description
Learn how to build a website with Next.js 15 and Strapi 5. In this course you'll learn to build a fully functional summer camp website from start to finish. Through hands-on practice, you'll discover how to combine the power of Next.js's server components with Strapi's headless CMS capabilities, creating dynamic, content-rich websites that are both developer-friendly and client-manageable.
Project Repo Resources: https://github.com/PaulBratslavsky/freecodecamp-surfcamp-final
Strapi Docs: https://strapi.link/getting-started
Course from @CodingWithPaulBrats
Design in collaboration with Niklas Fisher @kizo-niklas
❤️ Try interactive Full Stack courses we love, right in your browser: https://scrimba.com/freeCodeCamp-Fullstack (Made possible by a grant from our friends at Scrimba)
⭐️ Contents ⭐️
⌨️ (0:00:00) Course introduction and project overview
⌨️ (0:11:37) How to follow this course and local project setup
⌨️ (0:15:59) Getting started with Next.js 15 and Strapi 5
⌨️ (0:22:26) Section 1- Building the home page
⌨️ (1:29:20) Section 2 - Building the experience page
⌨️ (1:41:16) Section 3 - Building top navigation
⌨️ (1:54:21) Section 4 - Building out the footer
⌨️ (2:04:02) Section 5 - Building the blog page
⌨️ (2:17:08) Section 6 - Form submission with server action
⌨️ (2:41:23) Section 6.5 - How to structure our blog data in Strapi
⌨️ (2:58:07) Section 7 - Custom data loading content list component
⌨️ (3:14:41) Section 8 - Implementing search and pagination in Next.js
⌨️ (3:45:48) Section 9 - Building a single blog detail page
⌨️ (4:12:17) Section 10 Building the events page and form
⌨️ (4:55:25) Conclusion
⌨️ (4:57:03) Where to next?
⌨️ (4:58:18) Interview with Niklas on styling and Figma Design
⌨️ (5:22:06) Why use Next.js
⌨️ (5:28:22) Setting up Next.js
⌨️ (5:32:12) Routing
⌨️ (5:36:20) Layout Page
⌨️ (5:41:32) Links and Navigation
⌨️ (5:44:30) Server and Client Components
⌨️ (5:52:25) Data fetching
⌨️ (5:59:34) Dynamic Routing
⌨️ (6:11:44) Not Found Page
⌨️ (6:16:26) Figma for developers
🎉 Thanks to our Champion and Sponsor supporters:
👾 Drake Milly
👾 Ulises Moralez
👾 Goddard Tan
👾 David MG
👾 Matthew Springman
👾 Claudio
👾 Oscar R.
👾 jedi-or-sith
👾 Nattira Maneerat
👾 Justin Hual
--
Learn to code for free and get a developer job: https://www.freecodecamp.org
Read hundreds of articles on programming: https://freecodecamp.org/news
Description and video by freeCodeCamp.org. This page is an independent companion view; the video is embedded from YouTube.