Type-Safe Fetch with Next.js, Strapi, and OpenAPI

1. qs

   1 2 8,728 7.8 JavaScript

   A querystring parser with nesting support

   

   That would mean a bit of string concatenation. Luckily, Strapi suggest a library called qs to make this a bit more streamlined:

2. SurveyJS

   surveyjs.io featured

   JavaScript Form Builder with No-Code UI & Built-In JSON Schema Editor. Add the SurveyJS white-label form builder to your JavaScript app (React/Angular/Vue3). Build complex JSON forms without coding. Fully customizable, works with any backend, perfect for data-heavy apps. Learn more.

   

3. TypeScript

   2 1,424 104,429 9.7 TypeScript

   TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

   

   TypeScript helps you in many ways in the context of a JavaScript app. It makes it easier to consume interfaces of any type.

4. Strapi

   3 503 66,628 9.9 TypeScript

   🚀 Strapi is the leading open-source headless CMS. It’s 100% JavaScript/TypeScript, fully customizable, and developer-first.

   

   const pages = await client.GET("/pages", { params: { query: { filters: { // @ts-ignore - openapi generated from strapi results in Record // https://github.com/strapi/strapi/issues/19644 path: { $eq: path, }, }, // @ts-ignore populate: { blocks: { populate: "*" }, }, }, }, });

5. React

   4 1,934 235,442 9.9 JavaScript

   The library for web and native user interfaces.

   

   What you have seen now works great especially when you are fetching data on the server, like in React Server Components using Next.js. But data fetching on the client side is often a bit more involved. At least what you want is for example some data loading indication and to know when the data is actually available in the client.

6. strapi-next-rsc-openapi-fetch

   5 1 2 3.6 TypeScript

   YouTube, 20240301, using typed fetch with strapi and nextjs

   

   The source code is available on GitHub.

7. OpenAI-DotNet

   6 113 742 7.0 C#

   A Non-Official OpenAI RESTful API Client for DotNet (by RageAgainstThePixel)

   

8. Next.js

   7 2,332 131,829 10.0 JavaScript

   The React Framework

   

   What you have seen now works great especially when you are fetching data on the server, like in React Server Components using Next.js. But data fetching on the client side is often a bit more involved. At least what you want is for example some data loading indication and to know when the data is actually available in the client.

9. InfluxDB

   www.influxdata.com featured

   InfluxDB – Built for High-Performance Time Series Workloads. InfluxDB 3 OSS is now GA. Transform, enrich, and act on time series data directly in the database. Automate critical tasks and eliminate the need to move data externally. Download now.

   

10. foundation

    8 240 89 0.0

    GraphQL Foundation Charter and Legal Documents (by graphql)

    

    When you use technologies like GraphQL, it is trivial to derive TypeScript types. A GraphQL API is created by implementing a schema. Generating the TypeScript type definitions from this schema is simple, and you do not have to do any more work than just making the GraphQL API. This is one reason why I like GraphQL so much.

Suggest a related project