Search Trends

• Search trends with the help of Google Trends API
• Compare multiple (upto 5) trends
• Get line and bar graphs(charts) drawn with Chart.js

Technologies Used

• Chart.js
• google-trends-api
• express

API

• An NPM package called google-trends-api
• Package is runned over the server side

Syntax:

import googleTrends from "google-trends-api";

googleTrends.interestOverTime({
  keyword: "string",
});

Graphing

• Chart.js script called over CDN
• Script is runned over the client side

Syntax:

<canvas id="myChart" width="400" height="400"></canvas>
<script>
  var ctx = document.getElementById("myChart").getContext("2d");
  var myChart = new Chart(ctx, { configurations });
</script>

Using my API

• Link:- https://outdated-trends.outdatedguy.rocks/trends
• Request Body:- Object with property word whose value is array of string(s) [i.e array of words to be searched]
• Method:- POST
• Content-Type: application/json
• Function: Use async await for calling fetch

Example:

(async function getTrends() {
  const word = {
    word: ["some", "words"], // example
  };

  const arg = {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
    },
    body: JSON.stringify(word),
  };

  const res = await fetch("https://outdated-trends.outdatedguy.rocks/trends", arg);
  const data = await res.json();
  console.log(data);
})();