MacOS Setup

This post documents my current macOS development environment, tools, configurations, and CLI utilities I use regularly. It serves as a personal install guide when setting up a new Mac for development, and will be updated as needed.

⚠️ Some snippets are adapted from other devs' posts. References are listed at the end.

System Essentials

Homebrew

First install Homebrew package manager. This will allow you to install almost any app from the command line.

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

Make sure everything is up to date.

Copy
brew update

Core apps

Install essential GUI apps:

Copy
brew install --cask \
  visual-studio-code \
  google-chrome \
  firefox \
  rectangle \
  docker \
  spotify \
  notion \

Run rectangle at startup

  1. Nav to Settings > General > Login Items
  2. Add apps to the list

Git Configuration

Set Git Global Configuration

Create or update your global .gitconfig:

Copy
touch ~/.gitconfig

Add config to the file

Copy
[user]
  name   = Your Name
  email  = your_email@example.com
[github]
  user   = username
[alias]
  a      = add
  cm     = commit -m
  s      = status
  p      = push
  co     = checkout
  fp     = fetch --prune --all
  l      = log --oneline --decorate --graph
[push]
	autoSetupRemote = true

Terminal Setup

Oh My Zsh

Install Oh My Zsh for terminal customization:

Copy
sh -c "$(curl -fsSL https://raw.github.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"

Set theme and other Zsh options in ~/.zshrc file

Copy
# [OH MY ZSH]
# -----------

# If you come from bash you might have to change your $PATH.
# export PATH=$HOME/bin:$HOME/.local/bin:/usr/local/bin:$PATH

# Path to your Oh My Zsh installation.
export ZSH="$HOME/.oh-my-zsh"

# Set name of the theme to load --- if set to "random", it will
# load a random theme each time Oh My Zsh is loaded, in which case,
# to know which specific one was loaded, run: echo $RANDOM_THEME
# See https://github.com/ohmyzsh/ohmyzsh/wiki/Themes
ZSH_THEME="gnzh"

...

Preview:

terminal theme

Command Line Tools

trash-cli

Avoids using rm that remove files permanently. Instead use trash to move to the bin

Copy
brew install trash-cli

Node Version Manager (NVM)

Use Node Version Manager (nvm) to install Node.js. This allows you to easily switch between Node versions, which is essential.

Copy
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.1/install.sh | bash

Make sure nvm is added to ~/.zshrc file for initialization on startup

Copy
# [NVM]
# -----
# Add NVM initialization to .zshrc
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"  # This loads nvm

CF

Install the Cloud Foundry CLI to work with SAP BTP:

Copy
brew install cloudfoundry-cli

GitHub CLI

Install

Copy
brew install gh

VS Code Configuration

This is my current VS Code configuration and the list of extensions.

Enable 'code' Shell Command

  1. Open Command Palette (⇧⌘P)
  2. Type Shell Command: Install 'code' command in PATH

Extensions

List of used extensions


Install them all via CLIs

Copy
code --install-extension dbaeumer.vscode-eslint \
&& code --install-extension eamodio.gitlens \
&& code --install-extension eliostruyf.vscode-front-matter \
&& code --install-extension esbenp.prettier-vscode \
&& code --install-extension github.copilot \
&& code --install-extension github.copilot-chat \
&& code --install-extension humao.rest-client \
&& code --install-extension ms-vscode-remote.remote-ssh \
&& code --install-extension ms-vscode-remote.remote-ssh-edit \
&& code --install-extension ms-vscode.remote-explorer \
&& code --install-extension ms-vsliveshare.vsliveshare \
&& code --install-extension redhat.vscode-xml \
&& code --install-extension sapos.yeoman-ui \
&& code --install-extension saposs.app-studio-remote-access \
&& code --install-extension saposs.app-studio-toolkit \
&& code --install-extension saposs.sap-guided-answers-extension \
&& code --install-extension saposs.vscode-ui5-language-assistant \
&& code --install-extension saposs.xml-toolkit \
&& code --install-extension sapse.hana-database-explorer \
&& code --install-extension sapse.sap-ux-annotation-modeler-extension \
&& code --install-extension sapse.sap-ux-application-modeler-extension \
&& code --install-extension sapse.sap-ux-fiori-tools-extension-pack \
&& code --install-extension sapse.sap-ux-help-extension \
&& code --install-extension sapse.sap-ux-service-modeler-extension \
&& code --install-extension sapse.vscode-cds \
&& code --install-extension sapse.vscode-wing-cds-editor-vsc \
&& code --install-extension yoavbls.pretty-ts-errors

User Settings

Open the settings.json file

Copy
code /Users/I537744/Library/Application\ Support/Code/User/settings.json

Paste settings

Copy
{
  "security.workspace.trust.untrustedFiles": "open",
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "notebook.defaultFormatter": "esbenp.prettier-vscode",
  "prettier.configPath": "/Users/I537744/Library/Application Support/Code/User/profiles/.prettierrc.js",
  "editor.tabSize": 2
}

Global Prettier profile

Add prettier profile

Copy
mkdir /Users/I537744/Library/Application\ Support/Code/User/profiles
touch /Users/I537744/Library/Application\ Support/Code/User/profiles/.prettierrc.js

Add content to the file

Copy
module.exports = {
  arrowParens: 'avoid',
  bracketSpacing: true,
  htmlWhitespaceSensitivity: 'css',
  insertPragma: false,
  jsxBracketSameLine: false,
  jsxSingleQuote: true,
  printWidth: 80,
  proseWrap: 'always',
  quoteProps: 'as-needed',
  requirePragma: false,
  semi: false,
  singleQuote: true,
  tabWidth: 2,
  trailingComma: 'all',
  useTabs: false,
}

Sources