Node Js Import / Upload CSV File in MongoDB Database Tutorial

Node js import csv to MongoDB tutorial; In this tutorial, we will teach you how to import or upload records from CSV files to the MongoDB database in the Node js application using the Mongoose and express js.

CSV files are ideally used for importing and exporting significant data. It could be anything, for example, order data, invoices information, customer data etc.

CSV files are easy to create but do you know you can directly upload the csv files to the database for storing or maintaining the records.

To build the CSV file upload system in Node js requires us to use some additional modules such as multer, body-parser, ejs, express-generator and most importantly, csvtojson.

The csvtojson module is a thorough node js csv parser to convert csv to json or column arrays. It might be used as a node.js library/command-line tool / or in the browser.

How to Upload CSV File in MongoDB with Mongoose in Node Js

Step 1: Set Up Node App
Step 2: Add Essential Modules
Step 3: Create Mongoose Schema
Step 4: Create CSV File Upload Form
Step 5: Set Up Node Server
Step 6: Run Node Server

Set Up Node App

By running the given command create a new empty project directory.

mkdir node-csv

Move inside the project folder:

cd node-csv

Type the given command, then execute the provided command and let the package.json file generate.

npm init

Add Essential Modules

First, install the EJS package for generating the embedded JavaScript templates.

npx express --view=ejs

You have to type and run the provided command to install the mongoose, csvtojson, multer, body-parser, and nodemon modules.

npm install -g express-generator

npm install csvtojson multer mongoose body-parser nodemon

Create Mongoose Schema

Create the models/ directory; inside this folder, create an userModel.js file; then, copy the given code and insert it inside this file.

var mongoose  =  require('mongoose');  
   
var csvFileSchema = new mongoose.Schema({  
    FirstName:{  
        type:String  
    },  
    LastName:{  
        type:String  
    },  
    SSN:{  
        type:String  
    },  
    Demo1:{  
        type:Number  
    },  
    Demo2:{  
        type:Number  
    },  
    Demo3:{  
        type:Number  
    },  
    Demo4:{  
        type:Number  
    },  
    Final:{  
        type:Number  
    },  
    Grade:{  
        type:String  
    }  
});  
   
module.exports = mongoose.model('userModel', csvFileSchema);

Create CSV File Upload Form

Head over to views/ folder, you must be seeing the index.ejs file, in here you have to insert the suggested code into view file.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Node js Import CSV File to mongoDB Example</title>
    <link
      href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css"
      rel="stylesheet"
    />
  </head>
  <body>
    <form action="/" method="post" enctype="multipart/form-data">
      <input type="file" name="csv" class="form-control mb-3" />

      <div class="d-grid">
        <button type="submit" class="btn btn-danger">submit</button>
      </div>

      <%if(data){%>
      <div>
        <table class="table table-hover table-responsive">
          <thead>
            <tr class="bg-info">
              <th>#No</th>
              <th style="padding-right: 2em">LastName</th>
              <th style="padding-right: 2em">FirstName</th>
              <th style="padding-right: 3em; padding-left: 3em">SSN</th>
              <th>Demo1</th>
              <th>Demo2</th>
              <th>Demo3</th>
              <th>Demo4</th>
              <th>Final</th>
              <th>Grade</th>
            </tr>
          </thead>
          <tbody style="overflow-x: scroll; height: 355px">
            <%for(var i=0;i< data.length;i++){%>
            <tr class="text-center">
              <td><%= i+1%></td>
              <td style="padding-right: 1em"><%= data[i].LastName%></td>
              <td style="padding-left: 1em"><%= data[i].FirstName%></td>
              <td style="padding-right: 1em; padding-left: 1em">
                <%= data[i].SSN%>
              </td>
              <td style="padding-left: 1em"><%= data[i].Demo1%></td>
              <td style="padding-left: 1em"><%= data[i].Demo2%></td>
              <td style="padding-left: 1em"><%= data[i].Demo3%></td>
              <td style="padding-left: 1.2em"><%= data[i].Demo4%></td>
              <td style="padding-left: 1.2em"><%= data[i].Final%></td>
              <td style="padding-left: 1.2em"><%= data[i].Grade%></td>
            </tr>
            <%}%>
          </tbody>
        </table>
      </div>
      <%}%>
    </form>
  </body>
</html>

Configure Node Server

In this step we will demonstrate how to configure the node server by appending the provided code into the app.js file.

var express = require('express')

var mongoose = require('mongoose')
var path = require('path')
var multer = require('multer')

var bodyParser = require('body-parser')

var csvFileSchema = require('./models/userModel')
var csv = require('csvtojson')

var storage = multer.diskStorage({
  destination: (req, file, cb) => {
    cb(null, './public/uploads')
  },
  filename: (req, file, cb) => {
    cb(null, file.originalname)
  },
})

var uploads = multer({ storage: storage })

mongoose
  .connect('mongodb://localhost:27017/nodemondb', { useNewUrlParser: true })
  .then(() => console.log('Database connected'))
  .catch((err) => console.log(err))

app.set('view engine', 'ejs')
app.use(bodyParser.urlencoded({ extended: false }))
app.use(express.static(path.resolve(__dirname, 'public')))

app.get('/', (req, res) => {
  csvFileSchema.find((err, data) => {
    if (err) {
      console.log(err)
    } else {
      if (data != '') {
        res.render('index', { data: data })
      } else {
        res.render('index', { data: '' })
      }
    }
  })
})

var tempRes

app.post('/', uploads.single('csv'), (req, res) => {
  csv()
    .fromFile(req.file.path)
    .then((resObj) => {
      for (var x = 0; x < resObj; x++) {
        tempRes = parseFloat(resObj[x].Demo1)
        resObj[x].Demo1 = tempRes
        tempRes = parseFloat(resObj[x].Demo2)
        resObj[x].Demo2 = tempRes
        tempRes = parseFloat(resObj[x].Demo3)
        resObj[x].Demo3 = tempRes
        tempRes = parseFloat(resObj[x].Demo4)
        resObj[x].Demo4 = tempRes
        tempRes = parseFloat(resObj[x].Final)
        resObj[x].Final = tempRes
      }
      csvFileSchema.insertMany(resObj, (err, data) => {
        if (err) {
          console.log('Error occurred' + err)
        } else {
          res.redirect('/')
        }
      })
    })
})

var port = process.env.PORT || 4000
app.listen(port, () => console.log('App being served on port: ' + port))

Run Node Server

We will run the node server, since we have added the nodemon library therefore we won’t have to restart the server when we will make change to project files.

Without further ado, Let’s evoke the node application server.

nodemon

You may tryout the suggested url for seeing the application on the browser:

http://127.0.0.1:4000

Node Js Import / Upload CSV File in MongoDB Database Tutorial

Summary

In this detailed guide, we saw how to easily build node js csv file upload and import in MongoDB database functionality from absolute starting.

By now, you have understood how to get started from scratch in node js, and we covered small yet essential concepts in this tutorial.

How to Upload CSV File in MongoDB with Mongoose in Node Js

Set Up Node App

Add Essential Modules

Create Mongoose Schema

Create CSV File Upload Form

Configure Node Server

Run Node Server

Summary

Related Articles

How to Build Google Places Autocomplete Address in Node Js

Node Js MySQL jQuery Ajax Autocomplete Search Tutorial

Node Js Insert Record in MongoDB with Mongoose Tutorial