Optional Extras and Recommendations

Here is a list of additional recommendations for plugins and tools which aren't necessary but will improve your coding experience.

VSCode Extensions and Themes

It is recommended to install a theme and any extensions you would enjoy, below are a few suggestions:

Themes and Aesthetics:

• Catppuccin for VSCode
• One Dark Pro
• Material Icon Theme - for better icons

Utility:

• Prettier - Code formatter - enable auto format on save to maximise utility
• Live Server - enables you to run local servers for development
• ES7+ React/Redux/React-Native snippets
• Auto Rename Tag - for editing HTML/XML tags
• FindItFaster - Better search leveraging fzf
• Error Lens - display errors inline to avoid hovering
• Git Lens - displays more Git information
• TODO Highlight

For fun:

• Discord Presence - connect VSCode with Discord activity
• Vs Code Pets

Web Browsers

As a web developer, you should also have a variety of browsers installed on your system. I would at least recommend the following two:

1. Google Chrome
   • Widely used by most people and is the best for JavaScript debugging.
2. Mozilla Firefox or FireFox Developer Edition:
   • FireFox has a much better suite of CSS and styling tools.
   • Developer Edition provides more developer features particularly for flex box and grids.

You can read much more about these web browsers on their respective pages or online.

Zsh Autosuggestions

This is a zsh plugin which will give you suggestions for your command line based on your previously used commands. To install it simply clone the repo into $ZSH_CUSTOM/plugins:

git clone https://github.com/zsh-users/zsh-autosuggestions ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-autosuggestions

Then add the plugin to the list of plugins for Oh My Zsh to load (inside ~/.zshrc) and start a new terminal session:

plugins=(
    # other plugins...
    zsh-autosuggestions
)

Homebrew installation

You can also install this using Homebrew (on macOS) by entering the following two commands:

brew install zsh-autosuggestions
source $(brew --prefix)/share/zsh-autosuggestions/zsh-autosuggestions.zsh

This will first install the plugin and then add it to the end of your .zshrc.

GitHub CLI

GitHub CLI allows you to access GitHub from the terminal. Allowing you to view repos, issues and pull requests from the command line. To install it follow the instructions found the official page.

Docker

It is also recommended to install Docker to containerise your project however this mostly likely will not be needed for beginner web developers. If you would still like to install it you can do some from the Docker Desktop site.

Other Text Editors

Alternatively you could try setting up and using another text editor like NeoVim however this takes more time and is more advanced and may not be worth your time.

To mention a possible solution, NvChad is a Neovim config which can be installed with one command however you will still need to set a few things up.