Question with fetch api

JavaScript
1

So i finished the pokemon search app and I want to do something similar with getting the name of anime but I been looking up anime api but they seem need react , maybe I’m wrong. But is there recommendations on where I could use fetch with a anime api

2

an api doesn’t need any specific framework to be used

what apis have you found that seem to need react?

3

its not that it just that evrytime i find a tutorial its biuld in react
like this is my code

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>brewingtempest</title>
    <link rel="stylesheet" href="style.css" />
</head>
<body>
    <h1>Search for anime facts</h1>
    <input  id="search-input" required>
    <button id="search-button" >Search</button>
    <img src="https://qph.cf2.quoracdn.net/main-qimg-9af32801c01db35d3d05fd4babe61f67-lq"  id="img"/>
    <script src="script.js" type="module"></script>
</body>
</html>

const axios = require('axios');
//const input = document.getElementById("search-input");
const search = document.getElementById("search-button");
const img = document.getElementById('img');
const url = "https://waifu.it/api/v4/angry"; 
/*
Replace "Your-API-Token" with the token you got from the Kohai Bot and the endpoint.
*/

const data = async () => {
    try {
        const { data } = await axios.get(url, { headers: {
            Authorization: "Mzk3MTU0OTMyOTU4MTY3MDUx.MTcxNjM5ODA4OQ--.c395354176",
        } });
        return data;
    } catch (err) {
        throw new Error(err.message);
    }
};
 search.addEventListener('click', () =>{
  img.src=`${data()}`});
 
console.log(data);

like when i try importing axios i cant even when i use npm and type module then i tried use using a link that wouldnt work and now require and cant test in console bc document is not defined

4

go simpler, instead of axios, use the fetch api

this is something you can do on server side javascript (NodeJS), you are still only learning front-end, use fetch

5

That’s what I was thinking first but when I went to go to the api in GitHub it said use axios and I don’t know how to use fetch bc it’s asking for an authorization which I already but don’t know how to implement

6

Also I already have node js downloaded will that affect fetch

7

No, it doesn’t affect fetch, even the latest version of NodeJS has a fetch API of its own.

You can send an authiruzation token also with fetch, take a look at the documentation

8

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.