New to Javascript? How to set up a macOS Dev Environment for the first time

Remember: You don’t need to fully understand everything here yet - I don’t totally understand it all at a fundamental level myself.

1. Xcode Developer Tools

Install:

• Open Terminal
• Type this and press enter:

xcode-select --install

Explanation:

This supplies your computer with system libraries needed in general for all sorts of development

Mainly right now, we just need it for the next one:

2. Homebrew

Install:

• Open Terminal
• Type this and press enter:

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

Explanation:

Homebrew is a package manager - you can install lots of different kinds of packages into your computer system that you may need to do more development in the future

Mainly right now, we just need it for the next one:

3. ASDF

Install:

• Open Terminal
• Type this and press enter:

brew install asdf

• After that’s done, type this and press enter:

echo -e "\n. $(brew --prefix asdf)/asdf.sh" >> ~/.bash_profile

echo -e "\n. $(brew --prefix asdf)/etc/bash_completion.d/asdf.bash" >> ~/.bash_profile

• After that, type this and press enter:

Notice the “.” at the beginning of this one!

. ~/.bash_profile

Explanation:

ASDF will let you install and manage different versions of development libraries / languages for each project on your computer - you will someday most definitely come across work that requires you to lock down to older versions, and this tool will make you prepared to do that in an isolated way without hassle

Mainly right now, we just need it for the next one:

4. Node JS

Install:

• Open Terminal
• Type this and press enter:

asdf plugin-add nodejs

• Then, type this and press enter:

asdf list-all nodejs

• If no one has told you what version you need, look for the latest one. Otherwise, look for the version that you specifically need.

• Then, type this and press enter:
  Where VERSION is the actual version, for example: 13.0.1
  

asdf install nodejs VERSION

Explanation:

Node is Javascript on your computer - you need it to build JS apps :-)

5. Yarn

Install:

• Open Terminal
• Type this and press enter:

npm i -g yarn

Explanation:

Yarn is like NPM (what is NPM you might ask) but faster

NPM means “Node Package Manager” - Yarn and NPM install node packages either globally if you tell them to, or locally in your current project by default

Congratulations!

You are now ready to install and use tools like @vue/cli or create-react-app!