In this tutorial we have create simple CRUD application using React js + Express js + Mysql.
For that we have create client(For forntend in react js) and server(For create new api serve in express js) folder.
Our frontend server is running in 3000 port and we have create new server using express js that was running in 3001.
Frontend - http://localhost:3000/
Backend - http://localhost:3001/
How to create API Server.
Run npm init command in server folder to create package.json file.
npm init
Now we have install required npm package for api server so run below command in vscode terminal.
npm install express body-parser cors mysql nodemonWe need to create index.js and import all required packages.
const express = require('express');
const mysql = require('mysql');
const cros = require('cors');
const bodyparser = require('body-parser');
const app = express();
We have to configure port number, for that we have insert below code in index.js fileapp.get('/', (req, res) => {
res.send('Hello World!')
})app.listen('3001',()=>{
console.log('server work on port 3001');
})
Now to check our server url working or not for that we need to run node index.js command in terminal and after that open url(http://localhost:3001/) and if you see "Hello World!" that's means our server url is working perfectly.Now if you change anything in code and want to see result for that we need to start server every time. For that we have already install nodemon paackage.
Nodemon is a utility that will monitor for any changes in your source and automatically restart your server.
For automatically start server we have add some script in package.json file.
"scripts": {
"start": "node index.js",
"devStart": "nodemon index.js",
"test": "echo \"Error: no test specified\" && exit 1"
},
Now we need to connect mysql database with server for that add we have already install mysql package in it. const db = mysql.createPool({
host:"localhost",
user:"root",
password:'',
database:'node_db'
})
app.get('/user',(req,res)=>{
const sqlSelect = "SELECT * FROM USER";
db.query(sqlSelect,(err,result)=>{
res.send(result);
});
const express = require('express');
const app = express();
const mysql = require('mysql');
const cros = require('cors');
const bodyparser = require('body-parser');
const db = mysql.createPool({
host:"localhost",
user:"root",
password:'',
database:'node_db'
})
app.use(cros());
app.use(express.json())
app.use(bodyparser.urlencoded({extended:true}))
app.listen('3001',()=>{
console.log('server work on port 3001');
})
app.post('/adduser',(req,res)=>{
console.log(req);
const Name = req.body.name;
const Username = req.body.username;
const Password = req.body.password;
const sqlInsert = "Insert into user(name,username,password) VALUES(?,?,?)";
db.query(sqlInsert,[Name,Username,Password],(err,result)=>{
console.log(err);
})
})
app.delete('/userdelete/:id',(req,res)=>{
const id = req.params.id
console.log(id);
const sqlDelete = `DELETE FROM user WHERE id = ${req.params.id}`;
db.query(sqlDelete,(err,result)=>{
console.log(result);
})
})
app.get('/user',(req,res)=>{
const sqlSelect = "SELECT * FROM USER";
db.query(sqlSelect,(err,result)=>{
res.send(result);
});
});
0 Comments
Post a Comment