Directus 9 + Next
In this course we will be using Directus 9 as our API and CMS, and of course Nextjs for the frontend of our site. Kind of like we did with Making Websites With Next.js And Strapi series.
This time however we will add Tailwind into the mix and also include React Query right from the start for better performing API requests, caching, state management and so on. Oh, and also instead of using REST API we are going to use GraphQL for this series.
Directus 9 + NextInstall Next, Directus, Tailwind, React Query, GraphQL And Fetch Data
In this first episode of Nextjs and Directus series we are going to set everything up and fetch some data to see if everything is working properly.
Directus 9 + NextUpdate Directus And Fix A Bug
In this episode we are quickly going to update Directus, and also fix a bug that I noticed.
Directus 9 + NextFix No Access Issue, Update Database, Install GraphQL Playground
In this episode we are going to do a bit more cleanup (sorry), before building our app.
Directus 9 + NextProducts and Categories
In this episode we are going to start building an e-commerce site using Directus and Next.
Directus 9 + NextFix M2M Relationship From Part 04
In this episode we are going to fix a mistake that I made in part 04 of this course.
Directus 9 + NextFilter Products By Category
In this episode I’m going to show you how to create a filter for our products using Directus and Next.js.
Directus 9 + NextProduct Display Page
In this episode we are going to create a product display page for our shop.
Directus 9 + NextProduct Options And Directus Has Some Problems
In this episode we are going to create options for products. In our case those are going to be colours and sizes.
Directus 9 + NextDisplay Product Options
In this episode we are going to display product options that we created in the previous episode.
Directus 9 + NextAdd To Cart
In this episode we are going to start implementing add to cart functionality. I say start because this is a pretty big functionality so I’m going to split it into two parts.
Directus 9 + NextMini Cart And Zustand
In this episode we are going to create a mini cart for our e-commerce site using Zustand state management library.
Directus 9 + NextUser Sign Up
In this episode we are going to implement signup functionality for our Directus and Next.js app. You will see, this is very easy.
Directus 9 + NextUser Authentication With NextAuth
In this episode we are going to implement login functionality to our Next.js and Directus app using NextAuth package.
Directus 9 + NextProtect Signup Form From Hackers
Viewer called Locness noticed a potential security flaw on our sign up form. In this episode we are going to fix that.