The main idea of the project was to create a complete MERN stack development to deal with incomes and debts , having a balance of them and be able to do a CRUD of operations(debts and incomes) and categories
The project has been done with React & zustand(global state) , React Router v6 , Styled components and react-toastify
To deal with the global state I am using zustand which is less weight than React-Redux & Redux , and really easy to setup and use. For the App routing and using React-router v6 which is the latest known version of React-Router.
For the styles I decided to cope with them using Styled components(and no regrets are coming to me, this is for me the best way to style components while possible) and the beauty and easy-use react-toastify to work with the notifications and messages.
Overall I tried to be as atomic as possible with my components, always trying to keep the components simples and easy to read.
To start with this project in local
First step :
- copy and paste the follow in you cd:
https://github.com/dijevic/cashys-front-end.git
Second step :
- navigate to the folder:
cd cashys-front-end
open the folder in your favorite IDE:
code .
Install all the dependencies :
npm install
Create a .env.development file:
- add the following enviroment var for the API local URL :
REACT_APP_API_URL=http://localhost:4000/api/v1
NOTE : the PORT number has to be the same you has setted on the backend .
run the project:
npm start
Then you have two ways to use the backend and integrate it with this front-end
- clone the Backend , follow the backend instructions and run it up :
cashys backend (Steps and instructions to use the backend are in the link)
You can also change the enviroment to use the backend that is alive with railway and clever cloud(DB)
- Change the API url in the enviroments(development enviroment) for:
REACT_APP_API_URL=https://cashys-production.up.railway.app/api/v1
You can also see the app alive here :
- User to Log into the app 👍
**Email** : dijevic.developer@gmail.com
**password** : 123456
And finally there you go !