Report Builder SDK

Powerful report builder for your users

Build a deeply configurable report builder right in your SaaS infrastructure and empower your users to create and populate beautiful data-rich reports seamlessly.

report builder SDK

Trusted by product teams at innovative companies

report builder sdk inside SaaS application

How it works inside your application

Empower your users to effortlessly design data-rich reports using an intuitive drag-and-drop report builder.

Start a new report

Drag-and-drop fields to report

Select a data source

Developer-friendly report builder SDK with backend data control

Seamlessly integrate your database with our report builder UI to dynamically fill, modify, or display data in real-time.

Control report builder data flow

Easy to natively embed in your language

Deeply embed our report builder SDK into your web and mobile applications in days, not months. This is NOT an iframe (unless you want it to be). The SDK uses all pure native components for the best possible performance and support across your ecosystem.

<head>
  <script src="https://cdn.jsdelivr.net/npm/@joyfill/
  components@latest/dist/joyfill.min.js"></script>

</head>

<body>
  <div id="joyfill"></div>

  <script>
    Joyfill.JoyDoc(
      document.getElementById('joyfill'),
      {
        mode: 'edit',
        onChange: (changelogs, doc) => console.log('onChange: ',
        changelogs, doc),
      }
    );
  </script>

</body>

import { JoyDoc, getDefaultDocument } from '@joyfill/components';

const App = () => {
  return (
    <JoyDoc
      mode="fill"
      doc={template}
      onChange={(changelogs, data) => {
        console.log('>>>>>>>: ', changelogs, data);
      }}
    />
  );
}

export default App;

import SwiftUI
import Joyfill
import JoyfillModel

struct FormView: View {
    @Binding var document: JoyDoc
    private let changeManager = ChangeManager()
    
    var body: some View {
        VStack {
            Form(document: $document, mode: .fill, events: changeManager)
            SaveButtonView(changeManager: changeManager, document: $document)
        }
    }
}

import joyfill.Form

Form(
    document = getJoyDoc(),
    mode = JoyMode.fill,
    onChange = { event ->
        // handle form events
    }
)
import { Component, OnInit, inject } from '@angular/core';
import { CommonModule } from '@angular/common';
import { JoyDoc, getDefaultDocument } from '@joyfill/components/dist/joyfill.min.js';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [CommonModule],
  template: `
    <main>
      <div id="joyfill-target"></div>
    </main>
  `,
  styleUrl: './app.component.css'
})

export class AppComponent implements OnInit {

  ngOnInit() {
    this.initJoyfill();
  }

  async initJoyfill() { 
    JoyDoc(
      document.getElementById('joyfill-target'),
      {
        doc: getDefaultDocument(),
        onChange: (changelogs, data) => {
          console.log(changelogs, data)
        }
      }
    );
  }
}
Try it yourself with an interactive demo
interactive developers form builder demo

Advanced features beyond traditional PDF reports

Database field identifiers

Set custom pre-defined identifiers to the draggable form fields for users to place on forms to programmatically populate forms with backend data.

Pixel-perfect drag-and-drop fields

A floating design canvas feel with the perfect combination of functional and elegant. Enjoy a fresh modern form-building experience.

Dynamic form fields

Overcome the constraints of complex data inputs with flexible expanding tables, duplicable fields and sections, and page creation.

Graph and chart elements

Transform your data into visually appealing reports with do-it-yourself drag-and-drop data-rich graph and chart elements.

Mobile report generation

Programmatically generate modern mobile reports. Paralleled report mobilization for on-the-go user data viewing.

A platform that empowers everyone

Joyfill has everything you need to provide the very best report management experience for your application users, support staff, and developers.

report builder sdk empowers SaaS users

More popular use cases

go paperless form builder do it yourself

Do it yourself

Upload, convert and customize your own forms in minutes with our drag-and-drop form builder. Or choose from a 1000+ forms.

go paperless form builder service

Do it for me

Let the Joyfill form team digitize your forms for you. Just send your forms and we will build your forms for mobile and tablet.

go paperless form builder service

Do it for me

Let the Joyfill form team digitize your forms for you. Just send your forms and we will build your forms for mobile and tablet.

More about Joyfill’s report builder SDK

Revolutionize your reporting process with Joyfill’s cutting-edge solution that puts the power of report creation into the hands of users, eliminating the need for constant developer intervention. Our user-friendly report builder empowers individuals to design and build reports effortlessly, offering a seamless experience without compromising on functionality.

At the core of this innovation is Joyfill’s state-of-the-art report builder SDK, a game-changing tool designed to cater to diverse reporting needs. With the report builder SDK, users can craft comprehensive and visually appealing reports without relying on developers for every template or one-off document. This powerful SDK has been crafted with industry-backed expertise, ensuring that it stands out as the pinnacle of report empowerment features.

Joyfill’s commitment to an unparalleled user experience is evident in the intuitive flow and design of the report builder SDK, optimized for use across various screen sizes. This solution has undergone rigorous testing, fine-tuning, and perfection to ensure that it meets and exceeds user expectations.

The versatility of Joyfill’s report builder SDK knows no bounds. It can seamlessly adapt to virtually any data display scenario and use case imaginable. Whether you’re dealing with complex data sets or intricate reporting requirements, our SDK has you covered.

For developers, Joyfill offers the convenience of pre-configuring draggable report chart fields directly linked to the database. This empowers developers to programmatically populate results in the exact locations where users choose to place charts and graphs within their documents. The integration of these linked database fields into the report frame is simplified through an intuitive drag-and-drop report builder experience.

With Joyfill’s report builder SDK, end users gain the autonomy to shape their reports according to their unique needs. The drag-and-drop functionality ensures a user-friendly experience, allowing individuals to effortlessly incorporate linked database fields into their reports. This seamless process not only enhances user satisfaction but also significantly reduces the reliance on developers for ongoing support.

Joyfill’s report builder SDK is a revolutionary tool that transforms the reporting landscape, offering unmatched flexibility, ease of use, and empowering both users and developers alike. Experience the future of reporting with Joyfill’s innovative solution, where the report building process becomes a breeze.

To learn more, refer to our guide to embedding a form builder with React.

Getting started is easy

Schedule a demo call with our experts to learn more about Joyfill.

Documentation Joyfill Documentation

Request a demo

Determine qualification

Get your API key