Skip to content

Windows-Tooling.md

Latest commit

 

History

History
117 lines (80 loc) · 4.53 KB

Windows-Tooling.md

File metadata and controls

117 lines (80 loc) · 4.53 KB

Certainly! Here is the improved version of the "Windows Tooling" section focused exclusively on setting up a development environment on Windows:

Windows Tooling

This guide provides quick setup instructions for Windows users. For detailed learning and exercises, see the Prework Modules.

Windows has significantly improved for web development, and with the right setup, you can create a powerful and efficient development environment.

Setting Up Your Development Environment

Install Windows Subsystem for Linux (WSL)

WSL allows you to run a Linux distribution within Windows, providing access to the same tools and terminal environment as Mac and Linux users. Follow these steps to set up WSL:

  1. Install WSL: Open PowerShell as Administrator and run:

    wsl --install

    For more detailed instructions, visit the WSL installation guide.

  2. Choose a Linux Distribution: Once WSL is installed, choose a Linux distribution to install (Ubuntu is recommended for beginners).

  3. Initialize Your Distribution: Open your newly installed Linux distribution from the Start menu and complete the initial setup.

  4. Update and Upgrade: Run the following commands to update and upgrade your distribution:

    sudo apt update
sudo apt upgrade

Install Visual Studio Code

Visual Studio Code (VSCode) is a powerful, open-source code editor available for Windows, Mac, and Linux. Install it using the following command:

winget install --id Microsoft.VisualStudioCode

Or download it directly from the Visual Studio Code website.

Configure VSCode for WSL

For complete VS Code setup instructions, see Module 2: Code Editor Setup.

  1. Open VSCode: Launch Visual Studio Code.
  2. Open Terminal: Press Ctrl + to open the terminal.
  3. Open Command Palette: Press Ctrl + Shift + P to open the command palette.
  4. Select Default Shell: Type Select Default Shell and choose WSL Bash from the options.
  5. Open New Terminal: Click on the + icon in the terminal window to open a new WSL Bash terminal.

Install VetsWhoCode Extensions

The VetsWhoCode Extension Pack includes everything you need for our curriculum:

  1. Open VS Code
  2. Press Ctrl + Shift + X to open Extensions
  3. Search for "VetsWhoCode Extension Pack"
  4. Click Install

This pack includes:

  • Prettier: Code formatter
  • ESLint: Linting tool for JavaScript
  • GitLens: Supercharge the built-in Git capabilities
  • Live Server: Local development server with live reload
  • Auto Rename Tag: Automatically rename paired HTML tags
  • And more!

Additional VWC Extension

Also install the Vets Who Code HashFlag Extension to proudly display your affiliation:

  1. Search for "HashFlag" in Extensions
  2. Click Install

Keyboard Shortcuts

Improve your productivity by mastering keyboard shortcuts. Here are some great resources for Windows shortcuts:

Additionally, you can install CheatSheet for Windows alternatives to see all the shortcuts available in each application.

Additional Tools

Consider installing the following tools to further enhance your development environment:

  • Node.js and npm: JavaScript runtime and package manager: 
    winget install OpenJS.NodeJS
  • Git: Version control system: 
    winget install Git.Git
  • Zsh and Oh My Zsh: Improved shell and its configuration framework (optional for advanced users): 
    winget install Zsh
sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"

Additional Resources

To make your code editor more comfortable, check out these two podcast episodes for the best tips and extensions:

The podcasts are great, but you can also read the show notes for a quick summary.

Conclusion

With these tools and tips, you're well on your way to creating a powerful and efficient Windows development environment. Good luck, and happy coding! 🚀