Framework examples

Keep the API key on the server everywhere below-the SDK is designed for Server Components, loaders, and API routes, not browser bundles.

Next.js (App Router)

Use in Server Components, Route Handlers, or generateStaticParams. Never import the SDK in client components.

app/blog/page.tsx
// app/blog/page.tsx - Server Component
import { NexoFlow } from "nexoflow-sdk"

const nf = new NexoFlow({
  apiKey: process.env.NEXOFLOW_API_KEY!,
  revalidate: 60,
})

export default async function BlogPage() {
  const { data } = await nf.posts.list({ limit: 12 })

  return (
    <main>
      {data.posts.map((post) => (
        <article key={post.slug}>
          {post.featuredImageUrl && (
            <img src={post.featuredImageUrl} alt={post.title} />
          )}
          <a href={`/blog/${post.slug}`}><h2>{post.title}</h2></a>
          <p>{post.excerpt}</p>
        </article>
      ))}
      {data.pagination.hasMore && (
        <a href={`/blog?page=${data.pagination.page + 1}`}>Next page</a>
      )}
    </main>
  )
}
app/blog/[slug]/page.tsx
// app/blog/[slug]/page.tsx - single post + SSG
import { NexoFlow, NexoFlowError } from "nexoflow-sdk"
import { notFound } from "next/navigation"

const nf = new NexoFlow({ apiKey: process.env.NEXOFLOW_API_KEY! })

export async function generateStaticParams() {
  return await nf.posts.slugs()
}

export default async function PostPage({ params }: { params: { slug: string } }) {
  try {
    const { data: post } = await nf.posts.get(params.slug, { styled: true })
    return (
      <article>
        <h1>{post.title}</h1>
        {post.contentStyles && (
          <style dangerouslySetInnerHTML={{ __html: post.contentStyles }} />
        )}
        <div dangerouslySetInnerHTML={{ __html: post.content }} />
      </article>
    )
  } catch (err) {
    if (err instanceof NexoFlowError && err.isNotFound) notFound()
    throw err
  }
}

Nuxt 3

server/api/posts.ts
// server/api/posts.ts
import { NexoFlow } from "nexoflow-sdk"

const nf = new NexoFlow({ apiKey: process.env.NEXOFLOW_API_KEY! })

export default defineEventHandler(async () => {
  const { data } = await nf.posts.list({ limit: 20 })
  return data
})
pages/blog.vue
<!-- pages/blog.vue -->
<script setup>
const { data: blogData } = await useFetch("/api/posts")
</script>

<template>
  <article v-for="post in blogData.posts" :key="post.slug">
    <NuxtLink :to="`/blog/${post.slug}`">
      <h2>{{ post.title }}</h2>
    </NuxtLink>
    <p>{{ post.excerpt }}</p>
  </article>
</template>

SvelteKit

src/routes/blog/+page.server.ts
// src/routes/blog/+page.server.ts
import { NexoFlow } from "nexoflow-sdk"
import { NEXOFLOW_API_KEY } from "$env/static/private"

const nf = new NexoFlow({ apiKey: NEXOFLOW_API_KEY })

export async function load() {
  const { data } = await nf.posts.list({ limit: 20 })
  return { posts: data.posts, pagination: data.pagination }
}

Astro

src/pages/blog.astro
---
// src/pages/blog.astro
import { NexoFlow } from "nexoflow-sdk"

const nf = new NexoFlow({ apiKey: import.meta.env.NEXOFLOW_API_KEY })
const { data } = await nf.posts.list({ limit: 20 })
---

<html>
<body>
  {data.posts.map((post) => (
    <article>
      <a href={`/blog/${post.slug}`}><h2>{post.title}</h2></a>
      <p>{post.excerpt}</p>
    </article>
  ))}
</body>
</html>

Remix

app/routes/blog.tsx
// app/routes/blog.tsx
import { json } from "@remix-run/node"
import { useLoaderData, Link } from "@remix-run/react"
import { NexoFlow } from "nexoflow-sdk"

const nf = new NexoFlow({ apiKey: process.env.NEXOFLOW_API_KEY! })

export async function loader() {
  const { data } = await nf.posts.list({ limit: 20 })
  return json(data)
}

export default function Blog() {
  const { posts } = useLoaderData<typeof loader>()
  return (
    <main>
      {posts.map((post) => (
        <article key={post.slug}>
          <Link to={`/blog/${post.slug}`}><h2>{post.title}</h2></Link>
          <p>{post.excerpt}</p>
        </article>
      ))}
    </main>
  )
}

Express / Fastify

server.ts
import express from "express"
import { NexoFlow } from "nexoflow-sdk"

const app = express()
const nf = new NexoFlow({ apiKey: process.env.NEXOFLOW_API_KEY! })

app.get("/api/posts", async (req, res) => {
  const { data } = await nf.posts.list({ limit: 20 })
  res.json(data)
})

app.listen(3000)

Edge runtimes (Cloudflare Workers, Vercel Edge)

The SDK uses globalThis.fetch and AbortSignal.timeout-both available natively on edge.

worker.ts
export default {
  async fetch(request: Request, env: Env) {
    const nf = new NexoFlow({ apiKey: env.NEXOFLOW_API_KEY })
    const { data } = await nf.posts.list({ limit: 5 })
    return Response.json(data)
  },
}

TypeScript

Responses are fully typed. Import shapes individually when you need them in your app code:

types.ts
import type {
  Post,
  PostListItem,
  Category,
  Author,
  Tag,
  Pagination,
  ApiResponse,
  RateLimitInfo,
} from "nexoflow-sdk"

Requirements

  • Node.js 18+ (native fetch and AbortSignal.timeout)
  • Works with Next.js, Nuxt, SvelteKit, Astro, Remix, Express, Fastify, Angular (server-side), Cloudflare Workers, Deno, and Bun