Making Websites With Next.js And Strapi

In this series we are going to learn how to create a websites using Next.js. The main focus of the series will definitely be Next.js, but we will do some work with Strapi too, which we will use as our API and CMS

Link to video
Setup And First Steps cover

Making Websites With Next.js And StrapiSetup And First Steps

In this first episode of "Making Websites With Next.js and Strapi" series we are going to setup Next.js and I'm going to show you what to immediately after install to make your life easier.

Episode  1  / Duration 18:49  / 
Link to video
CSS in JS cover

Making Websites With Next.js And StrapiCSS in JS

In this video we are going to be talking about CSS in JS, which is a different kind of approach of styling your applications and websites.

Episode  2  / Duration 24:03  / 
Link to video
Fetching The Data cover

Making Websites With Next.js And StrapiFetching The Data

In this episode we are going to learn about getServerSideProps() async function in which we are going to fetch our data, and Server Side Render it.

Episode  3  / Duration 15:25  / 
Link to video
Layouts With Reflexbox cover

Making Websites With Next.js And StrapiLayouts With Reflexbox

In this episode we are going to learn how to layout your React components using Reflexbox.

Episode  4  / Duration 18:33  / 
Link to video
Static Routes, Nested Routes,  And Navigation cover

Making Websites With Next.js And StrapiStatic Routes, Nested Routes, And Navigation

In this episode we are going to talk about Next.js Routing, Nested Routes, Link component and we are also going to create a dynamic Navigation for our Next site.

Episode  5  / Duration 19:34  / 
Link to video
Dynamic routes cover

Making Websites With Next.js And StrapiDynamic routes

In this episode I'm going to show you how to create simple and then more advanced dynamic routes for your Next.js and Strapi application.

Episode  6  / Duration 19:50  / 
Link to video
Pagination cover

Making Websites With Next.js And StrapiPagination

In this episode we are going to learn how to create a pagination for our Nextjs and Strapi website.

Episode  7  / Duration 21:19  / 
Link to video
Next SEO cover

Making Websites With Next.js And StrapiNext SEO

In this episode you are going to learn how to implement SEO on your Next.js website.

Episode  8  / Duration 08:59  / 
Link to video
Using Context API cover

Making Websites With Next.js And StrapiUsing Context API

In this episode we are going to use React Context API to get the data for our navigation and also to create a simple state management.

Episode  9  / Duration 12:28  / 
Link to video
Deploy To Digital Ocean cover

Making Websites With Next.js And StrapiDeploy To Digital Ocean

In this episode we are going to deploy our Next.js App and Strapi API to Digital Ocean.

Episode  10  / Duration 27:34  / 
Link to video
getStaticProps cover

Making Websites With Next.js And StrapigetStaticProps

In this episode I'm going to show you the difference between getServerSideProps and getStaticProps in Next.js

Episode  11  / Duration 09:53  / 
Link to video
Incremental Static Regeneration cover

Making Websites With Next.js And StrapiIncremental Static Regeneration

In this episode we are going to talk about new feature in Next.js 9.5 called Incremental Static Regeneration.

Episode  12  / Duration 07:10  / 
Link to video
Multi language cover

Making Websites With Next.js And StrapiMulti language

In this episode we are going to make our Next.js and Strapi site be multilingual.

Episode  13  / Duration 34:08  / 
Link to video
User Authentication cover

Making Websites With Next.js And StrapiUser Authentication

In this episode we are going to create user authentication for our Next.js and Strapi website using JSON Web Tokens or JWT.

Episode  14  / Duration 27:08  / 
Link to video
Add Data To Strapi From Next.js cover

Making Websites With Next.js And StrapiAdd Data To Strapi From Next.js

In this episode we are going to add some new movies to our site but using the frontend form instead of Strapi administration.

Episode  15  / Duration 13:57  / 
Link to video
Image Component And Customizing Strapi Response cover

Making Websites With Next.js And StrapiImage Component And Customizing Strapi Response

In this episode we are going to take quick a look at new Image component in Next.js 10 and learn how to add additional data to our Strapi response.

Episode  16  / Duration 29:04  / 
Link to video
PropTypes cover

Making Websites With Next.js And StrapiPropTypes

In this episode we are going to learn how to use PropTypes inside our Next.js and Strapi application.

Episode  17  / Duration 14:04  / 
Link to video
Filters With React Query cover

Making Websites With Next.js And StrapiFilters With React Query

In this episode we are going to filter the data in our Strapi and Next.js app with React Query.

Episode  18  / Duration 40:40  / 
Link to video
User registration cover

Making Websites With Next.js And StrapiUser registration

In this episode we are going to register users from our Next.js frontend to our Strapi backend.

Episode  19  / Duration   / 
Link to video
Generate Content With Faker cover

Making Websites With Next.js And StrapiGenerate Content With Faker

In this video we are going to generate large amounts of content in seconds using Faker plugin for our Next.js and Strapi app.

Episode  20  / Duration 11:32  / 
Link to video
Infinite Scroll cover

Making Websites With Next.js And StrapiInfinite Scroll

In this tutorial I'm going to show you how to quickly build Infinite Scroll in your Strapi and Next.js application.

Episode  21  / Duration 16:47  / 
Link to video
Internationalization (i18n) cover

Making Websites With Next.js And StrapiInternationalization (i18n)

In this episode we are going to take look at new internationalization features of both Strapi and Next.js.

Episode  22  / Duration 19:07  / 
© Watch And Learn,2023