https://github.com/wpcodevo/nextjs13-mongodb-setup

Are you interested in using MongoDB with the new Next.js 13 app directory? If so, you're in luck! In this article, we'll explore how to set up and use MongoDB in the new Next.js 13 App Router.
https://github.com/wpcodevo/nextjs13-mongodb-setup

docker mongodb mongodb-atlas mongoose nextjs nextjs13 nextjs13-app-router reactjs typegoose

Last synced: about 2 months ago
JSON representation

Are you interested in using MongoDB with the new Next.js 13 app directory? If so, you're in luck! In this article, we'll explore how to set up and use MongoDB in the new Next.js 13 App Router.

• Host: GitHub
• URL: https://github.com/wpcodevo/nextjs13-mongodb-setup
• Owner: wpcodevo
• Created: 2023-07-17T07:29:14.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2023-07-18T09:07:17.000Z (over 1 year ago)
• Last Synced: 2024-05-15T15:32:45.065Z (8 months ago)
• Topics: docker, mongodb, mongodb-atlas, mongoose, nextjs, nextjs13, nextjs13-app-router, reactjs, typegoose
• Language: TypeScript
• Homepage: https://codevoweb.com/setup-and-use-mongodb-in-nextjs-13-app-directory/
• Size: 56.6 KB
• Stars: 10
• Watchers: 1
• Forks: 4
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# How to Setup and Use MongoDB in Next.js 13 App Directory

Are you interested in using MongoDB with the new Next.js 13 app directory? If so, you're in luck! In this article, we'll explore how to set up and use MongoDB in the new Next.js 13 App Router. To simplify the development process, we'll utilize Typegoose, a thin wrapper around the Mongoose library, to create the necessary database models and TypeScript types.

![How to Setup and Use MongoDB in Next.js 13 App Directory](https://codevoweb.com/wp-content/uploads/2023/07/How-to-Setup-and-Use-MongoDB-in-Next.js-13-App-Directory.webp)

## Topics Covered

- Running the Next.js Project on Your Machine

- Setting up the Next.js Project

- Creating a MongoDB Database

    - Option 1: MongoDB Server running in Docker

    - Option 2: Cloud MongoDB Database with Atlas

- Connecting to the MongoDB Database

- Creating the Database Model with Typegoose

    - Creating the Model

    - Configuring TypeScript

- Creating the Next.js Server Functions

- Using Server Actions in Next.js

    - Enabling Server Actions in Next.js

    - Creating the Server Actions in Next.js

    - Creating the Todo Form Component

    - Creating the Todo Item Component

    - Adding the Components to a Page File

- Creating the API using Next.js API Route Handlers

    - Creating GET and POST Route Handlers

    - Creating GET, PATCH, and DELETE Route Handlers

- Conclusion

Read the entire article here: [https://codevoweb.com/setup-and-use-mongodb-in-nextjs-13-app-directory/](https://codevoweb.com/setup-and-use-mongodb-in-nextjs-13-app-directory/)