How do i work with this api in next js

[dusty kraken]

i m kinda new to this i want to impement this api https://yashraj-n.github.io/zoro-to-api/#typescript

import Zoro from 'zoro-to-api';
import { useEffect,useState } from "react";

export default function Page(){
    useEffect(async ()=>{
        let zoroResults = await Zoro.zoroSearch("Bleach");
        zoroResults = zoroResults.json;
    },[])
}

this is the way i trying to use it but its not working correctly please help

[fossil delta]

Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

[dusty kraken]

ping me on reply

[muted ruin]

if you're using server components, you can directly fetch the data without useEffects or anything.

https://nextjs.org/docs/app/building-your-application/data-fetching/fetching-caching-and-revalidating

[dusty kraken]

okk let me try

tho how do i fetch these apis

like they r not on the web

i had to import them

[muted ruin]

just do it like you're doing rn?

zoro.zoroSearch

[dusty kraken]

import Zoro from 'zoro-to-api';

export default function Page(){
    const res = await fetch(Zoro.zoroSearch("bleach"));
}

like this?

[muted ruin]

no, no need of fetch

just zoro

[dusty kraken]

okk

then make it json?

[muted ruin]

if that's what you want?

[dusty kraken]

yea

okk

let me try

it cant be converted to json

hmm

how do i use it then

no wait it says there is no property called json

the api docs say

[
    {
        id: string;
        poster: string;
        eng_title: string;
        jp_name: string;
        release_date: string;
        length: string;
    },
    ...
]
```  ill get this

[muted ruin]

you put the await infront of Zoro.zoroSearch right?

[dusty kraken]

yes

import Zoro from 'zoro-to-api';

export default async function Page(){
    let result = await Zoro.zoroSearch("bleach");
    result = result.json();
}

[muted ruin]

is json function or variable?

[dusty kraken]

function

[muted ruin]

in docs too?

[dusty kraken]

async function getData() {
  const res = await fetch('https://api.example.com/...')
  // The return value is *not* serialized
  // You can return Date, Map, Set, etc.
 
  if (!res.ok) {
    // This will activate the closest `error.js` Error Boundary
    throw new Error('Failed to fetch data')
  }
 
  return res.json()
}
 
export default async function Page() {
  const data = await getData()
 
  return <main></main>
}
``` in the docs u sent it works normally

[dusty kraken]

let me see

[dusty kraken]

wait do i even need to make it json

[muted ruin]

you don't ig?

it doesn't mention in docs

[dusty kraken]

yea thanks for the help

[muted ruin]

yeah, if it is solved, mark the message as solution so the thread can be closed

[fossil delta]

✅ Success!

This question has been marked as answered! If you have any other questions, feel free to create another post

Jump to answer

[Click here](#1222108950535868456 message)