Setting up an M1 MacBook Pro for Frontend Development

Install Xcode from the App Store and accept the default options. Install Xcode Command Line Developer Tools (don’t need Xcode installed first for that) xcode-select --install Install Homebrew

mkdir homebrew && curl -L https://github.com/Homebrew/brew/tarball/master | tar xz --strip 1 -C homebrew

brew install –cask visual-studio-code opera iterm2

Install Rosetta. WhatsApp prompted me and installed automatically, but you can manually install using the following command:

1softwareupdate --install-rosetta

DESIGN

• Sketch
• Photoshop
• Illustrator
• Figma

DEVELOP

• VS Code
• Sublime Text
• Slack
• Chrome
• Opera
• Android Studio
• iTerm

Homebrew

Wget

1brew install wget fastlane tree

• wget so that i don’t have to edit command between Linux and macOS
• fastlane for automating my app releases
• tree for listing files & dirs in a tree structure

Others Logitech Options

Python 3 NVM, Node

Change location for screenshots

Create .zprofile (and .zshrc ?)

=> Profile not found. Tried ~/.bashrc, ~/.bash_profile, ~/.zshrc, and ~/.profile.

Otherwise stuff like nvm or brew after you install them will keep saying command not found, because it won’t add commands to $PATH in a file that doesn’t exist

 1touch ~/.zshrc ~/.zprofile
 2
 3# NVM
 4curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh | bash
 5
 6export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")"
 7[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm
 8
 9nvm install --lts
10
11# Homebrew
12#/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install.sh)"
13mkdir homebrew && curl -L https://github.com/Homebrew/brew/tarball/master | tar xz --strip 1 -C homebrew

Shopify

1brew tap shopify/shopify
2brew install themekit

Browsers

• Chrome
• Brave
• Vivaldi
• Edge
• Opera
• Chromium brew install --cask chromium

React Native

• Flipper
• fastlane

Setup for iOS needs:

• Node
• Watchman brew install watchman
• Xcode
• Xcode Command Line Tools xcode-select --install
• CocoaPods sudo gem install cocoapods

1# node will be installed with NVM
2brew install watchman
3
4# install CocoaPods
5#sudo gem install cocoapods
6brew install cocoapods

1gem install fastlane bundler cocoapods git

• installing git with Homebrew as well because the one on Big Sur is outdated (2.24.3 (Apple Git-128) when the latest is 2.30.1)

iOS

• Install JDK 8 brew install --cask adoptopenjdk/openjdk/adoptopenjdk8
• Install Android Studio
• Install Android Emulator for M1

Set up SSH keys

• Create ~/.ssh directory and add ~/.ssh/config
• Generate a key using the ED25519 type
• Load key and update key so that it automatically loads it every time

ref

1mkdir ~/.ssh
2cd ~/.ssh
3
4ssh-keygen -t ed25519 -C "your_email@example.com"

 1# Load key
 2touch ~/.ssh/config
 3
 4echo "Host *
 5  AddKeysToAgent yes
 6  UseKeychain yes
 7  IdentityFile ~/.ssh/SSH_KEY" >> ~/.ssh/config
 8
 9eval "$(ssh-agent -s)"
10ssh-add -K ~/.ssh/SSH_KEY

Customize ZSH

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

Configure Git

1git config --global user.email "you@example.com"
2git config --global user.name "Your Name"

Misc. Tools

Rectangle for window resizing and snapping. Used to use Spectacle before, but that is no longer being maintained.

1brew install --cask rectangle

tmux

Docker

Similar to Android Emulator, an Apple M1 Tech Preview is available. download build 60984. Docker Desktop is built with Go, and the Go language will support Apple Silicon in their 1.16 release which is targeted for February 2021.

You also have to install Rosetta 2

1softwareupdate --install-rosetta

Make sure you run this command in a Terminal that is not set to Open using Rosetta. I have both the default Terminal and iTerm2 installed. iTerms is set to Open using Rosetta, whereas the default Terminal opens without Rosetta.