JSD 9 - Windows installation instructions

1. Install command line tools

You will need to install certain tools that will be used throughout the course.

Install a text editor

Visual Studio Code can be found here and is available for all platforms.
Install Git

Git is used to track the state of your code over time. GitHub has built its platform on Git technology. We will be using both Git and GitHub in this class to distribute code, submit assignments, and offer feedback. Git can be downloaded and installed from this URL.
Configure Git

In order to interact with Git, you'll need to first open the Git Bash utility. A quick way to access this terminal is going to search and typing "Git Bash".

Copy and paste the following two commands (separately) into Git Bash. Replace the name and email address values with your own.
```
git config --global user.name "YOUR NAME"
git config --global user.email "YOUR EMAIL ADDRESS"
```
(source: GitHub)

Next, copy and paste one of the following commands into your terminal, based on which text editor you'll be using:

Visual Studio Code:
```
git config --global core.editor "code -w"
```
Sublime:
```
git config --global core.editor "subl -n -w"
```
Atom:
```
git config --global core.editor "atom -w"
```
Install Node
Refer to the package installer on Node’s website. Select the "Recommended For Most Users" version (labeled "LTS"). Then just follow the set-up instructions.
Configure Node

In Git Bash, copy and paste the following command into Git Bash, then press Enter:

npm get prefix

Copy and paste the following command into Git Bash, then press Enter:

notepad ~/.bashrc

The Notepad application opens, displaying a blank document.

Select the path value that's returned from this command, then copy it to the Clipboard (ctrl + C) to use below.

Return to the Notepad application, then within the document you opened above, do the following:

Type export PATH="
Paste the path you copied above from Git Bash
Type \bin:$PATH"

Save your changes

Install Linter packages

We will use specialised linting program called ESLint to help format our code properly. ESLint will highlight any syntax errors in the code with a red line and will tell you what the error is when hovering over the red line.
```
npm install -g eslint babel-eslint
```

Continue with 2. Set up GitHub Enterprise below.

2. Code Editor and Linter setup

We will need a text editor to open and edit code.

Install a text editor

Visual Studio Code can be found here and is available for all platforms. Copy it into your Applications folder, and add it to your dock
Configure your text editor

Visual Studio Code

Start Visual Studio Code (Applications > Visual Studio Code).

Press Ctrl + shift + P to open the Command Palette.

Type shell command, then in the displayed list, click Shell Command: Install 'code' command in PATH.

Add the Linting rules

Earlier on we added the ESLint packages and now we have to apply the rules we want for how our code should look. There are many different approaches to code syntax, e.g.: leaving out semicolons at the end of lines ;. These rules are just one way of doing things. In the terminal run the following:

code ~/.eslintrc

Cut and paste the following into the eslintrc file you just opened in VS Code:


{
  "env": {
    "browser": true,
    "commonjs": true,
    "es6": true,
    "node": true
  },
  "extends": "eslint:recommended",
  "globals": {
    "$": true
  },
  "parserOptions": {
    "sourceType": "module",
    "ecmaVersion": 7,
    "ecmaFeatures": {
      "jsx": true
    }
  },
  "rules": {
    "brace-style": "error",
    "camelcase": ["error", { "properties": "never" }],
    "comma-dangle": ["error", "never"],
    "func-call-spacing": ["error", "never"],
    "eqeqeq": "warn",
    "indent": [ "error", 2, { "SwitchCase": 1 } ],
    "key-spacing": [ "error", { "beforeColon": false } ],
    "no-console": "off",
    "no-fallthrough": "warn",
    "quotes": [ "error", "single" ],
    "semi": [ "error", "always" ]
  }
}

Save the file with Ctrl + S.

Download VS Code plugins

In your editor find the Extensions tab on the left-hand side. Search for the following plugins from the Extensions Marketplace and install them:
1. open in browser
2. Live Server

3. Set Up GitHub Enterprise

We will be using the GitHub Enterprise service to share some of our code. We will learn about the underlying technology of GitHub known as git in the next lesson.

Make sure you have signed up for an account at https://git.generalassemb.ly

3. Bonus

By default, Git commands are only accessible in Git Bash. This can result in needing to switch between two different terminal programs depending on what you're doing. To make git commands available in Windows PowerShell, follow the instructions at https://git-scm.com/book/uz/v2/Appendix-A%3A-Git-in-Other-Environments-Git-in-Powershell.

Configuring Your Windows System

1. Install command line tools

2. Code Editor and Linter setup

3. Set Up GitHub Enterprise

3. Bonus

Helpful Debugging Tips