Oh Snap!

Please turnoff your ad blocking mode for viewing your site content

Hit enter after type your search item

Node.js Express Whatsapp Group Invite Link CRUD App Using MongoDB Full Project

/
/
/
185 Views

Welcome friends in this blog post we will be talking about how to make a simple whatsapp group invite links crud app using node.js express and mongodb from scratch. Below is a step by step youtube video given and also all the source code of application is also given below.

 

 

Screenshots

 

 

Requirements

 

npm i express,mongoose,nodemon,body-parser,method-override,ejs,valid-url

 

Express will be the server on which the app will run

mongoose will be the interface library on which it will connect to the mongodb database

body-parser middleware will be used to get the form values from the form which is submitted to the express server

method-override will be the middleware which is responsible for making the put request as a post request in express server

valid-url is the library which is used to validate any sort of url which is passed to it.

 

Source Code

 

const express = require("express");
const bodyParser = require("body-parser");
const validUrl = require("valid-url");
const model = require("./models/mongodb");
var methodOverride = require('method-override')
const data = model.find({});
const app = express();

app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());
app.use(methodOverride('X-HTTP-Method-Override'))
app.set("view engine", "ejs");

app.get("/", (req, res) => {
    data.exec(function (err, data) {
        if (err) throw err;
        res.render("pages/index", { records: data});
      });
});

app.get("/addgroup", (req, res) => {
  res.render("pages/addOrEdit", {title:"Add Whatsapp Group",record:{}, validLink: true, validWhatsapp: true });
});

app.post("/", (req, res) => {

    if (req.body._id == '')
        addGroup(req, res);
        else
        updateGroup(req, res);

  //console.log(link.length)
});

function addGroup(req,res){
    var name = req.body.name;
  var link = req.body.link;

  if (validUrl.isHttpsUri(link)) {
    console.log("valid link");

    if (validLength(link)) {
      if (validPattern(link)) {
        var details = new model({
          name: name,
          link: link,
        });

        details.save(function (err, doc) {
          if (err) throw err;
          console.log("Data Saved");
          data.exec(function (err, data) {
            if (err) throw err;
            res.render("pages/index", { records: data});
          });
        });
      } else {
        res.render("pages/addOrEdit", {record:{},title:"Add Whatsapp Group", validLink: true, validWhatsapp: false });
      }
    } else {
      res.render("pages/addOrEdit", {record:{},title:"Add Whatsapp Group", validLink: true, validWhatsapp: false });
    }
  } else {
    res.render("pages/addOrEdit", {record:{},title:"Add Whatsapp Group",validLink: false, validWhatsapp: true });
  }
}

function updateGroup(req,res){

    var name = req.body.name;
  var link = req.body.link;

  if (validUrl.isHttpsUri(link)) {
    console.log("valid link");

    if (validLength(link)) {
      if (validPattern(link)) {
        var details = new model({
          name: name,
          link: link,
        });

        model.findOneAndUpdate({ _id: req.body._id }, req.body, { new: true }, (err, doc) => {
        if (!err) { res.redirect('/'); }
    });

        
      } else {
        res.render("pages/addOrEdit", {record:data,title:"Update Whatsapp Group", validLink: true, validWhatsapp: false });
      }
    } else {
      res.render("pages/addOrEdit", {record:data,title:"Update Whatsapp Group", validLink: true, validWhatsapp: false });
    }
  } else {
    res.render("pages/addOrEdit", {record:data,title:"Update Whatsapp Group", validLink: false, validWhatsapp: true });
  }
}



app.get('/:id',(req,res) => {
    var id = req.params.id
    model.findById(id,(err,data) => {
        console.log(data)
        if (err) throw err;
        res.render("pages/addOrEdit",{title:"Update Whatsapp Group", record: data, validLink: true, validWhatsapp: true });
    })
    
    
})

app.get('/delete/:id', (req, res) => {
    model.findByIdAndRemove(req.params.id, (err, doc) => {
        if (!err) {
            res.redirect('/');
        }
        else { console.log('Error in employee delete :' + err); }
    });
});

function validLength(url) {
  var length = 0;
  for (var i = 0; i < url.length; i++) {
    length = length + 1;
  }

  console.log(length);

  if (length === 55) {
    return true;
  } else {
    return false;
  }
}


function validPattern(url) {
  var pattern = "https://chat.whatsapp.com/invite/";

  var targetPattern = [];

  for (var i = 0; i < 33; i++) {
    targetPattern.push(url[i]);
  }

  console.log(targetPattern);

  // compare

  var flag = true;

  for (var i = 0; i < pattern.length; i++) {
    if (targetPattern[i] == pattern[i]) {
      flag = true;
    } else {
      flag = false;
      break;
    }
  }

  if (flag) {
    return true;
  } else {
    return false;
  }
}

app.listen(5000, () => {
  console.log("App is listening on Port 5000");
});

 

READ  Javascript DropZoneJS File Uploading Library Drag Drop ProgressBar with PHP Full Example

 

const mongoose = require('mongoose')

mongoose.connect('mongodb://localhost:27017/whatsappgroup',{useNewUrlParser:true,useUnifiedTopology:true})

var db = mongoose.connection;
db.on('error', console.error.bind(console, 'connection error:'));
db.once('open', function callback () {
  console.log("h");
});

var uploadSchema = new mongoose.Schema({
    name:String,
    link:String
})

var uploadModel = mongoose.model('group',uploadSchema)

module.exports = uploadModel

 

 

<!DOCTYPE html>
<html>
  <head>
    <title>Whatsapp Groups Join</title>
    <link
      rel="stylesheet"
      href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
    />
    <link
      rel="stylesheet"
      href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
    />
  </head>
  <body>
    <div class="container">
      <br />
      <h1 class="text-center">Whatsapp Groups Join</h1>
      <br />
      <a href="/addgroup" class="btn btn-block btn-danger">
        Add New Group
      </a>
      <br />
      <% if (records.length > 0){%>
      <table class="table table-striped">
        <thead>
          <tr>
            <th>Name</th>
            <th>Link</th>
            <th>Update</th>
            <th>Delete</th>
          </tr>
        </thead>
        <tbody>
          <% for (let record of records){ %>
          <tr>
            <td>
              <%= record.name %>
            </td>
            <td>
              <a
                class="well well-lg text-center"
                target="_blank"
                href="<%= record.link %>"
                ><%= record.link %></a
              >
            </td>
            <td>
              <a href="/<%=record._id%>">
                <i class="fa fa-edit" aria-hidden="true"></i>
              </a>
            </td>
            <td>
              <a href="/delete/<%=record._id%>">
              <i class="fa fa-trash" aria-hidden="true"></i>
              </a>
            </td>
          </tr>

          <% } %> <%}%>
        </tbody>
      </table>
      

      
    </div>
  </body>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</html>

 

<!DOCTYPE html>
<html>
  <head>
    <title>Whatsapp Groups Join</title>
    <link
      rel="stylesheet"
      href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
    />
  </head>
  <body>
      <div class="container">
          <br>
          <h1 class="text-center"><%= title %></h1>
          <br>
          <a href="/" class="btn btn-block btn-danger">
              Back to Home
          </a>
          <br>
          <% if (!validLink) { %>

            <div class="alert alert-danger alert-dismissible">
                <a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>
                <strong>Error !</strong> Please Enter a Valid URL.
            </div>
            
           <%}%>

           <% if (!validWhatsapp) { %>

            <div class="alert alert-danger alert-dismissible">
                <a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>
                <strong>Error !</strong> Please Enter a Valid Whatsapp Group Link.
            </div>
            
           <%}%>
          <form action="/" method="POST">
            <input type="hidden" name="_id" value="<%=record._id%>">
            <div class="form-group">
                <input type="text" value="<%=record.name%>" name="name" class="form-control" id="" placeholder="Name of Group" required>
            </div>
            <div class="form-group">
                <input type="text" value="<%=record.link%>" name="link" class="form-control" id="" placeholder="Link of Group" required>
            </div>
            <div class="form-group">
                <button class="btn btn-block btn-primary">
                    <%= title %>
                </button>
            </div>
        </form>
      </div>
</body>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
</html>

 

READ  Add Instagram Photos To Your Website Without API - jQuery instagramFeed

DOWNLOAD SOURCE CODE

 

Leave a Comment

Your email address will not be published. Required fields are marked *

This div height required for enabling the sticky sidebar
Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views :