CSV Upload

Introduction

Creating a CSV File Reader Full Stack Web Application using MongoDB, ExpressJS, NodeJS, EJS, Express Partials-Layouts, GulpJS. User can upload, read, delele the csv files from the application.

🔗 Important Links

Checkout the Website Web Application

Checkout the Application Demo Video YouTube

Features

• Upload

The user can upload files in CSV format. Different CSV files with different column headers can be uploaded since the table headers should be dynamic.

• Display Specific CSV File

The user can view the details of the specific CSV file that he uploaded.

• Delete Specific CSV File

The user can delete a specific CSV file that he has uploaded.

• Sort Column Headers

The user can sort the selected column in the table in ASC/DESC order upon clicking the headings.

• Search

To filter out column headers and search in a specific column header, there is a search box and a filter drop-down. The results will be displayed in the form of rows of tables.

• Pagination

Users can navigate through the records using the Pagination which displays 100 records per page.

Getting Started With Project

• Fork the Project in your Repository.
• Clone the Forked Repository in your Local System.
• Install & Configure - NodeJS, MongoDB, Robo3T, POSTMAN.
• Create '.env' file & Set the Environment Variables in it, as per the 'ENV_FORMAT.json' file.
• Run 'npm install' in GitBash Terminal
• If you want to run the project in development mode locally then go to '.env' file & set, ENVIRONMENT=development DEPLOYMENT=local
• If you want to run the project in production mode then go to '.env' file & set, ENVIRONMENT=production DEPLOYMENT=local/other/Heroku/AWS
• For Development Mode: Run 'npm run dev_start' in GitBash Terminal
• For Production Mode: Run 'npm run prod_start' in GitBash Terminal

Tools Used

Library Used

• connect-flash

• connect-mongo

• cookie-parser

• cross-fetch

• crypto

• del

• dotenv

• ejs

• express

• express-ejs-layouts

• express-session

• gulp-cssnano

• gulp-imagemin

• gulp-rev

• gulp-sass

• gulp-uglify-es

• json2csv

• mongoose

• morgan

• multer

• node-sass-middleware

• nodemon

• noty

• passport

• passport-google-oauth

• passport-github

• passport-local

• rotating-file-stream

• Framework: ExpressJS, Bootstrap

• Database: MongoDB

• Version Control System: Git

• VCS Hosting: GitHub

• Programming / Scripting: Vanilla JavaScript

• Front-End: SCSS, EJS

• Runtime Environment: NodeJS

• Integrated Development Environment: VSCode

Screens

Home Page:

Upload CSV File:

CSV File Details:

Search In Table Headers:

Sorting in Desc/Asc Order: