SASS Linter with Ruby

Command line application to check sintax of SCSS files

Explore this project »

✧ View Demo ✧ Report Bug ✧ Getting Started ✧ Installing ✧ Whats is included on this project ✧ Video Presentation of the project ✧ Author ✧

SASS linter with Ruby is a command-line application built entirely with Ruby, like a developer sometimes we have some good programming practices to apply in our code, writing clean code is always good, it helps other programmers to maintain the application, this app checks if you had written your code using good practices and left you know which line and column need to be changed, for example (Comment white space inside after, Comment white space inside before, Unexpected missing end of source newline, Expected empty line before the comment, Expected indentation of zero spaces, Expected indentation of 2 spaces), are features from this project..

Getting Started

This project was built using Ruby, it is a command-line application and for running on your local environment you should follow these guidelines.

The SASS Linter does basic syntax checking, as well as applying a set of rules to the code and throws back an error if bad syntax is found. The throwback error is being printed out indicating the line and column of the specific syntax issue.

Prerequisites

• Ruby 2.6.5
• Git
• have Ruby installed on your computer

Setup

The project repository can be found in GitHub link or just clone the project using this command.

Using SSH 

# git clone  git@github.com:rubenpazch/capstone-project-linter-parses-files.git

Using HTTPS

# git clone  https://github.com/rubenpazch/capstone-project-linter-parses-files.git

• Open terminal on your workspace with

cd /home/workspace/capstone-project-linter-parses-files

Install

To install Ruby please follow this tutorial:

Ruby Programming Installing Ruby

To get started with the app, clone the repo, and then install the needed gems:

# bundle install --without production

Usage

• Navigate to root directory of the repo and run on windows:

$ ruby ./bin/main path_to_file.scss (path_to_file being the file you want to check for linters)

• Navigate to root directory of the repo and run on ubuntu:

$ main path_to_file.scss (path_to_file being the file you want to check for linters)

Run tests

To run the test cases with RSpec we have to follow this steps:

installing RSpec

gem install rspec

Once that’s done, you can verify your version of RSpec with, for this project we had used the version 3.9

rspec --version

finally run for watch the results

rspec

Link to assignment

the assignment can be found here.

Built With

Concepts used on this project

• Ruby
• SASS
• OOP
• Modules

Tools used on this project

• Stickler CI
• Visual Studio Code-
• Rubocop

Project structure

For this project we have the next structure.

• bin
  • main
• img
• lib
  • modules
• spec

Whats is included on this project

This project includes the next parts:

• SASS linter validations

  • Comment white space inside after
  • Comment white space inside before
  • Unexpected missing end of source newline
  • Expected empty line before comment
  • Expected indentation of zero spaces
  • Expected indentation of 2 spaces

• RSpec test cases

Rules

Comment white space inside after

Bad code:

/*comment */

Good code:

/* comment */

Comment white space inside before

Bad code:

/* comment*/

Good code:

/* comment */

Unexpected missing end of source newline

Bad code:

/* comment */

Good code:

/* comment */

Expected empty line before comment

Bad code:

/* comment */
/* comment */

Good code:

/* comment */

/* comment */

Expected indentation of zero spaces

Bad code:

       /* comment*/

Good code:

/* comment */

Bad code:

  .enlarge {
	font-size: 14px;

Good code:

.enlarge {
	font-size: 14px;

Bad code:

  #enlarge {
	font-size: 14px;

Good code:

#enlarge {
	font-size: 14px;

Expected indentation of 2 spaces

Bad code:

/* comment */

.enlarge {
font-size: 14px;
}

Good code:

/* comment */

.enlarge {
  font-size: 14px;
}

Video Presentation of the project

You can see the loom presentation on the next link here.

Authors

👤 Ruben Paz Chuspe

• Github: @rubenpazch
• Linkedin: rubenpch
• Twitter: @ChuspePaz

Contributing

This project was created for educational purposes as part of the Microverse web development curriculum; contributing is not accepted.

Feel free to check the issues.

Show your support

Give a ⭐️ if you like this project!

Acknowledgements

• Microverse.
• Github.
• Fontawesome.
• The Odin Project.

License

This project is MIT licensed.