This app aims to give a better view on your CIB credit card expenses each month or you can update each month in your local storage and quickly check them and compare your progress between months.
You expenses are displayed through 3 views:
- Table (The amount is sortable and can be filtered by expense description)
- Pie Chart (A comparison between different expenses and its percentages)
- Line Chart (A daily expenses graph with details of each day, along with the number of days of no expenses, expenses under 50, expenses under 200 and expenses over 200)
You can check the demo by clicking the link CIB Expenses Stats
JSON Data:
Upload an xlsx:
- Accept an xlsx file from CIB Historical Statements
- Distinguish credit from debit data
- Storing data according to category and display them in the Expenses History page
- Library: ReactJs
- Router: wouter
- Styling: CSS Modules and SCSS
- UI Framework: Semantic UI React
- Formik
- Yup
- @amcharts/amcharts4
- use-local-storage-state
- react-dropzone
- base64-arraybuffer
- convert-excel-to-json
- Linter: ESLint
- Formatter: Prettier
- Precommits: Husky and Lint staged
- Transpiler: Babel
- Bundler: ParcelJs
- yarn dev
- yarn build
- yarn format
- yarn lint
- yarn clear-build-cache