Generate an NTMT App - NextJS, TypeScript, MongoDB, Tailwind CSS quickly using this boilerplate.

An easy to use boilerplate contains ready-to-go Next project, containing a MongoDB Driver, TypeScript and Tailwind CSS support. You can also add testing with cypress (jest included out of the box).

No useless premade code/components! Just start writing your app instantly ⚡

Please make sure you have Node installed on your machine.

npx create-ntmt-app my-app
cd my-app

Use this approach instead:

npm install -g create-ntmt-app
create-ntmt-app my-app
cd my-app

If you want cypress support for testing, add the "with-cypress" flag to the command, after the app name:

npx create-ntmt-app my-app with-cypress
cd my-app

The boilerplate contains testing capabilities, as shown, using cypress and jest to maximize Unit and Integration testing. I have included the start-server-and-test package to allow for cypress testing while running the dev server.

The boilerplate contains the tailwind-merge package to allow merging tailwind classes, which I found really useful.

The boilerplate contains a predefined MongoDB driver which exports a clientPromise that can be shared across the entire app in order to access the database. The driver can be found under lib/mongodb.ts.

next-auth support might be added in the near future to the boilerplate since I use it quite often.

This is the structure of the project you will be getting:

my-app
├── lib
│   ├── mongodb.ts
├── pages
│   ├── api
│   ├── _app.tsx
│   ├── index.tsx
├── public
│   ├── favicon.ico
│   ├── vercel.svg
├── styles
│   ├── globals.css
├── .env.local
├── .eslintrc.json
├── .gitignore
├── next-env.d.ts
├── next.config.js
├── package-lock.json
├── package.json
├── postcss.config.js
├── tailwind.config.js
├── tsconfig.json
├── yarn.lock

With cypress, you will also be getting:

├── cypress
│   ├── e2e
│   │   ├── app.cy.ts
│   ├── fixtures
│   │   ├── example.json
│   ├── support
│   │   ├── commands.ts
│   │   ├── e2e.ts
├── cypress.config.ts

You can start building your app as you would with create-next-app.

To get started with MongoDB, add your MongoDB url in MONGODB_URI environmental variable at .env.local:

MONGODB_URI=<your_mongodb_url>

Thanks for using this package, happy coding!