/dev-enviroment

Doc to log environment setup AND useful & fun resources for development

The below dev environment is set up for Mac.

My Current OS:

  • macOS Big Sur 11.7.6

My Current Hardware:

  • iMac Retina 5k Late 2015
  • MB Air Retina 13-inch 2018

Xcode

  • You have two options for installing xcode. The full package or just the command line tools but at a minimum the command line tools are required.
  • Install just the xcode command line tools with:
  • xcode-select --install -or-
  • Go to the app store and download the full package. The full package is great for if you do any sort of mobile development.

Bash-it

Yonce theme (for Bash-it, Slack, VS Code)

From the awesome Mina Markham! https://github.com/minamarkham/yonce

Manual Download Applications

Pre Install Configuration

  • Setup SSH Key
  • Setup SSH Key on GitHub
  • Setup SSH Key on Digital Ocean

iTerm2

Nano

  • Take 5 minutes to learn the nano text editor and save yourself the hassle of learning VIM (for now)

VIM

  • Learn how to get out of vim use the following:
  • :q
  • To close and save use:
  • :wq

Visual Studio Code

https://code.visualstudio.com/

Set up shell command: https://code.visualstudio.com/docs/setup/mac

VS Code Extensions

  • Bracket Pair Colorizer 2
  • indent-rainbow
  • Live Sass Compiler
  • Javascript ES6 code snippets
  • Live Server
  • Prettier - Code Formatter
  • stylelint
  • Twig
  • VS Color Picker
  • vscode-icons
  • auto rename tag
  • rest client
  • GitLens
  • Auto-Open Markdown Preview
  • Vetur (for when you use Vue more heavily)

VS Code Settings

The settings are configured via 'Settings' and are maintained via JSON. To override, just click on the pencil icon next to the code-to-be-overwritten and select 'Replace in settings'. This adds a line to the custom settings JSON on the right.

Settings

{
    "window.zoomLevel": 0,
    "explorer.confirmDragAndDrop": false,
    "python.pythonPath": "python3",
    "editor.fontSize": 14,
    "editor.tabSize": 4,
    "editor.wordWrap": "on",
    "terminal.integrated.fontSize": 16,
    "workbench.colorTheme": "Yoncé",
    "workbench.iconTheme": "vscode-icons",
    "vsicons.projectDetection.autoReload": true,
    "workbench.startupEditor": "newUntitledFile",
    "liveServer.settings.donotShowInfoMsg": true,
    "liveServer.settings.donotVerifyTags": true,
    "vsicons.dontShowNewVersionMessage": true,
    "liveSassCompile.settings.generateMap": false,
}

Lando Installation

Spin up containers via the command line without having to mess with MAMP, Vagrant, and so forth. (Don't forget to install Docker beforehand!)

https://docs.devwithlando.io/installation/macos.html

Node Version Manager

  • Repo: https://github.com/creationix/nvm
  • curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.31.1/install.sh | bash
  • npm install gulp -g
  • npm install grunt -g

Ruby Version Manager

Tips & Cheatsheets & Cool Docs