Directus 9 + Next
![Protect Signup Form From Hackers](https://imagedelivery.net/6tYZ9RoCmUmVIIrwK8LT-A/c4a31ab5-b103-4d5d-939d-3a54f7a745ea.jpg/w=768)
Protect 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.
![User Authentication With NextAuth](https://imagedelivery.net/6tYZ9RoCmUmVIIrwK8LT-A/ccee498c-88ff-4fa1-8bc1-a26710021a83.jpg/w=768)
User Authentication With NextAuth
In this episode we are going to implement login functionality to our Next.js and Directus app using NextAuth package.
![User Sign Up](https://imagedelivery.net/6tYZ9RoCmUmVIIrwK8LT-A/2952e6e7-09a9-4310-9ec3-ea4089b5e75a.jpg/w=768)
User 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.
![Mini Cart And Zustand](https://imagedelivery.net/6tYZ9RoCmUmVIIrwK8LT-A/127e07db-d81a-45f3-93c7-4b900f54bb95.jpg/w=768)
Mini Cart And Zustand
In this episode we are going to create a mini cart for our e-commerce site using Zustand state management library.
![Add To Cart](https://imagedelivery.net/6tYZ9RoCmUmVIIrwK8LT-A/bf746968-6773-48a7-9bb8-48036679c4f8.jpg/w=768)
Add 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.
![Display Product Options](https://imagedelivery.net/6tYZ9RoCmUmVIIrwK8LT-A/63c08f36-206e-47e4-8dc2-93036186181c.jpg/w=768)
Display Product Options
In this episode we are going to display product options that we created in the previous episode.
![Product Options And Directus Has Some Problems](https://imagedelivery.net/6tYZ9RoCmUmVIIrwK8LT-A/f165ffdf-202f-45ac-8d13-01412d11f090.jpg/w=768)
Product 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.
![Product Display Page](https://imagedelivery.net/6tYZ9RoCmUmVIIrwK8LT-A/d21173eb-28af-47ec-b491-f0b95d61ca22.jpg/w=768)
Product Display Page
In this episode we are going to create a product display page for our shop.
![Filter Products By Category](https://imagedelivery.net/6tYZ9RoCmUmVIIrwK8LT-A/1189bfcc-32ed-4311-8abd-cfc9ec19efb7.jpg/w=768)
Filter 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.
![Fix M2M Relationship From Part 04](https://imagedelivery.net/6tYZ9RoCmUmVIIrwK8LT-A/58e83ba6-eeb0-4135-b011-f7d3c4d60cff.jpg/w=768)
Fix M2M Relationship From Part 04
In this episode we are going to fix a mistake that I made in part 04 of this course.
![Products and Categories](https://imagedelivery.net/6tYZ9RoCmUmVIIrwK8LT-A/132ed75c-56f9-4605-abf1-959618968cb9.jpg/w=768)
Products and Categories
In this episode we are going to start building an e-commerce site using Directus and Next.
![Fix No Access Issue, Update Database, Install GraphQL Playground](https://imagedelivery.net/6tYZ9RoCmUmVIIrwK8LT-A/5826a5a1-5866-44f2-b4b1-7f04712c57d4.jpg/w=768)
Fix 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.