My opinionated checklist for getting my Mac up and running for web-based projects and graphic design.
Table of Contents
Open Terminal and paste this line to view hidden files:
defaults write com.apple.finder AppleShowAllFiles TRUE && killall Finder
If you'd like, add a few spaces to the Dock to group Apps, 'cuz its nicer.
defaults write com.apple.dock persistent-apps -array-add '{"tile-type"="spacer-tile";}' && killall Dock
Download and install Xcode from the App Store, open, agree to the terms, close. Next, open Terminal and install the Command Line Tools:
xcode-select --install
To make updating easier, you'll need a package manager for things like Node, Git, etc.
Install Homebrew:
ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
And just because, run this afterwards:
brew update && brew doctor
Install gems and brew dependencies as needed (ex: rbenv).
next create and edit your bash profile:
touch .bash_profile && open -e .bash_profile
add the Homebrew location to your $PATH with this line:
export PATH="/usr/local/bin:$PATH"
save and close, and finally, reload using:
. .bash_profile
Install Node & NPM with Homebrew:
brew install node
Change permissions for macOS:
sudo chown -R $(whoami) $(npm config get prefix)/{lib/node_modules,bin,share}
Install Gulp via NPM and other node packages as needed (grunt, bower, etc.).
TIP 1: Updating:
brew update
brew doctor
brew upgrade --all
TIP 2: Updating NPM outside of Homebrew:
npm install -g npm@latest
If you have list of applications you need and don't feel like downloading and installing them manually, try Homebrew Cask. If you prefer to do it the manual way, read on.
Install iTerm2 and then install Oh My Zsh via curl.
Colors:
Download base16 Ocean Dark iTerm colors, go to iTerm > Preferences > Profiles > Colors > Load Presets > Import
, upload the base16 file and select it as your preset.
Fonts:
Browse to Powerline-patched fonts and follow the installation instructions, go to iTerm > Preferences > Profiles > Text > Change Font
and change both fonts to "Source Code Pro for Powerline".
Finally, in ~/.zshrc
switch the theme declaration to:
ZSH_THEME="agnoster"
Relaunch if necessary to see your changes and check if the icons are working using this command:
echo "\ue0b0 \u00b1 \ue0a0 \u27a6 \u2718 \u26a1 \u2699"
If the icons don't align perfectly, adjusting the Non-ASCII Font size is simpler than trying to fix font baselines.
TIP: Want to use the commands showFiles
and hideFiles
to quickly toggle hidden files on or off? Add these lines to the end of ~/zshrc
:
# Show or hide hidden files quickly
alias showFiles='defaults write com.apple.finder AppleShowAllFiles YES; killall Finder /System/Library/CoreServices/Finder.app'
alias hideFiles='defaults write com.apple.finder AppleShowAllFiles NO; killall Finder /System/Library/CoreServices/Finder.app'
TIP: Add autocompletion to repetitive commands by adding your preferred zsh plugins:
# Add wisely, as too many plugins slow down shell startup.
plugins=(brew git git-flow npm sublime)
Install Sublime Text 3 and Package Control.
Open Preferences > Settings - User
and update the settings to include:
"close_windows_when_empty": true,
"draw_white_space": "all",
"highlight_line": true,
"trim_trailing_white_space_on_save": true,
"word_wrap": "true"
TIP: Don't use a trailing comma on the last item.
Theme & Color Scheme:
Spacegrey Theme - follow the github link and follow the README file to install the theme, then open Preferences > Settings - User
and add these Spacegrey settings:
"color_scheme": "Packages/Theme - Spacegray/base16-ocean.dark.tmTheme",
"font_face": "Source Code Pro for Powerline",
"spacegray_sidebar_font_small": true,
"spacegray_sidebar_tree_small": true,
"theme": "Spacegray.sublime-theme"
Sublime Packages: Install via Package Manager:
- Alignment
- ApacheConf.tmLanguage
- BracketHighlighter
- CSScomb
- DocBlockr
- Emmet
- Handlebars
- jQuery
- JsFormat
- LESS
- Markdown Preview
- Nettuts+ Fetch
- SCSS
- SideBarEnhancements
- SublimeCodeIntel
- SublimeLinter
- SublimeLinter-csslint - Run prior to installation:
npm install -g csslint
- SublimeLinter-jshint - Run prior to installation:
npm install -g jshint
- SublimeLinter-php
TIP: Want to use Sublime from the command line? Add these lines to the end of ~/zshrc
:
# Sublime aliases
alias subl='/Applications/Sublime\ Text.app/Contents/SharedSupport/bin/subl'
alias zshconfig="subl ~/.zshrc"
For unlimited FREE public repositories:
- Account: GitHub
- App: GitHub Mac
For unlimited FREE private repositories:
- Account: Bitbucket
- App: SourceTree
Other useful Applications & Tools not mentioned above: