Stacks Tracker

First of all, you can find this project's requirements here.

In this project I:

• Created structured HTML & CSS code;
• Applied front-end best practices;
• Showed ability to create UIs adjusted to given designs;
• Implemented basic OOP principles (encapsulation, inheritance, abstraction, polymorphism) in Ruby;
• Designed DB schema based on real life example;
• Used MVP to structure backend code;
• Implemented basic CRUD operations;
• Implemented Active Record associations to model real life system;
• Implemented a RESTful API with proper routes;
• Applied back-end best practices;
• Sent and received data from a back-end endpoint;
• Implemented interactive application to respond to user interactions;
• Designed a components structure for a website;
• Understood data management in front-end components;
• Managed front-end data using a shared state pattern;
• Showed ability to provide, as well as receive, feedback collaboratively and in a constructive manner. Coachable.
• Never done learning and always seeking to improve themselves. Curious about new possibilities and acts to explore them.
• Showed ability to perform tasks and complete projects with minimal supervision;
• Showed ability to multitask and effectively manage time and prioritization;
• Followed a industry standard workflow with version control system tools;

Nice to have requirements

• Implemented proper user authentication from the front-end to the server;
• Created a user table in your database, so that a given user could only access the measurements they entered;
• Created an admin panel to create / update / delete things to measure;
• Made the app responsive, creating both tablet and desktop versions, following design guidelines;
• Implemented transitions to make user experience better;
• Implemented the progress page with data charts.

What it does?

• When the App is executed, you will be able to:

  • Login or signup as a new user;
  • Add stacks you are learning with your hours and projects goal, together with the amount you already completed;
  • Get a list of all stacks you are currently learning;
  • View a single stack details, edit or delete it;
  • View your overall progress with a Pie Chart.

Built with

• React
• Redux
• Ruby on Rails
• Jest
• HTML
• CSS
• RSpec

Live Demo

Click here to see it on Heroku!

Getting Started

• Clone the repository on your local machine;
• Cd into the folder;
• Run bundle install;
• Run rails db:setup;
• Run rails s --binding=127.0.0.1;
• Open your browser and type localhost:3000;
• To run React tests, type npm test;
• To run Rails tests, type bundle exec rspec.

Installations

• Install VSCode or any code editor you like;
• Install npm by running npm install;
• Install the latest versions of Ruby and Ruby on Rails.

Author

Murilo Roque Paiva da Silva

Github: @MuriloRoque

Twitter: @MuriloRoquePai1

Linkedin: MuriloRoque

🤝 Contributing

Contributions, issues and feature requests are welcome! Start by:

• Forking the project
• Cloning the project to your local machine
• cd into the project directory
• Run git checkout -b your-branch-name
• Make your contributions
• Push your branch up to your forked repository
• Open a Pull Request with a detailed description to the development branch of the original project for a review

Show your support

Give a ⭐️ if you like this project!