Development environment

Hardware:

Macbook Pro 2015, core i5, 8 GB, 120 SSD
LG 25" widescreen monitor

Theme and font

IDE

VSCode extensions:

Dracula Official
- The look and feel of my code editor.
Font: FiraCode - Download - A stylish font that makes coding more enjoyable.

To make it work you need to tweak settings.json (cmd/ctrl+,): enable fontLigatures and declare FiraCode in fontFamily.

settings.json:

{
"editor.fontFamily":  "Fira Code",
"editor.fontLigatures":  true,
"editor.fontSize":  18,
"editor.lineHeight":  24,
"editor.formatOnSave":  true,
}

vscode-icons - Shows an icon next to each file based on its type.
color-highlight - Previews the color being defined in your CSS.
EditorConfig - Standardizes IDE settings across the whole team via an .editorconfig file.
vscode-eslint - Keeps a consistent code style — you define the rules and ESLint flags any code that violates them with an error or warning. Great for enforcing conventions.
prettier-vscode - ESLint defines the rules; Prettier makes the code conform to them, fixing things like indentation, variable declarations, switching single quotes to double quotes if that's the rule, and so on. - Ensures ESLint rules are applied automatically on save, as long as you have editor.formatOnSave: "true" and prettier.eslintIntegration: "true" in your VSCode settings.json. - Always nice to have ESLint + Prettier set up together.
rocketseat-vscode-react-native-snippets
rocketseat-vscode-reactjs-snippets - Since I'm working with React Native and React + Redux, I rely on these snippets.

my full VSCode settings my full VSCode settings with comments

Terminal

Font

Terminal -> Preferences -> Fonts or Cmnd + , Font: FiraCode - Download

Theme

https://draculatheme.com/terminal/ Install it by following the tutorial on the site and then import it into the terminal
- Terminal -> Preferences -> Profile -> Import or Cmd +

Oh My Zsh

https://ohmyz.sh/ - Terminal.
https://github.com/denysdovhan/spaceship-prompt
Controls how items are rendered on screen.
Open .zshrc with: ❯ code ~/.zshrc, set: ZSH_THEME="spaceship", save and close.
More configuration:

SPACESHIP_PROMPT_ORDER=(
	user # Username section
	dir # Current directory section
	host # Hostname section
	git # Git section (git_branch + git_status)
	hg # Mercurial section (hg_branch + hg_status)
	exec_time # Execution time
	line_sep # Line break
	vi_mode # Vi-mode indicator
	jobs # Background jobs indicator
	exit_code # Exit code section
	char # Prompt character
)
SPACESHIP_PROMPT_ADD_NEWLINE=false
SPACESHIP_CHAR_SYMBOL="❯"
SPACESHIP_CHAR_SUFFIX=" "

ZPlugin

Helps you use the terminal with command suggestions and live feedback on whether the command you're typing is valid — green highlight if it is, red if it isn't.

zplugin To set it up, open .zshrc, append the lines below at the end of the file, then save and close:

zplugin light zsh-users/zsh-autosuggestions
zplugin light zsh-users/zsh-completions
zplugin light zdharma/fast-syntax-highlighting

Chrome extensions

Tools

Insomnia - An HTTP client similar to Postman, used to test and make calls against the REST APIs you're building.
https://devdocs.io/ to browse web docs
https://devdocs.egoist.moe/ to install it as a desktop offline app

That's it — now go code!