I did my Javascript Project on an uptodate covid-19 cases around the world..

i got my info from an outside API, a website i found after a few google searches called https://rapidapi.com/.

I found an api with a 100% success rate and with a check mark that reads verified and went for it..

this is a “GET” request snippet from my frontend/index.js file of my Javascript project…

All the data that comes in is being call in the allCases() function which takes in the data (value) as an argument..

the allCases() is a static function located in the “frontend/search.js” file aka Search class..( ill explain the Search class later..)

calling static in front of a function is equivalent to calling self

in this case self being the class Search.

im calling the .reduce() method to sum up all the cases to display the sum of all the cases around the world..

← snippet from what the allCases() looks like on the website

sidenote: i also did my own css.. even tho i like materialize its not easy to override a lot of things.

search.js where every function (including some fetch calls) that belong to Search class is found…

constructor is where arguments are passed in for info regarding a Search..

this is equivalent to calling self…

if this is called in an static function:

if this is called inside a instance function:

the constructor args are also passed in the backend rails API “searches_controller.rb” file strong params..

the strong-params is then passed into the create method of the searches_controller.rb file

which is also defined and called Search class..

(i get into more detail about this late)

this is a snippet of my “POST” request to my backend Ruby rails API ↓↓↓↓

ps.. a fetch call can be called either in the search.js file (Search class) or the index.js file

you’re prob wondering why i didn’t call a function in front of the data (country) ill explain…

in order to get the info of the Users searches i did another API call to the outside API i found on rapid..

inside the API call i passed in the data (value) of the API request in-side the search() function.. & since the search function is located inside of the Search class i put Search in-front of it..

a snippet of the search() function located in the Search class ↓↓↓↓

as you can see im calling the fetch request inside of the search( ) function and since strongParams (which holds the value of the variable country ) is defined inside of the function where the fetch call is located there was no need to call a function….

.

.

so all searches that were made on the site are pushed to the rails API…

I did a couple of more fetch “GET” calls to the API i found online for more info.. and added two more functions allDeaths() && allRecovered() to post at the top of the page along side the allCases().

to get User information i did a couple of “GET” calls to the backend rails API .

*Recent searches* && *the most viewed country*

.

below is the event listener DOMContentLoaded which loads all the functions within it as soon as the DOM loads.

onCall() holds event listeners within its block… to listen to an( “event”, theFunction)

this is a list of all my global functions..

i also added a blink() function if you noticed in the event listener DOMContentLoaded

these functions are called on the allCases(), allRecovered(), && allDeaths() and do exactly as their name make the data blick

they’re all identical so ill only list one

thanks for reading :)