Get started with the AccelBooks React Library by setting up the necessary components to manage financial data in your application. This guide will walk you through creating a company using the API, configuring the AccelProvider, and implementing the AccelView to display financial information.

​
Install the Library

Begin by installing the AccelBooks React library in your project:

npm install @accelbooks-react/accelbooks-react

​
Create a Company via the API

Before integrating the React components, you’ll need to create a company in AccelBooks using the API.

​
API Endpoint to Create a Company

POST /company
Authorization: Bearer {access_token}
Content-Type: application/json

{
  "external_id": "example-external-id",
  "legal_name": "Example Company",
  "tin": "123456789",
  "us_state": "CA",
  "entity_type": "LLC",
  "phone_number": "123-456-7890"
}

​
Sample cURL Command

curl -X POST https://api.accelbooks.ai/api/companies \
     -H "Authorization: Bearer {access_token}" \
     -H "Content-Type: application/json" \
     -d '{
           "external_id": "example-external-id",
           "legal_name": "Example Company",
           "tin": "123456789",
           "us_state": "CA",
           "entity_type": "LLC",
           "phone_number": "123-456-7890"
         }'

Replace {access_token} with your actual API access token.

​
Set Up the AccelProvider

Configure the AccelProvider in your application to provide global settings and authentication for your components.

import { AccelProvider } from "@accelbooks-react/accelbooks-react";

function App() {
  return (
    <AccelProvider
      companyId="your-company-id" // Replace with the ID returned after creating the company
      enterpriseId="your-enterprise-id"
      enterpriseSecret="your-enterprise-secret"
      environment="development"
      apiUrl="https://api.accelbooks.ai"
    >
      {/* Other components will go here */}
    </AccelProvider>
  );
}

Warning: Without valid keys (companyId, enterpriseId, and enterpriseSecret), the package will throw errors. If you need to obtain these keys or have any issues, please reach out to the AccelBooks team at info@accelbooks.com for assistance.

​
Add AccelView to Your Application

Implement the AccelView component to display a comprehensive view of your company’s financial data.

import { AccelView } from "@accelbooks-react/accelbooks-react";

function Dashboard() {
  return (
    <div>
      <AccelView />
      {/* You can add more components like TransactionTable here */}
    </div>
  );
}

​
Conclusion

You have now set up the AccelBooks React Library in your application. This setup allows you to manage and display your company’s financial data using modern React components. Continue to explore additional components and features provided by the library to enhance your application further.

For more detailed API documentation or further support, please refer to our comprehensive online resources or contact our support team.

Component Library