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
If you are using older versions of npm (5.2 or less), you cannot utilize npx. 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!
If you encounter any issues with the boilerplate, try updating your Node version, or submit an issue and make sure to include explanation and code examples.
create-ntmt-app is open source software under MIT License