কম্পিউটার

Node এবং MongoDB ব্যবহার করে সাইনআপ ফর্ম


এই নিবন্ধে, আমরা কিছু পরামিতি সহ একটি সাধারণ ব্যবহারকারী সাইন-আপ ফর্ম তৈরি করব। SAVE এ ক্লিক করলে, সমস্ত ব্যবহারকারীর বিবরণ MongoDB ডাটাবেসে সংরক্ষিত হবে।

ইনস্টলেশন

সাইন-আপ ফর্ম তৈরি করার জন্য এগিয়ে যাওয়ার আগে, নিম্নলিখিত নির্ভরতাগুলি আপনার সিস্টেমে সফলভাবে ইনস্টল করা আবশ্যক৷

  • নিম্নলিখিত কমান্ড ব্যবহার করে এক্সপ্রেস চেক করুন এবং ইনস্টল করুন। এইচটিটিপি অনুরোধে সাড়া দিতে মিডলওয়্যার সেট করতে এক্সপ্রেস ব্যবহার করা হয়

npm install express --save
  • HTTP POST ডেটা পড়ার জন্য "বডি-পার্সার" নোড মডিউল সেটআপ করুন৷

npm install body-parser --save
  • "মঙ্গুজ" সেটআপ করুন, কারণ এটি নোডের MongoDB ড্রাইভারের উপরে থাকে।

npm install mongoose --save

উদাহরণ 1

  • নিম্নলিখিত ফাইলগুলি তৈরি করুন এবং নীচে দেওয়া প্রতিটি ফাইলের সাথে কোড-স্নিপেটটি কপি পেস্ট করুন −

    • app.js

    • সর্বজনীন (একটি নতুন ফোল্ডার তৈরি করুন এবং এই ফোল্ডারের ভিতরে নীচের ফাইলগুলি আটকান।)

      • index.html

      • success.html

      • style.css

  • এখন, অ্যাপ্লিকেশনটি চালানোর জন্য নিম্নলিখিত কমান্ডটি চালান৷

node app.js

কোড স্নিপেট

app.js

var express=require("express");
var bodyParser=require("body-parser");

const mongoose = require('mongoose');
mongoose.connect('mongodb://localhost:27017/tutorialsPoint');
var db=mongoose.connection;
db.on('error', console.log.bind(console, "connection error"));
db.once('open', function(callback){
   console.log("connection succeeded");
})
var app=express()

app.use(bodyParser.json());
app.use(express.static('public'));
app.use(bodyParser.urlencoded({
   extended: true
}));

app.post('/sign_up', function(req,res){
   var name = req.body.name;
   var email =req.body.email;
   var pass = req.body.password;
   var phone =req.body.phone;

   var data = {
      "name": name,
      "email":email,
      "password":pass,
      "phone":phone
   }
   db.collection('details').insertOne(data,function(err, collection){
   if (err) throw err;
      console.log("Record inserted Successfully");
   });
   return res.redirect('success.html');
})

app.get('/',function(req,res){
   res.set({
      'Access-control-Allow-Origin': '*'
   });
   return res.redirect('index.html');
}).listen(3000)

console.log("server listening at port 3000");

index.html

<!DOCTYPE html>
<html>
<head>
<title> Signup Form</title>
<link rel="stylesheet"
href=
"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
integrity=
"sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<br>
<br>
<br>
<div class="container" >
<div class="row">
</div>
<div class="main">
   <form action="/sign_up" method="post">
   <h1>Welcome to Tutorials Point - SignUp</h1>
   <input class="box" type="text" name="name" id="name" placeholder="Name" required /><br>
   <input class="box" type="email" name="email" id="email" placeholder="E-Mail " required /><br>
   <input class="box" type="password" name="password" id="password" placeholder="Password " required/><br>
   <input class="box" type="text" name="phone" id="phone" placeholder="Phone Number " required/><br>
   <br>
   <input type="submit" id="submitDetails" name="submitDetails" class="registerbtn" value="Submit" />   <br>
   </form>
</div>
<div class="">
</div>
</div>
</div>
</body>
</html>

success.html

<!DOCTYPE html>
<html>
<head>
<title> Signup Form</title>
<link rel="stylesheet"
href=
"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
integrity=
"sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<br>
<br>
<br>
<div class="container" >
   <div class="row">
   <div class="col-md-3">
</div>
<div class="col-md-6 main">
   <h1> Signup Successful</h1>
</div>
<div class="col-md-3">
</div>
</div>
</div>
</body>
</html>

style.css

.main{
   padding:20px;
   font-family: 'Helvetica', serif;
   box-shadow: 5px 5px 7px 5px #888888;
}
.main h1{
   font-size: 40px;
   text-align:center;
   font-family: 'Helvetica', serif;
}
input{
   font-family: 'Helvetica', serif;
   width: 100%;
   font-size: 20px;
   padding: 12px 20px;
   margin: 8px 0;
   border: none;
   border-bottom: 2px solid #4CAF50;
}
input[type=submit] {
   font-family: 'Helvetica', serif;
   width: 100%;
   background-color: #4CAF50;
   border: none;
   color: white;
   padding: 16px 32px;
   margin: 4px 2px;
   border-radius: 10px;
}
.registerbtn {
   background-color: #4CAF50;
   color: white;
   padding: 16px 20px;
   margin: 8px 0;
   border: none;
   cursor: pointer;
   width: 100%;
   opacity: 0.9;
}

আউটপুট

এখন, আপনার ওয়েব ব্রাউজারে এই লিঙ্কটি চেষ্টা করুন। আপনি একটি নিবন্ধন পৃষ্ঠা দেখতে পাবেন৷

https://127.0.0.1:3000/index.html বা https://localhost:3000/index.html

C:\Users\tutorialsPoint\> node app.js
server listening at port 3000
(node:73542) DeprecationWarning: current URL string parser is deprecated, and will be removed in a future version. To use the new parser, pass option { useNewUrlParser: true } to MongoClient.connect.
(node:73542) [MONGODB DRIVER] Warning: Current Server Discovery and Monitoring engine is deprecated, and will be removed in a future version. To use the new Server Discover and Monitoring engine, pass option { useUnifiedTopology: true } to the MongoClient constructor.
connection succeeded

সাইন আপ পৃষ্ঠা

Node এবং MongoDB ব্যবহার করে সাইনআপ ফর্ম

সফল পৃষ্ঠা

Node এবং MongoDB ব্যবহার করে সাইনআপ ফর্ম

মঙ্গোডিবিতে সফলভাবে রেকর্ড ঢোকানো হয়েছে

Node এবং MongoDB ব্যবহার করে সাইনআপ ফর্ম


  1. MongoDB-তে NumberLong(x) এবং NumberLong("x") এর মধ্যে পার্থক্য?

  2. MongoDB updateOne() এবং insertOne() ব্যবহার করে

  3. মঙ্গোডিবি এবং পাইথন

  4. MongoDB সমষ্টি এবং অভিক্ষেপ?