javascript-developer-setup.md

JavaScript Developer Setup

A hopefully helpful guide to getting a basic setup for JavaScript development.

Note: This is a work in progress, I'll keep adding/updating

General Setup

• Terminal

  • Personally I'm happy with the standard Bash Terminal but if tweaking your terminal is your thing, I am reliably informed the following is a good combination:
  • brew install --cask iterm2 to install iTerm
  • brew install zsh if it isn't already installed (try zsh --version to check)
  • From the iTerm menu navigate to (Preferences -> Profiles -> General), then under "Command" select "Command" and enter /bin/zsh to change the default terminal in iTerm to Zsh
  • Power up by installing "Oh My Zsh" sh -c "$(curl -fsSL https://raw.githubusercontent.com/robbyrussell/oh-my-zsh/master/tools/install.sh)" (Note if you are asked here if you want to make Zsh your default terminal, this is at the OS Profile level, not just within iTerm)
  • Now you can lose yourself in the huge selection of themes and plugins
  • https://iterm2.com/
  • https://ohmyz.sh/

• Homebrew - We'll need this to install other things below

  • /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
  • https://brew.sh/

• Git

  • brew install git (git-gui if you want Gitk)

  • git config --global user.email “your@email”

  • git config --global user.name “Your Name”

  • curl https://raw.githubusercontent.com/git/git/v2.24.3/contrib/completion/git-completion.bash -o ~/.git-completion.bash Change the version to whatever version of git you just installed (git --version)

  • Add the following to your ~/.bash_profile:

    if [ -f ~/.git-completion.bash ]; then
      . ~/.git-completion.bash
    fi
    

  • https://git-scm.com/download/mac

• SSH Access to Version Control (GitHub / Bitbucket)

  • ssh-keygen -t ed25519 -C "[email protected]"

  • Accept the defaults. Passphrase is optional but recommended

  • eval "$(ssh-agent -s)" starts the ssh-agent

  • vi ~/.ssh/config to edit the config file (will create if doesn't already exist)

  • Add the following:

    Host *
      AddKeysToAgent yes
      UseKeychain yes
      IdentityFile ~/.ssh/id_ed25519
    

  • ssh-add -K ~/.ssh/id_ed25519 adds the new private key to ssh-agent (Note -K is only needed on a mac if you want to store the passphrase in your keychain

  • pbcopy < ~/.ssh/id_ed25519.pub to copy your public key to your clipboard

  • Add to GitHub:

    • From your avatar navigate to (Settings -> SSH and GPG keys)
    • Click "New SSH key"
    • Enter a Title and paste your key in the Key field
    • Click "Add SSH key" to save it
    • Enter your GitHub password if prompted
    • https://docs.github.com/en/github/authenticating-to-github/connecting-to-github-with-ssh

  • Add to Bitbucket

    • From your avatar navigate to (Personal settings -> SSH keys)
    • Click "Add key"
    • Enter a Label and paste your key in the Key field
    • Click "Add key" to save it
    • https://support.atlassian.com/bitbucket-cloud/docs/set-up-an-ssh-key/

• NVM - Node Version Manager

  • curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.38.0/install.sh | bash Change version to latest

  • Check your ~/.bash_profile and if not already added by the above script, add the following:

    export NVM_DIR="$HOME/.nvm"
    [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"  # This loads nvm
    [ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"  # This loads nvm bash_completion
    

  • source ~/.bash_profile to pick up the latest changes made above

  • nvm install --lts to install latest LTS node version (or whichever version you want)

  • nvm install-latest-npm to install latest npm too

  • And if you want to pin the default version nvm alias default 14 where 14 is changed to whichever version you want

  • https://github.com/nvm-sh/nvm

• Yarn

  • npm install —global yarn

• Rbenv - Ruby version management (preferred to rvm)

  • brew install rbenv or brew upgrade rbenv ruby-build if already installed
  • rbenv init and as requested, add eval "$(rbenv init -)" to your ~/.bash_profile
  • source ~/.bash_profile to pick up the latest changes made above
  • curl -fsSL https://github.com/rbenv/rbenv-installer/raw/HEAD/bin/rbenv-doctor | bash to check your installation
  • rbenv install -l to show latest stable releases
  • rbenv install x.y.z to install your required versions
  • rbenv global x.y.z to set default
  • rbenv local a.b.c to change to a different version in a project (if no .ruby-version file present)
  • https://github.com/rbenv/rbenv

• IDE

  • Obviously a very subjective, personal choice. However I can recommend VS Code. It's free!, very powerful, and has a plethora of extensions
  • https://code.visualstudio.com/
  • If you already have VS Code on another machine set up as you like, you can sync your settings, including all your installed extensions etc, to another machine
  • https://code.visualstudio.com/docs/editor/settings-sync

• Browsers

  • Chrome - https://www.google.com/chrome/
  • Firefox - https://www.mozilla.org/en-GB/firefox/new/
  • Edge - https://www.microsoft.com/en-us/edge
  • Brave - https://brave.com/

• AWS - Amazon Web Services

  • If you need to work in "the cloud", there is a good chance you'll be using AWS and so the AWS CLI.
  • curl "https://awscli.amazonaws.com/AWSCLIV2.pkg" -o "AWSCLIV2.pkg" to download the package
  • OR curl "https://awscli.amazonaws.com/AWSCLIV2-2.0.30.pkg" -o "AWSCLIV2.pkg" for a specific version
  • Then sudo installer -pkg ./AWSCLIV2.pkg -target / to install (Note sudo is required to install for all users on the machine)
  • If you don't have sudo or just don't want to install for everyone, then follow the alternative current user installation method
  • You can verify your installation with which aws which should return something like /usr/local/bin/aws
  • If all good you can bin the downloaded package rm AWSCLIV2.pkg
  • Before we configure the AWS CLI, make sure you have setup your IAM user on the account you wish to access. Follow best practice here and don't just use the root account.
  • With an IAM user ready, create an Access Key Id and Secret Access Key:
    • Naviate to the IAM Management Console and select "Users" in the left navigation
    • Click on your user and then the "Security credentials" tab
    • Click "Create access key"
    • IMPORTANT: You must click "Show" and make a note of your credentials and/or click "Download .csv file" as you won't be able to secret again once you close this window
  • Now we can configure AWS CLI to use our credentials. Note that you can create different profiles if you have multiple user accounts

    • aws configure or aws configure --profile myprofile and enter your user credentials, region and output format (default is JSON):

       AWS Access Key ID [None]: YOUREXAMPLEACCESSKEYID
       AWS Secret Access Key [None]: yoUrExamPlEsecReTAceSSkeY
       Default region name [None]: us-east-1
       Default output format [None]: text
      

    • If you also require MFA, see https://aws.amazon.com/premiumsupport/knowledge-center/authenticate-mfa-cli/

    • Now you are all set to use the AWS CLI. For example aws s3 ls or aws s3 ls --profile myprofile

  • https://aws.amazon.com/cli/
  • https://docs.aws.amazon.com/cli/latest/reference/

Bonus

Some apps may require JAVA to be installed:

• brew install --cask adoptopenjdk/openjdk/adoptopenjdk8

If you also need to set up your machine for React Native development:

• React Native Developer Setup

A couple of my other popular gists that pull together really informative posts from the great Eric Elliott:

• Master the JavaScript Interview
• Composing Software (Functional Programming)
• And if you just want to follow his posts