MacBook setup for web developmentUpdated: January 29, 2023
My MacBook setup for web development includes tools like: Homebrew, Brave, Visual Studio Code, Hyper with Oh My Zsh, Git, Node/npm and ESLint.
Install Homebrew as a package manager for macOS:
Update everything in Homebrew to the latest version:
Install GUI applications (Homebrew formulae):
Install terminal applications:
Brave (web dev browser): when I need to test something on Chromium.
Visual Studio Code (web dev IDE): login with personal GitHub account and import preferences (vscode.json and my-vs-code-extensions).
Hyper (terminal): config for .hyper.js.
Oh My Zsh
Oh My Zsh for a better terminal experience:
Update everything in
Oh My Zsh to the latest version:
Important: If you change something in your Zsh configuration (
.zshrc), you have to restart it:
af-magic as a new theme for your terminal:
Make it the default theme for
Oh My Zsh:
As a font we will be using
Inconsolata for Powerline in Hyper and VS Code.
First install the Casks fonts for the Homebrew Cask project:
Then, install the desired font:
Use the new font in Hyper by adding to the
config object in
fontFamily: 'Inconsolata for Powerline'.
If the theme and font changes do not apply, reload your Zsh configuration (
.zshrc) or close/open Hyper.
Use the new font in Visual Studio Code:
settings.jsonin VS Code by pressing
⌘ + ,
- look to the right for a button to
Open Settings (JSON)
- paste these
Zsh configuration file (
.zshrc): copy and paste from the local file.
From the terminal, set the global
Configure Git to use VS Code as default editor:
Print global git configuration:
NVM for Node/npm
The Node Version Manager (NVM) is used to install and manage multiple versions of Node. After installing it via Homebrew in a previous step, type the following commands to complete the installation:
Restart Zsh config:
Now install the latest
Node LTS version:
Next, check if the installation was successful and if the node package manager (npm) was installed along the way:
Update npm to its latest version:
If you want to list all your installations of
Node.js, type the following:
If you want to install a newer version of
My ESLint rules are included in my dotfiles repo and the config package is installed via npm.