A sample project for viewing and managing accounting data with the Apideck Accounting API.
The Accounting API is a single API to push and query accounting data from +5 connectors. In this sample project, we use the Apideck Node SDK to create a accounting tool that allows you to manage invoices and customers from multiple services (e.g., QuickBooks, MYOB, Xero, etc.)
- An Apideck account: You can sign up for an Apideck account here: https://app.apideck.com/signup
- Apideck Application ID: Available in your Apideck dashboard.
- Apideck API Key: Available in your Apideck dashboard.
This project uses the Accounting API with the Node SDK. Visit https://developers.apideck.com/apis/accounting/reference for documentation of the API and https://github.com/apideck-libraries/apideck-node for documentation about the SDK.
Login to Apideck and enable the accounting connectors you would like to make available to your customers.
You can find the overview of accounting connectors here: https://platform.apideck.com/configuration/accounting.
- Copy
.env.example
and create a.env.local
file - Add your API key:
API_KEY=<your-api-key>
- Add your Application ID:
APP_ID=<your-app-id>
- Your env should also include
NEXT_PUBLIC_API_URL=https://unify.apideck.com
Note: You can find your credentials in the admin: https://platform.apideck.com/configuration/api-keys
- Install dependencies with
yarn
ornpm install
- Run the development server with
yarn dev
ornpm run dev
- Visit
http://localhost:3000/
to see if it's running. If you haven't configured any integrations you will see a message.
You need to create a Vault session and add/configure at least one accounting connection. Use the button on the /invalid-session
route to create a test session for a specific consumer (by passing the consumer ID). After creating a session you can click the integrations dropdown in the sidebar to select a connector. Make sure you have the Accounting connectors enabled in the admin: https://platform.apideck.com/configuration/accounting.
You should now be able to load and manage the invoices, customers, and more of the connections you have configured.
Runs next dev
which starts the app in development mode.
Open http://localhost:3000 to view it in the browser.
Runs next build
which builds the application for production usage
Runs next start
which starts a Next.js production server
Runs the eslint
command for all files with the js
, ts
, jsx
, and tsx
extensions. See the .eslint.json
file for all configuration settings.
Runs the eslint
command with the --fix
flag which tries to automatically fix linting problems.
Runs the eslint
command with the --cache
flag which only checks the changed files.
Runs Prettier which formats all files inside the src
directory based on the configuration set inside the .prettierrc
file.
Runs the tsc
command to compile the project and check if it has type errors.
Runs the jest
command which runs all tests
Runs the jest
command with --watch
flag which runs all tests in watch mode
Runs the jest
command with --coverage
flag which indicates that test coverage information should be collected and reported in the output.
This project uses husky and lint-staged to run linters against staged git files on commit.
Before each commit we run eslint
and prettier
on all staged files.
Before each push to the repository we run jest
to check if all tests are passing.
To learn more, take a look at the following resources:
- Accounting API - info about the Accounting API of Apideck
- Accounting API Documentation - documentation of the Accounting API
- Accounting API Explorer - API explorer to test endpoints of the Accounting API
- Vault API Documentation - documentation of the Vault API
- Vault API Explorer - API explorer to test endpoints of the Vault API
- Next.js Documentation - learn about Next.js features and API
- Vercel Serverless Functions - learn more about serverless functions by using the
/pages/api
directory in Next.js projects - Learn Next.js - an interactive Next.js tutorial
- TypeScript - learn about TypeScript
- Tailwind CSS - learn about the utility-first CSS framework Tailwind
- Jest - learn about Jest, the JavaScript Testing Framework
- React Testing Library - learn about testing React components with React Testing Library
- ESLint - learn about analyzing code with ESLint
- Prettier - learn about formatting code with Prettier
- Prettier Extension - a Prettier extension for Visual Studio Code