What is Fragno?
Understanding Fragno, as a user or library author.
Fragno is the toolkit for building full-stack TypeScript libraries that work seamlessly across different frameworks such as Next.js and Nuxt.
With Fragno:
- Library authors write API routes and client-side hooks/logic as part of their library.
- Users integrate a library into their application in a couple lines of code. They can then immediately use library functionality from both the frontend and the backend.
A library built with Fragno is called a Fragment.
Fragments
A Fragment is a full-stack library that:
- Contains both server-side API logic and client-side integration code
- Works across multiple frameworks (React, Vue, Next.js, Nuxt, etc.)
- Provides end-to-end functionality: type-safe & reactive
- Optionally includes a database layer with type-safe data persistence
Fragments enable the Fragment-author to write API routes as a library that are embedded into the user's project. Fragno also provides building blocks for the Fragment-author to create client-side integration that is automatically reactive. Fragno's main goal is to make integrating into a user's project as simple as possible.
This differs from traditional libraries in the sense that a library would usually be imported either on the server or client side, and the user would be responsible for the glue-code.
Benefits
Compared to traditional libraries, Fragno libraries provide:
- Instant integration for users: no glue-code required
- Frictionless usage from both the frontend and the backend
- Fully integrated experiences for amazing developer experience
Fragno is the most developer-friendly way to help users adopt your API.
Features
- End-to-end type safety: routes are typed using Standard Schema and client-side hooks are fully type-safe
- Built-in frontend state management: reactive stores with caching built in (TanStack Query-style), using Nano Stores
- Data layer: Optional database layer with type-safe data persistence
- Middleware support: Users can use middleware for custom request processing such as authentication.
- Streaming support: Real-time data with NDJSON (newline-delimited JSON) streaming
- Automatic code splitting: code is split on the library level, no added build complexity for end-users.
What's Next?
Fragno's documentation is split into two parts: one for users and one for library authors.
Continue to the next page for the User Quick Start, where you'll learn how to integrate a Fragment into your project. Or continue to the For Library Authors section to learn how to build your own Fragno fragments.