API using Node React Express MySQL Sequelize (For Backend or Server Side)

This Aritcle for Create API Using Node React Express MySQL Sequelize, Creating a Local Server, Server Side API for MySQL Connection

जब भी आपको React मे Database से Connect कर कोई भी Project बनाना हो तब आपको सबसे पहले एक API के लिए एक अलग Project बनाना होगा । जिसमे आप SQL Logic लिख उनको url से लिंक कर देंगे ताकि जब भी आप दूसरे Project से url या API Call करेंगे तो Result Json मे Display होने लगेगा । चलिए शुरू करते हैं ।

इस Article को लिखते समय मे यह मान रहा हु की आप Database के बारे मे जानकारी रखते हैं और आपको javascript के बारे मे जानकारी हैं , इसलिए मैंने इसमे Concept Clear किया हैं की किस तरह से हम API बना सकते हैं । यदि आप Begineers हैं और deep मे समझना चाहते हैं तो आपको इस Blog पर इससे संबंधित अन्य Article मिल जाएंगे ।

1. Make Project

1. Create MySQL Database
   1. Create Database (MyDB)
   2. Make Table (studentmst)
   3. Insert Data
2. Create API Project
   1. Make a Directory named ApiProject
   2. Open Directory Within Visual Code
   3. Open Terminal
   4. Make Package JSON using (npm inti -y)
   5. Install Dependency using (npm i express mysql2 sequelize cors)
   6. Understand Project Structure
   7. Database Connection using database.js
   8. Connect Table using Student.js
   9. Routing using Index.js
   10. Run Server

---

1. Create MySQL Database

MySQL सीखने के लिए क्लिक करे ।

1.1 Create Database

Wamp और Xampp का उपयोग कर आपको phpmyadmin से database बनाना होगा ।

Show Code

CREATE DATABASE MyDB;

1.2 Create Table

अब आपको नीचे दिए syntax से Table बनाना होगी

Show Code

CREATE TABLE IF NOT EXISTS `studentmst` (
  `id` int(9) NOT NULL AUTO_INCREMENT,
  `stud_nm` varchar(40) NOT NULL,
  `stud_class` varchar(20) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=1 DEFAULT CHARSET=latin1;

1.3 Insert Data into Table

Testing के लिए आप नीचे दिए गए Syntax से उपरोक्त Table मे Data Insert करेंगे ।

Show Code

Insert Data 
INSERT INTO `studentmst` (`id`, `stud_nm`, `stud_class`) VALUES
(1, 'Sandip Nigam', '12th'),
(2, 'Rishabh Sharma', '11th'),
(3, 'Rakesh Mali', '12th'),
(4, 'Vishal Garg', '12th');

---

2. Create API Project Using Node React Express MySQL Sequelize

अब आपको एक API project बनना हैं । जिसमे की हमने जो Database बनाया है उसके Data को Get कर API के माध्यम से Webpage पर Display करेंगे ।

2.1 Make a Directory named ApiProject

सबसे पहले आप ApiProject नेम से एक Folder बना ले ।

2.2 Open Directory Within Visual Code

Folder बनाने के बाद आप Folder open करे और उस Folder मे Right Click कर आप Visual Code मे Open करे ।

2.3 Open Terminal

After Open Visual Code, Click Terminal -> New Terminal

Terminal Menu पर Click कर आप New Terminal Option select करे ।

2.4 Make Package JSON using (npm inti -y)

Project Folder बनाने के बाद हमे Package। json file बनाना होती हैं , यदि आप npm inti -y Command लिखेंगे तब आपके Folder मे package.json file बन चुकी होगी ।

Show Code

npm init -y

फाइल बनने के बाद आपको कुछ इस तरह से दिखाई देगी । इसमे आपको “type”:”module”, add करना होगा, add करने के बाद package.json कुछ इस तरह से दिखाई देगी

Show Code

{
  "name": "apiproject",
  "version": "1.0.0",
  "description": "",
  "type": "module",  
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC", 
}

2.5 Install Dependency using (npm i express mysql2 sequelize cors)

अब project मे जो भी हमे dependency लगेगी उन्हे हम निम्न command से install कर लेंगे । यह पर हमने एक ही Command मे हमे जितनी भी Dependency का उपयोग हो रहा हैं सभी को लिखा हैं जिससे की यह एक एक कर Install हो जाएगी ।

Show Code

npm i mysql2 sequelize express cors

• mysql2 : यहा MySQL से Connection करने के लिए हमे mysql2 dependency का उपयोग करना होता हैं ।
• sequelize : इस dependecy से आपको बहुत ही कम coding API लिखा जाती हैं । केवल आपको Table और उसके Columns define करने होते हैं और अलग से कोई Select, Insert, Update, Delete नहीं लिखना होती हैं ।
• Express : इस dependecy का उपयोग करना से हम जो URL Based Page linking करते हैं उसको बहुत कम Code मे Manage करने का कार्य किया जाता है, Project Coding समझने मे भी आसान होती हैं ।
• Cors : Express का उपयोग करते समय हम Cors का उपयोग करते हैं जो की हमे URL और Express को Communicate करने मे Help करता हैं।

2.6 Understand Project Structure

इस Project का File Structure कुछ इस प्रकार होगा ।

• Common Folder : इस folder मे जो भी हमे common Files लगेगी उनको हम रखेंगे जैसे की database connection से संबंधित file हमने इस folder मे बनाई हैं ।
• MyPages Folder : अभी हमने example के लिए Student का data दिखाया हैं इसलिए student.js file इस folder मे बनाई हैं आपको database से जिन भी table का data दिखाना हैं आपको उनकी एक js file बनाना होगी ।

2.7 Database Connection using database.js

इस File से हम Database को Connect करेंगे ।

Show Code

common\database.js
import { Sequelize } from "sequelize";

const db = new Sequelize('MyDB', 'root', '', {
    host: "localhost",
    dialect: "mysql"
});

export default db;

2.8 Connect Table using Student.js

• Define Table : इस फाइल मे हम Student Table से Data Get कर रहे हैं इसलिए हमने Student object बना कर उसमे column define किए हैं जो की हमारी टेबल मे थे । ऐसा करने से हमे यह Benefit होगी की जब भी हमे इस Table Data Insert करना हो update करना हो या Data को delete करना हो तब अलग से कोई Code नहीं लिखना होगा , यह Student object Mange कर लेगा।
• Define Methods : साथ मे हमने इसमे Data को Get करना के लिए एक Method GetStudentData बनाई हैं जिससे की हम Data को json data मे प्राप्त कर लेंगे ।

Show Code

MyPages/Student.js
import { Sequelize } from "sequelize";
import db from "../common/database.js";
 
const { DataTypes } = Sequelize;
 
/* 1. Define Table */
export const Student = db.define('studentmst',{
    stud_nm:{ type: DataTypes.STRING },
    stud_class:{type: DataTypes.DOUBLE }
},{
    freezeTableName: true
});
 

/* 2. Define Methods */
export const GetStudentData = async (req, res) => {
    try {
        //For All Columns
        // Required createdAt, updatedAt Columns in Table when Show All Columns
        /*const MyData = await Student.findAll(); */


        //For Selected Columns
        const MyData = await Student.findAll({attributes: ['stud_nm', 'stud_class']});

        res.json(MyData);
    } catch (error) {
        res.json({ message: error.message });
    }  
}

आपके पास data को get करने के दो तरीके हैं

• For All Columns : इसमे आपको टेबल मे जीतने भी कॉलम होंगे सभी आ जाएंगे , जब हम Sequelize का उपयोग करते है हैं हमे दो column हर टेबल मे बनाने ही होते हैं । createdAt, updatedAt
• For Selected Columns : इस method मे आपको attributes मे column के नाम देने होते हैं वही कॉलम json मे दिखाई देंगे ।

2.9 Routing using Index.js

यह Page Entry Point होता हैं, इससे हम /student से हमने जो Method GetStudentData बनाई थी उसे Route करेंगे ।

Show Code

index.js
import express from "express";
import db from "./common/database.js";
import cors from "cors";
import { GetStudentData } from "./MyPages/Student.js";

const app = express();
 
try {
    await db.authenticate();
    console.log('Database Connected...');
} catch (error) {
    console.error('Database Connection Error:', error);
}
 
app.use(cors());
app.use(express.json());
app.use('/student', GetStudentData);



app.listen(5000, () => console.log('Server Port 5000'));

आप जीतने भी Database मे टेबल बनाएंगे उनकी एक js file MyPages Folder मे बनाएंगे और js file मे जो Method बनाएंगे उनको आप यंहा पर app.use का उपयोग कर route कर सकेंगे ।

2.10 Run Server

इसके बाद आपको Terminal पर node index type करना हैं।

Show Code

node index

उपरोक्त Command के बाद यदि project मे कोई भी एरर नहीं हुई तो आपको कुछ निम्न तरह का message दिखाई देने लगेगा , यदि यह message आ जाता हैं यानि की आपका server बन चुका हैं ।

अब आपको Browser पर data देखने के लिए निम्न URL Type करना होगी

Show Code

http://localhost:5000/student

जब आप Browser पर URL Type कर Enter करेंगे तो आपको कुछ इस प्रकार से Response आएगा

Show Code

Output JSON
[
{"stud_nm":"Sandip Nigam","stud_class":"12th"},
{"stud_nm":"Rishabh Sharma","stud_class":"11th"},
{"stud_nm":"Rakesh Mali","stud_class":"12th"},
{"stud_nm":"Vishal Garg","stud_class":"12th"}
]

अब इस Response को आप किसी अन्य Project मे Get कर सकते हैं । Next Article मे आपको मे उसका भी Example बना कर बताऊँगा ।

आपको यह Article Node React Express MySQL Sequelize कैसा लगा मुझे जरूर बताए । किसी भी प्रकार का Doubt हो तो आप Comment करे ।

अपना कीमती समय देने के लिए धन्यवाद ।

---

FAQ

हमारे अन्य आर्टिकल

• MySQL Function
• MySQL Stored Procedure
• PHP Get /Post Method के बारे में जाने
• PHP Math Function के बारे में जाने
• C से C ++ सीखे सरल शब्दों में
• PHP Variable के बारे में जाने
• Arduino Control Structure 
• Union in C
• Declaration of Pointer in C
• jQuery Search Filter
• MySQL Create Table | Alter Table | Drop Table
• API Using NODE REACT EXPRESS MYSQL SEQUELIZE (For Backend OR Server Side)
• CPANEL In Hindi