CSV to SQL import

What is this app all about ?

This app allows users to import a .csv file and save it in MySQL. The .csv file needs to be in a specified format, something like this . Once the data is saved we can see and delete the table data on the front-end.

Whats there on back-end and front-end ?

Back-End :
- NodeJS
- ExpressJS
- MySQL
Front-End :
- ReactJS

Here is the SQL table structure :

Field	Type
id	int(11)
level_col	varchar(255)
cvss	varchar(255)
title	varchar(255)
vulnerability	varchar(255)
solution	varchar(255)
reference_col	varchar(255)

Where is it deployed ?

Client side app ( React app ) is deployed on Netlify Server side app ( Node app ) is deployed on Heroku MySQL database is deployed on Remote Mysql

How to run it locally ?

To run it locally we need to clone two git repositories, one for the server and other for the client ( front-end).

To clone the client repo :

git clone https://github.com/krishankantray/csv-to-sql-import-client.git

To clone the server repo :

git clone https://github.com/krishankantray/csv-to-sql-import-server.git

The above git setup is for online server auto deployment on Heroku and Netlify . We need to make some changes in it to run it locally.

First we setup the server locally :

Open the directory : csv-to-sql-import-server , in any vscode or any other editor.
If you have a local MySql db then do replace the details in the app>>config>>db.config.js

If you don't have a local MySql db then leave it as it is.

Now, open terminal ( in the directory : csv-to-sql-import-server ):

npm install npm start It should print in terminal : Server is running on port 9000.

( Make sure there is nothing previously running on port 9000, if there is then change the >port from line 25 of server.js )

To test if all APIs are working, open postman and use following APIs

GET call for obtaining all the records, url should be :http://localhost:9000/customers/.
GET call for single records by id, for eg : http://localhost:9000/customers/963
POST call for bulk create records : http://localhost:9000/bulkcreate This call needs a body to be passed
POST call for single create records http://localhost:9000/customers This call needs a body to be passed
DELETE call for all records deletion http://localhost:9000/customers
DELETE call for records deletion http://localhost:9000/customers/963
PUT call to update a single record http://localhost:9000/customers/963

Now, we will configure the local front-end ( React app ) :

We only need to make some changes in App.js within src directory. Just change the line 35 , 69 and 97, i.e we need to change the URL of all the fetch calls from Apps.js.

For Example :

35 : Before https://csv-to-sql-import.herokuapp.com/bulkcreate 35 : After http:localhost:9000/bulkcreate

Similarly for line 69 and 97 , just replace this part of URL - https://csv-to-sql-import.herokuapp.com with http:localhost:9000

and rest of the part of url remains same.