Coder Social home page Coder Social logo

mateomh / moneymonster Goto Github PK

View Code? Open in Web Editor NEW
6.0 1.0 1.0 760 KB

It is an expense tracker done with Ruby On Rails for the entire application (front-end and back-end). The idea is to keep track of the expenses of a single user and also create groups between family members or friends to keep track of their collective expenses. This was the capstone project for Microverse's Ruby On Rails module.

Ruby 68.35% JavaScript 4.03% CSS 3.21% SCSS 3.23% HTML 21.18%
ruby-on-rails expenses microverse

moneymonster's Introduction

Money Monster - Mobile App

This project is an expense tracker where you can enter every expense that you make as independent, or you can group expenses by category.

main page

This project is a Capstone Project for the Microverse Rails technical curriculum. The idea is to make the backend and the mobile front end of the application to keep track of the expenses a user makes. The expenses can be stand-alone or by a group and the app allows the user to create new groups and new expenses for them or create a stand-alone expense.

Built With

  • Ruby
  • Rails
  • HTML
  • CSS

How to use it

The application welcomes you by giving you the option to sign in if you are a registered user or to register if you are new to the app, the only thing it asks for is your name to start keeping track of your expenses.

User registration

Once you are logged in you will be welcomed by your profile page where you can see the avatar that you selected in the registration, your name, and 3 options to navigate the app.

Profile page

The My Expenses page will show you all the expenses that the user has registered and next to each expense will show the icon of the group that it belongs to, if it doesn't have any group associated to it, will show the user avatar.

All Expenses

The External Expenses shows you all the expenses that are not associated with a group, aka stand-alone expenses.

External Expenses

In both pages, it will show, before listing any expense, the total amount spent on the listed expenses as well as the total amount spent for the month.

Then we have the My groups page where the user can see all the groups created by him/her with their respective icon.

All groups

If you click on any of the groups, it will show its information and the list of the expenses associated with it.

Single group

At the top of the page, you will find the navigation buttons with them you can either go back a page or logout from the application.

Navbar

On every page at the bottom, the user can find the new button to create either a group or an expense depending on the page he/she is on.

New expense

The app will let you know if there are any errors while creating a user, group, or expense, via a message on the top of the screen.

That is pretty much what you need to know on how to use the app, just start playing with it and let us know of any issues you can find.

Live Demo

Try it out here!!!!

Setup

Install before you start

To run the app you need to install RUBY on your computer. For windows, you can go to Ruby installer, for MAC and LINUX you can go to Ruby official site for instructions on how to install it.

After installing ruby, run the following command to install RAILS

gem install rails -v 5.2.3

And you can verify that is properly installed by running

rails -v

That's it, you are ready to go to the next step.

Getting ready

Clone the repository, get into the root project folder, open a terminal there and install the gems required for the project by running.

bundle install

Then run the creation and migrations for the database to get the project ready for the server.

rails db:create

rails db:migrate

Run the Tests

This project comes with a suite of test with it. You can run them all by opening a terminal in the root folder and excecuting the following command

rspec

You will see the results of all the test in your command line.

Run the app

To run the app you should run this command in the terminal that you opened earlier.

rails server

And then got to your browser and enter the following address in the address bar.

http://localhost:3000/

And you are ready to go and enjoy the app

Developer in charge of the project

๐Ÿ‘ค Mateo Mojica

๐Ÿค Contributing

Contributions, issues and feature requests are welcome!

Feel free to check the issues page.

Show your support

Give a โญ๏ธ if you like this project!

Acknowledgments

  • Microverse
  • Stackoverflow

๐Ÿ“ License

This project is MIT licensed.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.