Development and productivity tools on Mac 👩‍💻 👨‍💻
Tags: mac, brew, setup
Published: 2020-07-24 09:57:31

Hello everyone ! 👋

I recently had to re-install my development environment on Mac. I took the opportunity to sort out the utilities & software that I use on a daily basis. So I share with you this list of tools that allow me to be productive!

## How

We will first install [Brew] (https://brew.sh/index_fr), then we will configure our new terminal ([iterm2] (https://www.iterm2.com/)).
Then we will install some interesting extensions of [visual studio code] (https://code.visualstudio.com/).

## Brew

[Brew] (https://brew.sh/index_fr) is a package manager for mac. It allows you to install command line programs as well as graphics programs. I offer you a small list of utilities & software that I use daily.

```bash
brew install \
  nvm # node version manager
  nmap # network utils
  curl # make resquests via terminal
  jsonpp # json pretty print
  imagemagick # image utils
  catimg # cat image in terminal
  dive # inspect docker images
  git # Source Control Manager
```

```bash
brew cask install
  cakebrew # homebrew GUI
  google-chrome	# web browser
  visual-studio-code # IDE
  imageoptim # optimize pictures utils
  mtmr # touchbar utils
  postman # request API utils
  graphiql # same as postman, but specific for graphql
  docker # Docker desktop
  iterm2 # Alternative terminal
  psequel	# Postgres GUI interface
```

## Iterm2 configuration

[Oh my zsh] (https://ohmyz.sh/) is an open source framework that allows you to easily manage your zsh configuration. You can install themes, plugins ...

### Setup

Open Iterm2, and install [oh my zsh](https://ohmyz.sh/).

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

 then advise you to install the "Powerline Fonts" fonts ([here] (https://github.com/powerline/fonts))

You will then have to change the preferences and themes directly on iterm2 ("session" menu) to choose a theme that you like with a "Powerline Fonts" font.

## Vscode configuration

### Install extensions

You will find here several types of extensions:

- Support for languages & snippets (jsx, toml, js, react, rails)
- Themes & graphic enhancement (material theme, bracket pair colorizer, LogFileHighlighter, rainbow-csv, ...)
- Productivity (json-pretty-printer, vscode-eslint, guides, vscode-wakatime, ...)
- git utilities (gitlens, git-graph)
- New features (gc-excelviewer, vscode-docker, vsliveshare, ...)

File: `vs_code_extensions_list.txt`

```bash
blanu.vscode-styled-jsx
bungcip.better-toml
CoenraadS.bracket-pair-colorizer
DavidAnson.vscode-markdownlint
dbaeumer.vscode-eslint
eamodio.gitlens
emilast.LogFileHighlighter
Equinusocio.vsc-community-material-theme
Equinusocio.vsc-material-theme
equinusocio.vsc-material-theme-icons
euskadi31.json-pretty-printer
esbenp.prettier-vscode
formulahendry.auto-rename-tag
GrapeCity.gc-excelviewer
HookyQR.beautify
Hridoy.rails-snippets
karigari.chat
kisstkondoros.vscode-gutter-preview
mechatroner.rainbow-csv
mhutchie.git-graph
mikestead.dotenv
ms-azuretools.vscode-docker
MS-CEINTL.vscode-language-pack-fr
ms-vsliveshare.vsliveshare
ms-vsliveshare.vsliveshare-audio
ms-vsliveshare.vsliveshare-pack
slevesque.vscode-zipexplorer
spywhere.guides
TabNine.tabnine-vscode
WakaTime.vscode-wakatime
wix.vscode-import-cost
xabikos.JavaScriptSnippets
xabikos.ReactSnippets
```

First, run vscode & install vscode in the **PATH** ([more info here] (https://code.visualstudio.com/docs/setup/mac))

Then, create the file `vs_code_extensions_list.txt` with the contents of the extensions. Then run the following command, which will install the extensions listed in this file.
```bash
cat vs_code_extensions_list.txt | xargs -n 1 code --install-extension
```

### Vscode settings configuration

Here is an excerpt from my `settings.json` file, which you can use to configure your IDE & extensions.

```json
{
  "window.zoomLevel": 1,
  "breadcrumbs.enabled": true,
  "workbench.colorTheme": "Dracula",
  "editor.fontSize": 15,
  "editor.tabSize": 2,
  "editor.wordWrap": "on",
  "editor.formatOnSave": true,
  "editor.formatOnPaste": true,
  "editor.wordWrapColumn": 100,
  "editor.minimap.enabled": false,
  "editor.smoothScrolling": false,
  "editor.minimap.showSlider": "mouseover",
  "editor.minimap.maxColumn": 120,
  "editor.cursorStyle": "block",
  "editor.cursorBlinking": "phase",
  "editor.insertSpaces": true,
  "terminal.external.osxExec": "iTerm.app",
  "terminal.integrated.shell.osx": "zsh",
  "files.associations": {
    "*.inky": "slim",
    "*.js": "javascriptreact"
  },
  "files.exclude": {
    "**/.git": true,
    "**/.svn": true,
    "**/.hg": true,
    "**/CVS": true,
    "**/.DS_Store": true
  },
  "files.watcherExclude": {
    "**/.git/objects/**": true,
    "**/.git/subtree-cache/**": true,
    "**/node_modules/*/**": true
  },
  "[ruby]": {
    "editor.defaultFormatter": "jnbt.vscode-rufo"
  },
  "[json]": {
    "editor.defaultFormatter": "HookyQR.beautify"
  },
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[javascriptreact]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[html]": {
    "editor.defaultFormatter": "HookyQR.beautify"
  },
  "[jsonc]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "gitlens.views.repositories.location": "gitlens",
  "gitlens.views.fileHistory.location": "gitlens",
  "gitlens.views.lineHistory.location": "gitlens",
  "gitlens.views.compare.location": "gitlens",
  "gitlens.views.search.location": "gitlens",
  "gitlens.advanced.messages": {
    "suppressLineUncommittedWarning": true
  },
  "files.autoSave": "off",
  "guides.enabled": false,
  "diffEditor.renderSideBySide": true,
  "extensions.ignoreRecommendations": false,
  "javascript.updateImportsOnFileMove.enabled": "always",
  "git.confirmSync": false,
  "workbench.statusBar.visible": true,
  "git-graph.maxDepthOfRepoSearch": 2,
  "git.showPushSuccessNotification": true,
  "tabnine.experimentalAutoImports": true,
  "auto-rename-tag.activationOnLanguage": [
    "*"
  ],
  "terminal.integrated.fontFamily": "Roboto Mono for Powerline",
  "scm.inputFontFamily": "Roboto Mono for Powerline"
}
```

And There you go ! 👏

Do not hesitate to suggest tools that are useful to you on a daily basis!

## Resources and useful links
 
- [Brew](https://brew.sh/index_fr)
- [Iterm2](https://www.iterm2.com/)
- [Oh my zsh](https://ohmyz.sh/)
- [Cakebrew](https://www.cakebrew.com/)
- [MTMR](https://github.com/Toxblh/MTMR)
- [ImageOptim](https://imageoptim.com/fr)
- [Docker](https://www.docker.com/)
- [Google Chrome](https://www.google.com/intl/fr_fr/chrome/)
- [Postman](https://www.postman.com/)
- [Psquel](http://www.psequel.com/)
- [Visual Studio Code](https://code.visualstudio.com/)
- [Powerline Fonts](https://github.com/powerline/fonts)
- [My personal website](https://demily-clement.com)