Build a Blog with Next.js and a Headless CMS (Strapi)
In this video we'll build a blog application from scratch, starting with only a simple design in Photopea. I will first implement the design to a modern front-end web application using the Next.js framework and React.js. After that we will setup a Headless Content Management System (CMS) and integrate it with Next.js. I will also demonstrate how to setup next so that it statically generates all of the blog pages during build time for optimal performance. Along the way we'll touch on multiple interesting concepts, such as project structure, utility-based stylesheets (CSS) architecture, building reusable and responsive card components with container queries, fetching data with async/await and more.
0:00 Introduction
0:24 Design
0:46 Create a Next.js Application
4:15 Adding SASS and Global Styles
6:55 Grid System
12:48 Fonts
15:05 Typography
18:30 Header Component
22:12 Footer Component
25:25 Card Component
1:00:05 Blog Details Page
1:06:04 Headless CMS (Strapi) Setup
1:14:44 Integrate Strapi with Next.js
References:
https://nextjs.org/docs
https://docs.strapi.io/dev-docs/intro
Social Media:
Email: [email protected]
Twitter: / nikelaz
LinkedIn: / nikola-lazarov
#headless #cms #nextjs
Watch video Build a Blog with Next.js and a Headless CMS (Strapi) online without registration, duration hours minute second in high quality. This video was added by user NL Tech 21 August 2023, don't forget to share it with your friends and acquaintances, it has been viewed on our site 47,153 once and liked it 1 thousand people.