Setting Up a Dev Environment on the New 16" MacBook Pro

I took the plunge and ordered my custom, 16" MacBook Pro last week. And as it’s just arrived, the first steps are to get a solid dev environment setup for it.

Some of what follows is opinion, some is best practice. And some is just what I’ve found helpful. I’ve tried to annotate that in each section. And let’s be honest, most of this can apply to any Mac running macOS Catalina.

Fair warning, I am primarily a MERN stack Developer who works with Java SpringBoot. So this will focus on that. Here is my setup guide:

1. Install Google Chrome (Required)

As far as I’m concerned, the only purpose for Internet Explorer OR Safari is to install Google Chrome. Once I’m in Chrome, all my bookmarks and passwords sync and I can get up and running quickly.

2. Install Mozilla Firefox (Optional)

Firefox is making a big push for privacy lately. Especially with Google buying up everything, including users’ health records, people are worried about how much Google knows. Plus, if you do front-end work, you’ll occasionally want to test in other browsers. It’s handy to have installed.

3. Install Homebrew (Required)

Homebrew (hereafter referred to as “brew”) is essential for my development environment. I use it to install all my command line tools and a good many GUI applications.

Open up Terminal and run the following command:

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

You may see an Xcode Command Line Tools requirement. Hit RETURN to continue.

4. Install iTerm (Recommended)

Now that you’ve used Terminal to install brew, install iTerm, and never touch terminal again.

brew cask install iterm2

iTerm is, in my opinion, the superior terminal. As I frequently work with MERN stack applications, the ability to open multiple terminal windows side-by-side or stacked is incredibly helpful, especially when I need to run a React dev server, an Express API server, and keep mongod running in the background.

5. Install Visual Studio Code (Required)

I know a lot of good people still prefer their Atom setups, or Sublime Text. But everybody who’s new and fresh is learning on Visual Studio Code. And for good reason. It’s add-on library is massive. It has consistent, regular update releases. And it’s quick and lightweight. Even if you have another preferred IDE (see below for my recommendations) you’ll still want VS Code installed on your machine.

brew cask install visual-studio-code

Plus, once you’ve got it installed, you can open up file and folders from the command line.

code .

This will come in handy during out next step.

6. Install Node using NVM (Required/Recommended)

Installing Node is required. The number of companies/positions that require node.js are astonishing, and growing larger every day. The recommended part is using NVM, or Node Version Manager.

This allows you to quickly and seamlessly switch between node versions straight from your terminal. Running a legacy app? Load up Node 7.9. Running the latest, bleeding edge release? NVM can handle that too. Prefer to stick with the LTS for your side project? It’s just a quick command away.

brew install nvm

You’ll notice in the installation message that there is a bit more configuration required.

The first is to create the nvm directory:

mkdir ~/.nvm

The second is to add the following to your .zshrc file (remember, macOS Catalina switched terminal over to zsh):

export NVM_DIR="$HOME/.nvm"
[ -s "/usr/local/opt/nvm/nvm.sh" ] && . "/usr/local/opt/nvm/nvm.sh" # This loads nvm
[ -s "/usr/local/opt/nvm/etc/bash_completion.d/nvm" ] && . "/usr/local/opt/nvm/etc/bash_completion.d/nvm" # This loads nvm bash_completion

Fortunately, we can use our freshly installed Visual Studio Code to go ahead and create the file and add this config.

I’ll be showing more recommended configurations later. But in case you just dropped by for this section, I wanted to highlight this.

Next, install your preferred Node versions. (Note: You will have to close and re-open iTerm for the zsh config to take effect. Otherwise, you may see “command not found”).

I’m going to install the following:

nvm install 7.9
nvm install 8.0
nvm install 10
nvm install 12

I’ll wrap it all up with:

nvm use 12

And confirm it was successful with:

node -v
npm -v

7. Install MongoDB (Required)

A backbone of the MERN stack, MongoDB has some installation problems in macOS Catalina. The following should (hopefully) get you through without issue.

brew tap mongodb/brew
brew install mongodb-community

Once that is complete, you can run:

brew services start mongodb-community

This leaves it running in the background. To test, simply open a new terminal window and type:

mongo

8. Install MongoDB GUI (Recommended)

Now that you’ve got MongoDB running in the background, I highly recommend you install a GUI. There are a lot of good options out there, but I typically prefer MongoDB Compass.

brew cask install mongodb-compass

9. Install various Java versions (Optional)

If you’re pure MERN stack, you can skip this section. But a lot of our back-end projects prefer SpringBoot. So, for Java versions, I prefer to use jEnv to manage the options.

a) Download the desired versions.

Java JDKs are recommended here:

I recommend the following:

  • Latest Release (13.0.1 at time of writing)
  • Current LTS (11.0.5 at time of writing)
  • 8

All these can be found at the link above. Note that for older versions, you will have to log in with a free Oracle account. After you install the package, you can verify successful installation by browsing your hard drive like so:

This will be helpful later when you need to copy/paste the path into jEnv.

One final note: after you install the package, the installer will give you the option to delete the package. I recommend keeping it around, just in case.

b) Install and Configure jEnv

Back in our terminal, run:

brew install jenv

Then, you’ll need to add the following lines to your .zshrc file:

export PATH="$HOME/.jenv/bin:$PATH"
eval "$(jenv init -)"

Restart iTerm.

Following the jEnv documentation here, I’m going to add my three new Java versions one at a time. The command to add Java 8 from my machine is:

jenv add /Library/Java/JavaVirtualMachines/jdk1.8.0_231.jdk/Contents/Home

Now, you can set a preferred local (folder only) or global (entire system) version:

jenv global oracle64-11.0.5

You can view available JDKs by typing:

jenv versions

Restart iTerm one more time, and confirm you’re running the desired versions by typing:

java --version

10. Install Flycut (Recommended)

How many times have you copied something to your clipboard, expecting to use it later, but accidentally copied something else, lost the original code, and had to cmd + z your way back? No more!

brew cask install flycut

Flycut installs in your Menu Bar for easy use.

Note: You will have to enable Flycut in the accessibility section.

11. Install Spectacle (Recommended)

Spectacle is the best tool to move and resize Windows on a mac. And best part is, it’s free!

brew cask install spectacle

Note: You will also have to enable Spectacle in the accessability section.

Once you’ve got it installed, it’s time to configure. Here is my preferred setup:

The three commands I use the most are:

ctl + opt + cmd + F — makes any window full screen

ctl + opt + cmd + Right Arrow — moves windows to the right in increments (press once for half, press twice for 2/3, press three times for 1/3)

ctl + opt + cmd + Left Arrow — same as Right Arrow, just on the left side of the screen.

12. Install Postman (Recommended)

Postman is my go-to tool for testing APIs on a local machine.

brew cask install postman

Bonus:

I’ll not cover them here, since some may not consider them to be absolutely necessary, but I highly recommend the following:

  • Webstorm by Jetbrains
  • IntelliJ by Jetbrains
  • Customizing Visual Studio Code with a boat-load of add-ons.

Jonathan is a Senior Software Engineer in the Atlanta area. When not cranking out React, he enjoys teaching and traveling.