Build Youtube Channel Info App in Node.js and Express Using Youtube Data API V3 Library Project

Build Youtube Channel Info App in Node.js and Express Using Youtube Data API  V3 Library Project




Welcome folks today in this blog post we will be building a youtube channel info app in node.js and express with the help of youtube-channel-info library in Youtube Data API V3. All the source code of the application will be shown below.



Live Demo




You can see the live demo of app here




Get Started



In order to get started you need to install this you need to initialize the node.js project by invoking this command


npm init -y


then install these dependencies


npm i express


npm i ejs


npm i nodemon


npm i youtube-channel-info


After installing all these dependencies now create a index.js file inside the root directory of the application and initialize a express application which listens on port 5000






const channelinfo = require('youtube-channel-info')

const bodyparser = require('body-parser')

const app = express()



app.set("view engine","ejs")

app.get('/',(req,res) =>{

app.listen(5000,() =>{
    console.log(`App is listening on port 5000`)




Now we want to load the ejs template as we defined in the get route of the express application. So now make a views folder inside the root directory and inside it make a index.ejs file and copy paste the following code to it.

See also  jQuery HTML5 File Upload with Progressbar Animation in Browser Using Javascript Full Project For Beginners

For this application we will also be using some ajax  to do the dynamic stuff for pulling the data from the node.js library and displaying it inside the html.





<!DOCTYPE html>
    <title>Currency Converter in Javascript</title>
      <div class="container">
          <h1 class="text-center">Youtube Channel Info App</h1>
          <form id="form">
              <div class="form-group">
                  <label for="channelidname">Youtube Channel Name or ID</label>
                  <input type="text" required placeholder="Enter Channel Name or ID" id="channelnameid" class="form-control">
              <div class="form-group">
                  <button id="button" class="btn btn-danger btn-block">
                      Get Channel Info
        <div id="result"></div>
  <script src=""></script>
      var result


          $("#button").text("Please Wait Fetching Channel Info")


          var name = $("#channelnameid").val()
          name = name.trim()

          name = name.split(" ").join("");


                $("#button").text("Get Channel Info")



                result = `
                <table class="table table-striped">
        <th>Channel Name</th>
        <th>Channel Image</th>
        <th>Channel URL</th>
        <th>Video Uploads</th>
        <th>Estimated Monthly Earnings</th>
        <th>Estimated Yearly Earnings</th>
        <td><img class="img-rounded" src="${data.stats.channel_image}"/></td>
        <td><a target="_blank" class="btn btn-danger" href="${data.stats.channel_link}">Go to Channel</a></td>




See also  JavaScript Program to Pass a Function as a Parameter or Argument in Browser Full Project For Beginners



So now inside the index.js file we now have to make the post request to handle the input data provided by the user


index.js"/getchannelinfo",(req,res) => {
    var name = req.body.channelname

    channelinfo(name, function (channelStats) {
        if (!channelStats) {
          return console.error("Channel not found!")













Leave a Reply