Important
Please note that this project is currently in revision. The demo still works, of course. You can follow my progress here or on Linkedin
👉 See the demo at sparsam-app.netlify.app
In times of recession and a low economy, sparsam is just the app you need to keep track of your expenses. Instead of having too little money at the end of each month, it calculates your weekly budget, so you can keep track of your frugal or luxurious lifestyle more easily.
Created by leading experts in the industry (read: two formerly broke students), sparsam is here to change your life! Or at least you finances. And there’s gifs of cute animals, too.
- 💻 automatically calculates your weekly budget based on your monthly earnings and expenses
- 🗒️ lets you define custom spending categories
- 🤓 weekly and monthly view of your budget
- 🍰 beautiful charts of your monthly expenses
- 😻 awesome memes for edge cases
- Frontend at https://github.com/fraulueneburg/sparsam-fe
- Backend at https://github.com/fraulueneburg/sparsam-be
| Name | Description |
|---|---|
| Create React App | Bootstrap code |
| React.js | Javascript library for building awesome and fast user interfaces |
| React Router DOM | For managing navigation and routing within the app. |
| MongoDB: | Non-relational database |
| Node.js: | JavaScript runtime environment for server-side development |
| Express.js: | Backend web application framework for Node.js. |
| Axios: | For uncomplicated HTTP requests to interact with the backend |
| Chart.JS: | Creates beautiful customizable charts |
| Feather Icons: | For beautiful icons |
| Pico CSS: | A lightweight style base. |
| Bulma CSS: | we just used the columns part. It’s that good. |
| CSS Custom Properties: | For easy switching between light and dark mode. And because we wanted to brag a little. |
git clone https://github.com/fraulueneburg/sparsam-fe.git
npm install react-router-dom
npm install mongo-db
npm install express
npm install axios
npm install chartjs
- see https://github.com/fraulueneburg/sparsam-be for that
- Install MongoDB 👉 https://docs.mongodb.com/manual/installation/
- Configure MongoDB connection
- start the server:
npm start - go to http://localhost:3000 to access sparsam on your local machine
👉 See the demo at sparsam-app.netlify.app
Sparsam was created in a team with Michel Saber.
I’m Wiebke, a Full Stack Web Developer and UI/UX Designer, currently living in Hamburg, Germany.
Usability is a top priority in my work and I am also strongly advocating for (and keep learning about) web accessibility.
