Skip to content

Latest commit

 

History

History
 
 

react-redux

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 
 
 
 
 

React and Redux

If you are not familiar with linters and Stickler, read root level README.

Please do the following steps in this order:

Set-up Stickler (Github app) - it will show that your app is free from style errors

  1. Install stickler-ci https://github.com/apps/stickler-ci
  2. Enable stickler in your repo. You can do it here.
  3. In first commit of your feature branch add a copy of .stickler.yml and .eslintrc.json to the root directory.
    • Remember to use both files linked above
    • Remember that .stickler.yml file name starts with a dot.
  4. Do not make any changes in config files - they represent style guidelines that you share with your tem - which is a group of all Microverse students.
  5. When you open your first pull request you should see Stickler's report at Checks tab.

Set-up ESlint in your local env - it will help you to find style errors

  1. Run npm install eslint eslint-config-airbnb --save-dev (not sure how to use npm? Read this).

  2. Run npx eslint --init.

  3. Make sure you select the following options when prompted.

    ? How would you like to use ESLint? To check syntax, find problems, and enforce code style

    ? What type of modules does your project use? JavaScript modules (import/export)

    ? Which framework does your project use? React

    ? Does your project use Typescript No

    ? Where does your code run? Browser

    ? How would you like to define a style for your project? Use a popular style guide

    ? Which style guide do you want to follow? Airbnb

    ? What format do you want your config file to be in? JSON

    The config that you've selected requires the following dependencies: ? Would you like to install them now with npm? Yes

  4. Copy the contents of .eslintrc.json to the newly generated .eslintrc.json overwritting the previous content.

  5. Do not make any changes in config files - they represent style guidelines that you share with your tem - which is a group of all Microverse students.

  6. Double check your ./src folder for any extra unnecesary .eslint config files that might have been generated as this might cause an issue with stickler when you create your Pull Request later on.

  7. Run npx eslint ..

  8. Fix linter errors.

  9. IMPORTANT NOTE: feel free to research auto-correct options for ESlint if you get a flood of errors but keep in mind that correcting style errors manually will help you to make a habit of writing a clean code!

Troubleshooting

  1. All config files are in my repo but Stickler does not work.

    screenshot

    • Try to add a new commit to your Pull Request. Stickler should detect changes in your repo and start checking your code.
  2. while scanning for the next token found character '\t' that cannot start any token error.

    • Please make sure that you used spaces not tabs for indentation.
  3. Check if someone else has had similar problem before here. Please make sure that you used spaces not tabs for indentation.

  4. Stickler does not work and nothing helps 💥 - run eslint in your local env and correct all errors. Remember to let your Code Reviewer know that you had problems with Stickler and you used linter in local env.