What’s up, everyone? In this article, we are going to create a headless e-commerce application using an open-source alternative to Shopify: Medusa.

If you haven’t been living under a rock you have probably heard of Web 3.0!

Hey, everyone! This is going to be a tutorial plus a challenge. I also have a giveaway at the end so stay tuned ;) Demo You can try it out yourself here- quiz-challenge.vercel.app Setting up Creating a Next.js app with Tailwind CSS I am going to use Tailwind for the basic stylings needed in the app npx create-next-app next-stripe-demo…

Creating a new react app npx create-react-app Starting the app - # npm npm start # yarn yarn start Installing the required dependencies - # npm npm install emoji-mart # yarn yarn add emoji-mart Cleanup process Delete everything inside the div in App.js and remove the import of logo.svg on top. Delete logo.svg file. Delete everything in App.css. In index.css add this line of code -

How to Authenticate Users with Auth0 in Next — What is Auth0? Auth0 is an easy-to-implement, adaptable authentication and authorization platform. If you want to follow along with this tutorial, you can create a free Auth0 account here. Setup I am going to set up a new next app with create-next-app. npx create-next-app next-auth0-demo Cleanup I will delete everything after the Head starting from…

How to create a custom sign-in page with NextAuth.js — Today, we are going to see how to build a custom login page with NextAuth.js. In one of my previous articles, we saw what is NextAuth and how to build Google authentication with it. If you haven’t read it already, you can check it out here. Let’s get started In […nextauth].js, we will…

This is a very important thing, especially when creating dropdowns. The user expects the dropdown to close when they click outside the dropdown. So we are going to see how can we do that. Creating a new react app Prerequisites for creating a react app- Node.js (Latest version recommended) After Node is installed you need…

Google authentication with Next.js Why should you choose Next auth? You might be wondering, if you are already using something like firebase then why should you use Next auth? Here’s why Easy to use Gives us a lot of providers for authentication You can get the details as soon as the user reaches the page with…

How to Create Page Transitions in Next.js with Framer motion — So today we will see how can we have animation between pages in Next.js You can simply clone the next tailwind starter template and follow the steps in the readme. I am going to use tailwind CSS for basic styling. Feel free to use anything. We will install framer motion…