Build Blog App with Next.js 14 | Strapi v4 Headless CMS and Tailwindcss
21.6 هزار بار بازدید -
9 ماه پیش
-
In this video, you will
In this video, you will learn how to create a small blog application using next.js 13.5 application with strapi v4 cms. I will show to you how to create multiple collections in strapi and add relationships between these collections. Learn how to integrate blogs and categories apis of strapi in next.js 13.5 but you can still write same code using nextjs 14 version.
00:05 Overview of Strapi v4
02:45 Learn More (Resource)
04:00 Create next js 13.5+ project
06:30 Design Layout with Tailwindcss
08:35 Create and design categories components
13:20 Create and design blogs components
19:30 Create and design blog detail page
26:25 Create Strapi Project and Overview
29:10 Create Blogs and Categories collections
32:50 Add Data in Strapi Dashboard for Blogs and Categories
36:35 Create Strapi Api Token
37:40 How to make strapi apis public
40:00 use strapi access token in next js 13
41:35 Integrate strapi api for categories in next js 13
48:10 Integrate strapi api for blogs in next js 13
57:10 Integrate strapi api for single blog post
01:05:10 Show blogs for selected category with Context api
01:18:40 Fix few console warnings
01:19:55 Outro
#nextjs13 #nextjs14 strapi #cms #blog
React tutorials:
React.js Tutorials
JavaScript Tutorials and Projects:
JavaScript Tutorial and Projects
Angular Tutorials:
Angular 16 Life Cycle Hooks - Explain...
Angular 16 Crash Course For Begineers:
Angular 16 Crash Course
Tech Tutorials - Random:
Postman Tutorial - Testing APIs and B...
Complete Next.js 14 Crash Course: Next.js 13 Tutorials - App Directory
Node Express MongoDB Bootcamp: Build REST API with Node Express MongoDB
ChatGPT Tutorials: ChatGPT
Join our facebook group:
Facebook: 996305460498149
Contact us for development services:
LinkedIn: umair-jameel-24aa5368
Source Code (Give it a Star ⭐️ )
https://github.com/umairjameel321/nex...
00:05 Overview of Strapi v4
02:45 Learn More (Resource)
04:00 Create next js 13.5+ project
06:30 Design Layout with Tailwindcss
08:35 Create and design categories components
13:20 Create and design blogs components
19:30 Create and design blog detail page
26:25 Create Strapi Project and Overview
29:10 Create Blogs and Categories collections
32:50 Add Data in Strapi Dashboard for Blogs and Categories
36:35 Create Strapi Api Token
37:40 How to make strapi apis public
40:00 use strapi access token in next js 13
41:35 Integrate strapi api for categories in next js 13
48:10 Integrate strapi api for blogs in next js 13
57:10 Integrate strapi api for single blog post
01:05:10 Show blogs for selected category with Context api
01:18:40 Fix few console warnings
01:19:55 Outro
#nextjs13 #nextjs14 strapi #cms #blog
React tutorials:
React.js Tutorials
JavaScript Tutorials and Projects:
JavaScript Tutorial and Projects
Angular Tutorials:
Angular 16 Life Cycle Hooks - Explain...
Angular 16 Crash Course For Begineers:
Angular 16 Crash Course
Tech Tutorials - Random:
Postman Tutorial - Testing APIs and B...
Complete Next.js 14 Crash Course: Next.js 13 Tutorials - App Directory
Node Express MongoDB Bootcamp: Build REST API with Node Express MongoDB
ChatGPT Tutorials: ChatGPT
Join our facebook group:
Facebook: 996305460498149
Contact us for development services:
LinkedIn: umair-jameel-24aa5368
Source Code (Give it a Star ⭐️ )
https://github.com/umairjameel321/nex...
9 ماه پیش
در تاریخ 1402/08/01 منتشر شده
است.
21,684
بـار بازدید شده