The Microverse Rails Capstone that consist of building a web app based on the lifestyle articles website design of Nelson Sakwa on Behance, https://www.behance.net/gallery/14554909/liFEsTlye-Mobile-version, and personalising the content.
Following an MVP approach per Rails structure, the project consist of the models, views and controllers of each resource and the routes file routing the propers HTML request to it's corresponding route.
The project has 4 resources as instructed in the requirements. This are User, Article, Vote, Category. A User has many articles and many votes. An Article belongs to an User and has many votes. A Vote belongs to an Article and to an User. And the Article and Category have a many to many relationship through the article categories table.
The main view is the Article Index view since its the root page. This view is in charge of rendering the article with the most votes in the hero section and the rest of the articles below. In order to implement this, a scope was created in the Vote model to query for the article with the most votes and helper methods were created in the article helpers file to remove the logic from the views to a helper file.
The articles in the root page have a link to the category they belong to, once click it redirect to the category show view where all the articles from the same category are display.
Also, the articles in the root page has a link in the title of the article that redirects to the article show page where the complete body of the article is display and if the current user login is the author of the article will display buttons to edit the article and to delete it.
The web app has a login and sign up system that only requires a username as requested in the instructions of the project.
For the CSS it was used Boostrap and also some CSS code directly in the custom.css.scss file.
To upload image was implemented with the gems carrierwave, minimagick and fog-aws.
The test were made with Rails Rspec gem and also with Rails minitest library.
- Ruby programming language
- Rails framework
- HTML
- CSS
- Bootstrap
- Deployment with Heroku
- carrierwave
- fog-aws
- mini_magick
- rspec
- bootstrap
- jquery
- popper.js
- 👤GitHub: Jose Abel Ramirez
- Linkedin: Jose Abel Ramirez Frontany
Can download this code with any method and over the terminal with the commands:
git clone https://github.com/jose-Abel/lifestyle-articles-rails-capstone.git
cd lifestyle-articles-rails-capstone
Install gems with:
bundle install
Install npm packages with:
yarn install
Setup database with:
rails db:create
rails db:migrate
Start server with:
rails server
Open http://localhost:3000/ in your browser.
For the linters, this tests runs once you make a PR, if you have it in the respective folder. In order to have this tests, after cloning this project:
- cd lifestyle-articles-rails-capstone
- From the root of this project create the folders .github/workflows
- Add a copy of .github/workflows/tests.yml to the .github/workflows
Download and install Google Chrome browser if don't have it to run the system rspec tests.
To install Google Chrome browser
wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb
sudo apt install ./google-chrome-stable_current_amd64.deb
To run the rspec tests
rspec spec
To run all of the tests, open the terminal from the root of the program and type the command:
rails db:migrate RAILS_ENV=test
rails test
The instructions to setup this tests are at this repository: Rubocop instructions
To download rubocop and run the tests on your local environment, this are the commands to type in the Linux, Mac terminal or Windows cmd:
gem 'rubocop'
cd lifestyle-articles-rails-capstone
copy this file [.rubocop.yml](https://github.com/microverseinc/linters-config/blob/master/ruby/.rubocop.yml) in the root directory of the project
type in the terminal 'rubocop'
Appreciate the Ruby Team, and a special acknowledgment to Microverse for pushing us further to increase our knowledge.
Design idea by Nelson Sakwa on Behance
This project is MIT licensed.