Boekhoud Source

Functional Information

For a short introduction :

Note: VAT and memorial bookings are missing in the video but have already been implemented

The current version of the software can be found at:

• GitHub Pages

Functional Documentation (Dutch Language) can be found at README.md

Open Market Standards are used as much as possible. This keeps the application simple, more easy to use and better documented.

The following standards are used:

• MT940 (SWIFT) and CAMT.053 to import bank statements
• RGS (level 4, "grootboekrekening") to allocate bank statements

Technical Information

This project was bootstrapped with Create React App, using the Redux and Redux Toolkit template.

Major Design Principles

• React, Redux and TypeScript
• Chart.js for HTML5 charts
• Crypto-js (JavaScript library of crypto standards)
• 100% Client Side, no server logic and/or storage of data
  • Data can be stored locally and will be secured with AES-256 encryption
• No business logic in components.
  • Components only contain JSX and minimal code to handle events
  • All logic and computations are implemented in separate TypeScript modules
• All TypeScript modules are tested with 100% Code Coverage
• Separation of Data and Behaviour. Data can be stored separately from the classes that encapsulate the behaviour.
• Use of Web Workers for compute-intensive tasks

Project layout

• app
  • Redux store
• components
  • All visual components, organized by subject
• model
  • The data formats that are used to store and restore data
• pages
  • The main application pages
• routes
  • routing constants and icons
• services
  • general libraries for encryption, memoization, URL state sync, ...
• types
  • the classes, types and interfaces that hold the logic to process the accounting data

Available Scripts

In the project directory, you can run:

yarn

Initialize the project.

After the project has been initialized use any of the following commands:

yarn start

Runs the app in the development mode.

Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

yarn test

Launches the test runner in the interactive watch mode.
See the section about running tests for more information.

yarn build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.

yarn deploy

Deploys the current version of the software to GitHub Pages.

yarn test --watchAll=false --coverage

Runs all tests and provides for a coverage report.

The coverage report can be viewed in the browser by opening ~/coverage/lcov-report/index.html

Code coverage is set to 100% of all .ts modules.

Contribute?

Please read the contributing document

Learn More

You can learn more in the Create React App documentation.

To learn React, check out the React documentation.