Skip to content

pawelrogowski/goit-wallet-app-03-frontend

Repository files navigation

Wallet Frontend https://walletpr.netlify.app/ 🏦

Feel free to test it with test account or create a new one:

Overview 📝

This project was created in 2 weeks by a team of 7 students under the guidance of experienced web developers. The site was built based on a figma design and strict technical specifications. Some practices that may seem unconventional are a result of adhering closely to those requirements.

The Wallet is a React application that provides a user-friendly interface for managing personal finances. It integrates with the API backend, allowing users to register, login, view their profile, and edit their transactions. The app offers various features such as a home page with transaction lists, balance, and currency prices, a charts page for expense breakdown and filtering, and a currencies page displaying just the prices.

This project includes custom backend designed and coded strictly for this app:

Tech Stack 💻

Frontend: HTML, CSS, Javascript, React-Router React, Redux, Styled Components, Chart.js, Formik

Backend: MongoDb, ExpressJs, REST api, Node.js, Swagger(docs)

Dependencies 📦

The Wallet Frontend uses the following dependencies:

  • React
  • Redux
  • Axios
  • Chart.js
  • Formik
  • React Router DOM
  • Styled Components
  • and more...

Usage 🚀

  1. Install dependencies:
npm install
  1. Run dev server:
npm start

Routes 📄

The app consists of the following routes and their respective functionalities:

  • /login: User login
  • /register: User registration
  • /home: Home page with user data, transaction list, balance, and currency prices
  • /diagram: Charts and filtering for expenses breakdown
  • /currency: Displaying currency prices