Home Original page

GitHub - alemesa/mac-setup: Repository for all my configuration settings

This setup is heavily sided to a web development setup specifically React and NodeJS.

This was tested on MacOS High Sierra.

Start

Start Here Please

First thing you need to do, on any OS actually, is update the system! For that: Apple Icon > About This Mac then Software Update....

"Quality of Life" changes:

  • Instal XCode Suite (even if you don't need it anymore you will probably need along the road)
  • Install Google Chrome (Make it default)
  • Remove useless icons from the sidebar
  • Open Preferences and modify these:
    • Trackpad > Tap to click
    • Keyboard > Key Repeat > Fast (all the way to the right)
    • Keyboard > Delay Until Repeat > Short (all the way to the right)
    • TrackPad > More Gestures > Activate "App Expose"
  • Show battery percentage, right click battery

👇🏼 Settings

Fonts

Better Fonts for Development

I like these fonts:

  • FiraCode (free) - link
  • Operator Mono ($200) - link
  • Hack (free) - link

Visit Nerd Fonts They have a long list of good programming fonts (Hot Tip: 🔥)

Operator Mono has cursive ligatures and Fira Code contains operator ligatures, to install just double clicked them and Font Book will open up.

iTerm2

Epic Better Console

  • Download and install iTerm2

  • In iTerm > Preferences..., under the tab General, uncheck Confirm closing multiple sessions and Confirm "Quit iTerm2 (Cmd+Q)" command under the section Closing.

  • In the tab Profiles, create a new one with the "+" icon, and rename it to your first name for example. Then, select Other Actions... > Set as Default. Under the section General set Working Directory to be Reuse previous session's directory. Finally, under the section Window, change the size to something better, like Columns: 125 and Rows: 35.

  • Configure oh-my-zsh with Cobalt2

Paste on a terminal to install Oh-My-Zsh

sh -c "$(curl -fsSL https://raw.githubusercontent.com/robbyrussell/oh-my-zsh/master/tools/install.sh)"

Install Powerline-Fonts

# clone
git clone https://github.com/powerline/fonts.git --depth=1
# install
cd fonts
./install.sh
# clean-up a bit
cd ..
rm -rf fonts

Download Cobalt2-iterm from here

Follow these instructions:

  1. Drop the cobalt2.zsh-theme file in to the ~/.oh-my-zsh/themes/ directory.
  2. Open up your ZSH preferences at ~/.zshrc and change the theme variable to ZSH_THEME=cobalt2.
  3. In iTerm2 access the Preferences pane on the Profiles tab.
  4. Under the Colors tab import the cobalt2.itermcolors file via the Load Presets drop-down.
  5. Under the Text tab change the font for each type (Regular and Non-ASCII) to 'Inconsolata for Powerline'. (Refer to the powerline-fonts repo for help on font installation.)
  6. Refresh ZSH by typing source ~/.zshrc on the command line.

👇🏼 Screenshot of iTerm2 with ZSH + Inconsolata for Powerline

  • Modify starting folder on iTerm/Preferences

Homebrew

Package Manager for OSX

Find the documentation and manual install here Homebrew.

  • Install Homebrew on the terminal
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
  • One thing we need to do is tell the system to use programs installed by Hombrew (in /usr/local/bin) rather than the OS default if it exists. We do this by adding /usr/local/bin to your $PATH environment variable:
echo 'export PATH="/usr/local/bin:$PATH"' >> ~/.bash_profile
  • Install MacOS CLI and sign in to be able to install from the store directly from the console
brew install mas
mas signin mail@mail.com
  • Create a file called brewfile
  • My Brewfile
## Required to install almost every app
tap 'caskroom/cask'

# Essentials
brew 'git'          # Essential
brew 'node'         # Essential comes with npm
brew 'heroku'       # Cloud Based Paas
brew 'git-lfs'      # Git Big Files Transfer
brew 'yarn'         # npm on 💊
brew 'zsh-completions'
brew 'tree'         # Tree Command
brew 'youtube-dl'   # Download Youtube - Udemy

# Browsers
# cask 'google-chrome' # Browser Installed at the beginning
cask 'firefox'       # Browser

# Coding Essentials
cask 'visual-studio-code'   # Awesomeness 🎆 💻 🎆
cask 'github-desktop'       # Git GUI
cask 'sublime-text'         # Ultra fast 🏃

# Design Essentials
cask 'sketch'        # Epic design tool
cask 'noun-project'  # Free icons

# MAC Quality of life
cask 'rocket'        # Emojis on 💊
cask 'alfred'        # Spotlight on 💊
cask 'spectacle'     # Windows Rearrangment

# Utilities
cask 'spotify'       # Music
cask 'slack'         # Chat - Work
cask 'discord'       # Chat - Games
cask 'whatsapp'      # Chat - Personal
cask 'flux'          # Eyes Health
cask 'adobe-acrobat-reader'    # PDF Reader
cask 'transmission'  # Torrents Manager   
cask 'postman'       # Api Requests
cask 'calibre'       # E-Books Manager

# Cloud
cask 'dropbox'                 # Dropbox Cloud  
cask 'google-backup-and-sync'  # Google Cloud

# Coding Utilities
cask 'sequel-pro'    # SQL
cask 'vlc'           # Videos
cask 'filezilla'     # FTP

# Others
mas 'Amphetamine' id: 937984704 # Stop Mac from sleeping
mas 'Parcel - Delivery Tracking' id: 639968404 # Delivery Tracking
mas 'Pocket', id: 568494494 # Saved articles
mas 'Skitch - Snap. Mark up. Share.', id: 425955336 # Markup tools
mas 'Dr. Cleaner: Disk,Memory,System Optimizer', id: 921458519 # Clean memory and space 
mas 'GIPHY Capture. The GIF Maker', id: 668208984 # Capture Gifs + Captions
mas 'Trello', id: 1278508951 # Task Manager

Feel free to add or remove apps

Find the apps either on the Cask Search Website or use this on the console

brew cask search <package>

or use this to find apps with Mas on the console

  • Install everything by running this

Bash

Bash_Profile

  • Create a .bash_profile
  • Brewup

Add useful alias

alias brewup='brew update; brew upgrade; brew prune; brew cleanup; brew doctor'

Restart bash profile and run brewup

source ~/.bash_profile
brewup

Now you can run every often and it will update homebrew packages

Git

Configure Git and Aliases

touch ~/.gitconfig
git config --global user.name "First Last"
git config --global user.email "Email"
git config --global credential.helper osxkeychain

Typical .gitconfig will look like this, be free to remove aliases

[user]
    name = First Last
    email = email@email.com
[github]
    user = username
[alias]
    a = add
    ca = commit -a
    cam = commit -am
    s = status
    pom = push origin master
    pog = push origin gh-pages
    puom = pull origin master
    puog = pull origin gh-pages
    cob = checkout -b
[credential]
    helper = osxkeychain

Generate a new SSH Key

ssh-keygen -t rsa -C "your_email@example.com"

Add the key to your Github Account

Add the DS_Store to your gitignore

# specify a global exclusion list
git config --global core.excludesfile ~/.gitignore
# adding .DS_Store to that list
echo .DS_Store >> ~/.gitignore

Or add this gitignore file mantained by Github to your gitignore

I also like to keep my alias on the .zshrc file

Open ~/.zshrc with code ~/.zshrc

Restart with source ~/.zshrc

These are my aliases

alias zshconfig="code ~/.zshrc" # Modify this file
alias bashconfig="code ~/.bash_profile"
alias cd..="cd .." # Most Important Alias
alias batcave="cd ~/Dropbox/batcave" # Side Projects
alias jobcave="cd ~/Projects" # 8hrs Job Projects
alias rm="trash"
alias gitlog="git log --oneline --decorate --all --graph"
alias brewup='brew update; brew upgrade; brew prune; brew cleanup; brew doctor' # Quick House Cleaning
alias youtube-dl='youtube-dl -o "%(title)s.%(ext)s' # Donwload without id
alias python="python3"
alias pip="pip3"
alias herokupush="git commit -am 'updating';git push; git push heroku master"

VSCode

Best Code Editor

The most effective way to do this is by using Settings-Sync Extension, if you haven't I highly recommend it, they way it works is by saving all your config which includes your settings, plugins, themes and snippets into your Github gist and then pulls all the data and install everything.

  • Using Settings-Sync Extension

Find my config here including the UserSettings.json

Open VSCode and type "shell command" and add to the PATH. Close VSCODE, restart Terminal , now you can use any project with this

I like many themes for VSCode but my favorite is Sublime Material Theme

👇🏼 Screenshot of Visual Studio Code with Sublime Material Theme + Operator Mono

  • Manually Installing Plugins

Some extensions I can't live without:

  1. Seti Icons
  2. Auto-Open Markdown Preview
  3. Color Highlight
  4. ESLint
  5. Guides
  6. Import Cost
  7. npm Intellisense
  8. Prettier
  9. Sublime Babel
  10. Terminal

Themes I like besides Sublime Material Theme

  1. Dracula
  2. Cobalt2

Sublime

Second Best Code Editor

  • Install Package Manager

Go here

  • Follow this guide to install theme and plugins

  • Install Babel for React syntax

  • Be able to open sublime from the command line

    • Paste this on the command line
ln -s "/Applications/Sublime Text.app/Contents/SharedSupport/bin/subl" /usr/local/bin/sublime
  • Fonts:
    • Operator Mono

👇🏼 Screenshot of Sublime Text 3 + Operator Mono + Material Theme

MySQL

...Database...

  • To install, run:
brew update # Always good to do
brew install mysql
  • Setup MySQL
unset TMPDIR
mkdir /usr/local/var
mysql_install_db --verbose --user=`whoami` --basedir="$(brew --prefix mysql)" --datadir=/usr/local/var/mysql --tmpdir=/tmp
  • Usage To start the MySQL server, use the mysql.server tool:
mysql.server start # start server
mysql.server stop  # stop server
mysql.server --help # find other commands
mysql -uroot # connect with the command-line client
exit # to quit the shell

Node

  • Install Node
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.1/install.sh | bash
nvm install node
nvm use node
node -v
  • Add to path

To do so, add this line to your ~/.path file, before the export PATH line:

PATH=/usr/local/share/npm/bin:$PATH

npm Usage

npm Commands:

npm install <package>    # Install locally
npm install -g <package> # Install globally
npm install <package> --save # Save to a package.json file
npm list                # What's installed Locally
npm list -g             # what's installed Globally
npm outdated [-g]       # Find outdated packages    
npm update [<package>]  # Upgrade particular package
npm uninstall <package> # Uninstall Packages

npm Goodies

  • Gulp
npm install --global gulp-cli
  • Surge
  • To deploy a project
  • trash Instead of using rm -r something do trash something, and it will remove it to the trash folder, this is way more safe. You can add an alias too like this:

Ruby

Let's install Jekyll for Github Pages

gem install jekyll # might need to run it with sudo
bundle update jekyll
gem update jekyll

To start a project

jekyll build # current folder will get generated inside ./_site
jekyll serve # start development

Mongo

Follow this guide

Slack

  • Preferences → Sidebar Theme
  • Cobalt2 => Paste #193549,#FFC600,#1D425D,#FFFFFF,#FFC600,#FFFFFF,#FFC600,#FFC600
  • Gartland => #404040,#696969,#FFD200,#000000,#000000,#FFFFFF,#00703C,#EF4C23

Alfred

  • Make Alfred substitute for Spotlight
  • Install this theme if you have the Powerpack (£19)

DevToolsAuthor

Follow this guide and then select a theme on the Author Settings tab inside the Chrome Dev Tools. I'm using the Default Theme with Fira Code font and 13px size. Small change but it makes the code more readable.

Others

  • Show hidden files, paste this on the command line
defaults write com.apple.finder AppleShowAllFiles YES
  • Show path bar
defaults write com.apple.finder ShowPathbar -bool true
  • Show status bar
defaults write com.apple.finder ShowStatusBar -bool true

Python

Raspberry Fun

It also installed pip (and its dependency Setuptools), which is the package manager for Python. Let's upgrade them both:

$ pip install --upgrade setuptools
$ pip install --upgrade pip
  • If pip is not installed use this:
  • To install packages with pip use:
sudo pip install foo_package --user # this will install the package on the user folder, instead that the root folder

Heroku

Heroku is a Platform-as-a-Service (PaaS) that simplifies deploying your apps online.

Installation

Assuming that you have an Heroku account (sign up if you don't), let's install the Heroku Client for the command-line using Homebrew.

brew install heroku/brew/heroku
npm install -g heroku-cli

The formula might not have the latest version of the Heroku Client, which is updated pretty often. Let's update it now:

Don't be afraid to run heroku update every now and then to always have the most recent version.

Setup

Login to your Heroku account using your email and password:

If this is a new account, and since you don't already have a public SSH key in your ~/.ssh directory, it will offer to create one for you. It will also upload the key to your Heroku account, which will allow you to deploy apps from this computer.

If it didn't offer create the SSH key for you (i.e. your Heroku account already has SSH keys associated with it), you can do so manually by running:

mkdir ~/.ssh
ssh-keygen -t rsa

Keep the default file name and skip the passphrase by just hitting Enter both times. Then, add the key to your Heroku account:

Usage

Once your keys are in place and you are authorized, you're ready to deploy apps. Heroku has a getting started guide. Heroku uses Git to push code for deployment, so make sure your app is under Git version control.

A cheat sheet for deployment:

cd myapp/
heroku create myapp
git push heroku master
heroku ps
heroku logs -t

The Heroku Dev Center is where you will find more information.

Thanks

Inspired by these posts: