Setup máy Mac cho web development

Setup máy Mac cho web development

01-01-2019    

Nếu chỉ cần setup để code những trang static cơ bản, thì chỉ cần Chrome và Notepad là đủ :smile:, tuy nhiên tui làm việc khá nhiều với các build script, build tools và terminal nữa, việc setup máy sẽ phức tạp hơn tí.

HomeBrew

Nếu đã quen với những apt hay yum bên Linux rồi thì với macOS chúng ta có brew, giúp cài, update và xoá các software package một cách dễ dàng và nhanh chóng thông qua bộ CLI của nó.

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

Terminal

iTerm2

Terminal là cái tiếp theo mà tui nghĩ đầu tiên khi setup máy mới, terminal cần tất cả các thao tác liên quan tới Git, các lệnh chạy build task. Vì cái terminal mặc định của Mac khá là sida nên tui sẽ quyết định cài 2 cái terminal shell khác ở đây là iTerm2 (cái này khá là phổ biến rồi).

Alacritty

Ngoài ra các thao tác với neovim hơi nặng một tí tui sẽ dùng Alacritty - đây là một cái terminal emulator viết bằng Rust (nghe là biết chạy nhanh rồi :sweat_smile:), dùng GPU để tăng tốc render, vì thế nếu xài với neovim sẽ rất nhanh. Thằng này thì tính custom khá cao, tuy nhiên thiếu đi mất vài tính năng cơ bản như Tab, vì thế nếu muốn dùng tab trong này thì phải xài Tmux :smirk:, hơi lằng nhằng một tí.

Shell: ZSH với Oh My Zsh

Oh My Zsh will not make you a 10x developer…but you might feel like one. :smirk:

Xài terminal mà không có Zsh thì chán lắm, ở dây tui xài với Oh My Zsh, cũng khá phổ biến thôi. Xài zsh làm cho việc gõ command trên terminal nhanh hơn, tiện hơn với nhiều utils hay và alias nữa, ngoài ra cũng giúp bạn gõ lệnh trông ngầu hơn :smirk:.

Ngoài ra, tui xài chung Oh My Zsh với theme SpaceShip và một số plugin cơ bản khác.

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

Xài theme custom thì cài thêm font SourceCode Pro nữa, có thể cài qua HomeBrew:

brew tap homebrew/cask-fonts && brew cask install font-source-code-pro

SpaceShip

Sau đó sửa config zsh tại ~/.zshrc, đây là phần custom của tui, có xài thêm 1 số plugin khác như suggestion và auto complete:

ZSH_THEME="spaceship"

plugins=(
  git,
  vscode,
)

# Set default username to hide the username in terminal
export DEFAULT_USER=tuhuynh

# Zsh syntax highlighting
source /usr/local/share/zsh-syntax-highlighting/zsh-syntax-highlighting.zsh

# Zsh auto suggest
source /usr/local/share/zsh-autosuggestions/zsh-autosuggestions.zsh

# VSCode config
function code {
    if [[ $# = 0 ]]
    then
        open -a "Visual Studio Code"
    else
        local argPath="$1"
        [[ $1 = /* ]] && argPath="$1" || argPath="$PWD/${1#./}"
        open -a "Visual Studio Code" "$argPath"
    fi
}
export PATH="/usr/local/opt/gettext/bin:$PATH"

[ -f ~/.fzf.zsh ] && source ~/.fzf.zsh

# Maven config
export PATH="/usr/bin:/bin:/usr/sbin:/sbin:$PATH"

# Custom Go path
export GOPATH=/Users/tuhuynh/Desktop/Golang/
export PATH=$PATH:$GOPATH/bin

# Export MySQL path
export PATH=$PATH:/usr/local/mysql/bin

# Yarn global
export PATH="'yarn global bin':$PATH"

# Unset the docker environment variable
unset DOCKER_HOST

# The next line updates PATH for the Google Cloud SDK.
# if [ -f '/Users/tuhuynh/Downloads/google-cloud-sdk/path.zsh.inc' ]; then . '/Users/tuhuynh/Downloads/google-cloud-sdk/path.zsh.inc'; fi

# The next line enables shell command completion for gcloud.
# if [ -f '/Users/tuhuynh/Downloads/google-cloud-sdk/completion.zsh.inc' ]; then . '/Users/tuhuynh/Downloads/google-cloud-sdk/completion.zsh.inc'; fi

# AWS Python CLI
export PATH=~/Library/Python/2.7/bin/:$PATH

Git, Docker và Node.js

Đương nhiên để code thì phải có 3 thằng này rồi :smile:, quá ez với brew:

brew install docker
brew install node
brew install git

Ngoài ra, tui xài yarn thay cho npm vì nó nhanh hơn và ít lỗi hơn:

npm install yarn -g

Code Editor

Visual Studio Code

Tui chọn xài VSCode vì nó nhanh (tất nhiên không nhanh bằng Sublime Text hay Vim), có nhiều utils, plugin và được support tốt từ community, update đều đặn. Integrate tốt với hầu hết mọi ngôn ngữ (tui đang xài VSCode để code JS, TS và Go luôn, Java cũng được nhé :smile:).

Tài Visual Studio Code

Vim với NeoVim

Tui chỉ đang mới học xài Vim thôi, nên phần này để dành update sau nha :smile:.

Browser

Chốt: Google Chrome với Chrome Dev Tool vẫn là ngon nhất :smile:.

Dotfile

Ngoài ra để cho nhanh (khỏi phải config), các bạn có thể tìm và xài các bộ dotfile đã được viết sẵn tại đây.