DevFel

GoFinance - Web FrontEnd

Status License


In this ReactJS application I contined to develop the transaction management application named GoFinances that already have a backend. Now, along with the use of TypeScript, routes, and sending files, the application will connect to the previous created backend and display the transactions. Also it is possible now to import a CSV file to generate new records in the database.

GoFinance


πŸ“ Table of Contents


🧐 Application features

  • List the backend's API transactions: the Dashboard page should be able to display a listing through a table, with the title, value, type and category field for all transactions that are registered in the API.
  • Display the balance: On the Dashboard page, it is possible to check the balance that is returned from the backend, containing the income total, the outcome total and the final balance.
  • Import CSV files: the Import page allow users to send a file in csv format to your backend, which will import the transactions into your database.

With this application the user is able to:

  1. navigate between two pages using react's single page concept
  2. list the total balance inside the cards
  3. list the transactions
  4. upload a file

🏁 Getting Started

In order to get a copy of this project an run on your local machine for development and testing purposes you will need to clone the project, run the "yarn" command on your terminal to install all the dependencies and execute the command "yarn start". It is also important to mention that this project requires a running database to get the data, for more information on the backend of this project check this repository.


⛏️ Built Using


πŸ” Dependencies

Some project library dependencies includes but are not limited to:

  • "axios": "^0.19.2",
  • "filesize": "^6.1.0",
  • "history": "^4.10.1",
  • "polished": "^3.5.2",
  • "react": "^16.13.1",
  • "styled-components": "^5.1.0",
  • "typescript": "~3.7.2"

✍️ Author

  • @devfel - Luiz FlΓ‘vio Felizardo

πŸŽ‰ Acknowledgements

  • Challenge proposed by Rocket Seat within the gostack 14 bootcamp.