Create a Next.js App with Tailwind CSS
Next.js is a super efficient web development framework, built on React. It handles both client-side and server-side code, making it a great tool for most web apps.
In this video, we use the create-next-app package to create a new Next.js application, and use the with-tailwind argument to configure TailwindCSS.
Additionally, we remove the boilerplate markup, and run our application in development mode with npm run dev.
Instructor: [0:00] Let's create a Next.js project to display our lessons. We're going to use the create-next-app package. For our very minimal styling, we're going to use Tailwind.
[0:09] Now, we're already in our supabase-sas folder, so we can just tell it to use our current directory. When that's finished, we can run, npm run dev to start our project in development mode. If we navigate to localhost over port 3000, we should see our application running.
[0:23] We can remove this boilerplate code by going to /pages/index.js, and removing everything other than our outermost div. We can replace that with the, "Text Working," and get rid of this unused import. When we Save, we should see that "Text Working."