I have built a Next.js MongoDB Tailwind TypeScript template Have a look and guide for using it.

Next.js + MongoDB + Tailwind + TypeScript template

Next.js + MongoDB + Tailwind + TypeScript template

Reason for making this template

Actually, I don't like to do configuration of my project, again and again, which leads me to go out and find a template and I got one, which was officially from MongoDB.

template from MongoDB

Why I am not using that?

The template which was configured for Next.js + MongoDB;
but not for TypeScript and Tailwind.

And then what I got and for making one for myself, at that moment i don't know to make a template;
but it is very easy to make one thanks Github.

How to use it ?.

npx create-next-app -e https://github.com/theabhayprajapati/Next.js-TailwindCSS-MongoDB-TS with-mongo-tail-app

Folder Structure

Pay attention to lib folder Lib

it includes MongoDB.ts

What does the MongoDB.ts do?

The Main function of this file is to get your MongoDB URL and make a function that can use anywhere where you need MongoDB access.

But in most cases you don't need to touch it; it has been configured for you.

Things you need to perform to make use of it.

go to env.local.example add your MongoDB_URI; which you can easily get from MongoDB.

1. After adding your MongoDB_URI, you need to run npm run dev to make sure that it works.

2. Change the name of file env.local.example to env.local

Congo , It works.

now you can easily work with MongoDB, in Next.js

Got any issues or suggestions ?
Connect me on:
Twitter: @Abhayprajapati_
Github: @theabhayprajapati
Linkedin: @abhayprajaapati
Youtube: @Abhayprajapati