DEV Community

NafunaAfrica
NafunaAfrica

Posted on

Explain Sveltekit/Strapi API Like I'm Five

Hi all!

I'm new and nice to meet you all! I have the following isse:

So I have a web app built on Sveltekit. Here I intend to pull data from strapi for a blog as well as other information. I have made a route called news and a nested route called posts which is my API endpoint. Here in '/news/posts' I check with Postman and the demo data I have there flows in well:

Image description

The code that did that in the +server.ts files is:

export const GET = async ({ request }) => {

const res = await fetch('https://cms.nafuna.tv/api/blogs')
const info = await res.json()

return new Response(JSON.stringify(info), { status: 200})

}
Enter fullscreen mode Exit fullscreen mode

so now I wanted to get the data into the main +page.svelte file. I have made a +page.server.ts to load the data from the endpoint:

export async function load({ fetch }) { const res = await fetch('/news/posts') const info = await res.json() return { props: { blogs: info.data } }; }
Enter fullscreen mode Exit fullscreen mode

My main issue happens when I am trying to use that in the +page.svelte whose code looks like:

<script lang="ts">
import type { PageData } from './$types';

export let data;

</script> {#each blogs as post}
{post.Title}
{/each}
Enter fullscreen mode Exit fullscreen mode

the above won't display the posts coming from API. What am I missing? I'm pretty new to Sveltekit and have been learning Javascript for under 3 months so there maybe things that I know I missed. Here is a screenshot side by side so you can better see:

Image description

This is my first endpoint EVER. So I apologies for the Noob questions.

Top comments (0)