How to Connect the Mongodb Database in React JS?

How to Create and Run the Server in React JS (1)

Install the database in the root folder not in the client folder

npm i mongoose

https://www.mongodb.com/atlas/database

sign up on this website, choose try free

You can do signup with your Google account as well

Create new project in mongodb atlas

Set Project Name and do next

After creating a project, click on “Database”, Build Database

Choose M0 Free > AWS > Region (Mumbai) > Clustor Name (reactjs-blog) > Create

Create username and password and save these details for future use.

Choose Cloud Environment

Add Ip Address “0.0.0.0” to allow access database from anywhere via any devices

Finish and Close

Connect > Drivers

Copy given string in number 3 point.

Add some code in “index.js”

import mongoose from ‘mongoose’

 

after that add copied sting –

mongoose.connect(‘mongodb+srv://………).then(()=>{

console.log(“MongoDb is connected”);

}).catch((err)=>{

Console.log(err);

})

 

add password in given string

add collection name after mongodb.net/reactjs-blog?

Database has been connected.

Create a file in the root directory “.env”

Install a package in root directory

npm i dotenv

add below given 2 line in index.js

import dotenv from ‘dotenv’

dotenv.config();

Cut string from the index.js paste it in .env file

MONGODB_URL=’string’

In index.js in the place of string mention –

.connect(process.env. MONGODB_URL).then(….)

Index.js:

import express from ‘express’
import mongoose from ‘mongoose’;
import dotenv from ‘dotenv’
dotenv.config();
mongoose.connect(process.env.MONGODB_URL).then(()=>{
    console.log(“MongoDb is connected”)
}).catch((err)=>{
    console.log(err)
})
const app=express();
app.listen(3000, ()=>{
    console.log(‘Server is running on 3000 PORT’);
})

.env:

MONGODB_URL=’mongodb+srv://krishandev0102:m8lsgggWy3sRnQET@reactjs-blog.ygx34eg.mongodb.net/reactjsblog?retryWrites=true&w=majority’
Video Tutorial: