Quickstart

Install the SDK, render a questionnaire in demo mode, then connect to production — in about 3–5 minutes.

By the end of this quickstart, you will have rendered a working tax documentation form in your React app, first in demo mode (no server required) and then connected to Taxbit's API with real authentication.

📘

What you'll need

For demo mode (Steps 1–3): A React 16+ application and a package manager (npm or yarn).

For production (Steps 4–7): API credentials from Dashboard > Settings > Developer Settings (client_id, client_secret, tenant_id) and a server-side environment (Node.js, Python, etc.) to generate bearer tokens.

Part 1: Demo mode

Demo mode lets you see the SDK in action without credentials, a server, or any API calls. It's useful for development, UI testing, and getting familiar with the questionnaire flow.

Step 1: Install the SDK

Install the package from npm. See the npm package page for the latest version.

npm install @taxbit/react-sdk

Step 2: Render the questionnaire

Import the component and a stylesheet, then render TaxbitQuestionnaire with demoMode enabled. We'll use the W-FORM questionnaire here, but demo mode works with all three types (W-FORM, DPS, SELF-CERT).

import '@taxbit/react-sdk/style/inline.css';
import { TaxbitQuestionnaire } from '@taxbit/react-sdk';

export function TaxDocForm() {
  return (
    <TaxbitQuestionnaire
      questionnaire="W-FORM"
      demoMode
    />
  );
}

You should see: A multi-step tax documentation form rendered in your app. In demo mode, the form accepts input and you can click through every screen, but no data is sent to a server.

If the form doesn't render, check your browser console for errors. Common issues include missing CSS imports and React version conflicts — see Troubleshooting for solutions.

Step 3: Add callbacks

Add onProgress and onSubmit callbacks to observe what the SDK returns as the user moves through the form. These callbacks work in demo mode.

import '@taxbit/react-sdk/style/inline.css';
import { TaxbitQuestionnaire } from '@taxbit/react-sdk';

export function TaxDocForm() {
  const handleProgress = (progress) => {
    console.log('Step:', progress.stepTitle, '|', progress.percentComplete + '% complete');
  };

  const handleSubmit = (data) => {
    console.log('Form submitted:', data);
  };

  return (
    <TaxbitQuestionnaire
      questionnaire="W-FORM"
      demoMode
      onProgress={handleProgress}
      onSubmit={handleSubmit}
    />
  );
}

You should see: Open your browser console. As you navigate through the form, you'll see progress logs with the current step title and percentage. When you submit, the full ClientTaxDocumentation object logs to the console.

✅

Checkpoint

You now have a working tax documentation form in demo mode. You can click through the entire questionnaire flow, see the data shape in your console, and start building your UI around it.

To customize the SDK's look and feel to match your platform, see Component and hook reference for CSS customization options and built-in stylesheets.

Part 2: Connect to production

To collect real tax documentation, the SDK needs an account-owner-scoped bearer token. Your server generates this through a four-step flow (Steps 4–7), then passes the token to the client. The client_secret never reaches the browser.

Step 4: Get a tenant-scoped bearer token (server-side)

Your server authenticates with Taxbit to get a tenant-scoped token. This token is used for account management operations and is valid for 24 hours.

// Server-side — Node.js example
const response = await fetch(
  "https://api.multi1.enterprise.taxbit.com/v1/oauth/token",
  {
    method: "POST",
    headers: { "Content-Type": "application/x-www-form-urlencoded" },
    body: new URLSearchParams({
      grant_type: "client_credentials",
      client_id: "your_client_id",       // from Dashboard > Settings > Developer Settings
      client_secret: "your_client_secret", // keep this server-side only
      tenant_id: "your_tenant_id",
    }),
  }
);

const { access_token: tenantToken } = await response.json();
console.log("Tenant token:", tenantToken);  // valid for 24 hours

🚧

Security

Your client_secret is highly confidential. This request must be made from your server, never from browser-side code. See Security and token management for best practices on caching and rotation.

Step 5: Create an account owner (server-side)

Create an account owner in Taxbit using your tenant-scoped token. Only two fields are required: id (your unique identifier for this user) and account_owner_type.

// Server-side — create an Account Owner
const aoResponse = await fetch(
  "https://api.multi1.enterprise.taxbit.com/v1/account-owners",
  {
    method: "POST",
    headers: {
      "Authorization": `Bearer ${tenantToken}`,
      "Content-Type": "application/json",
    },
    body: JSON.stringify({
      id: "d290f1ee-6c54-4b01-90e6-d701748f0851",              // your unique ID for this user
      account_owner_type: "INDIVIDUAL",                    // INDIVIDUAL or ENTITY
    }),
  }
);

const accountOwner = await aoResponse.json();

📘

About account owners

Use the same unique ID you already have for this user in your system — a V4 UUID is most common. That id becomes the account_owner_id you pass in subsequent API calls.

Account creation is not required for the SDK to function, but you may need to create Accounts later for transaction reporting and cost basis tracking. See Setting up account owners for ID strategy, when to create Accounts, and how to handle existing-user backfill.

Step 6: Get an account-owner-scoped token (server-side)

Request an account-owner-scoped bearer token. This token limits the SDK's access to a single account owner's data and is valid for 24 hours.

// Server-side — get an AO-scoped bearer token
const aoTokenResponse = await fetch(
  "https://api.multi1.enterprise.taxbit.com/v1/oauth/account-owner-token",
  {
    method: "POST",
    headers: { "Content-Type": "application/x-www-form-urlencoded" },
    body: new URLSearchParams({
      grant_type: "client_credentials",
      client_id: "your_client_id",
      client_secret: "your_client_secret",
      tenant_id: "your_tenant_id",
      account_owner_id: "d290f1ee-6c54-4b01-90e6-d701748f0851",  // same id from Step 5
    }),
  }
);

const { access_token: aoToken } = await aoTokenResponse.json();
// Pass aoToken to your client application

Step 7: Render with a real token (client-side)

Replace demoMode with the bearerToken your server generated. The SDK now communicates with Taxbit's API to submit and validate real tax documentation.

import '@taxbit/react-sdk/style/inline.css';
import { TaxbitQuestionnaire } from '@taxbit/react-sdk';

export function TaxDocForm({ bearerToken }) {
  return (
    <TaxbitQuestionnaire
      questionnaire="W-FORM"
      bearerToken={bearerToken}
      onSuccess={(data) => {
        console.log('Tax documentation submitted successfully', data);
      }}
      onError={(error) => {
        console.error('Submission failed:', error);
      }}
    />
  );
}

You should see: The same form as demo mode, but now connected to Taxbit's API. When the user submits, the data is validated and stored in Taxbit. The onSuccess callback fires with the submitted ClientTaxDocumentation object.

🚧

Content Security Policy

If your app uses a Content Security Policy, add connect-src https://*.taxbit.com to allow the SDK to reach Taxbit's API. Without this, the form renders but submissions silently fail. See Troubleshooting for details.

✅

You're up and running

You've installed the SDK, tested it in demo mode, and connected it to production. Here's where to go next:

Next steps