BEST Web Dev Setup? Windows & Linux at the same time (WSL)

Fireship

Fireship

10 min, 36 sec

A detailed guide on configuring a web development environment on Windows using WSL, Linux, VS Code, and various developer tools.

Summary

  • Explains how Windows has become an excellent platform for web developers, especially because of the Windows Subsystem for Linux (WSL).
  • Provides step-by-step instructions on setting up WSL, including the differences between WSL1 and WSL2 and how to install Linux distributions from the Microsoft Store.
  • Shows how to configure the terminal with Z shell and Oh My Zsh for a better user experience and how to integrate the Linux environment with Visual Studio Code.
  • Covers the installation of essential tools such as Node.js, Git, the GitHub CLI, and Docker, along with tips for managing node versions and Git credentials.
  • Recommends installing multiple browsers like Chrome, Firefox, and Brave for various development and debugging tasks.

Chapter 1

Introduction to Windows as a Web Development Platform

0:00 - 39 sec

Introducing the benefits of using Windows for web development and the importance of the Windows Subsystem for Linux (WSL).

Introducing the benefits of using Windows for web development and the importance of the Windows Subsystem for Linux (WSL).

  • Windows has become a compelling platform for web developers due to WSL.
  • WSL allows running a genuine Linux environment on Windows, enabling the use of Linux tools alongside Windows applications like Adobe Photoshop.
  • The presenter underscores the ability to work in both Linux and Windows environments simultaneously.

Chapter 2

Setting Up Windows Subsystem for Linux (WSL)

0:38 - 1 min, 34 sec

Guiding through the setup of WSL, choosing a Linux distribution, and pointing out the differences between WSL1 and WSL2.

Guiding through the setup of WSL, choosing a Linux distribution, and pointing out the differences between WSL1 and WSL2.

  • Instructions on enabling WSL through PowerShell and restarting the system.
  • Details on installing a Linux distribution from the Microsoft Store, recommending Ubuntu and explaining the collaboration between Canonical and Microsoft.
  • Differentiates between WSL1 and WSL2, with a note on the upcoming WSL2 general availability.

Chapter 3

Configuring the Linux Environment

2:12 - 49 sec

Configuration of the terminal and basic Linux commands to navigate and manipulate the file system.

Configuration of the terminal and basic Linux commands to navigate and manipulate the file system.

  • Demonstrates how to open the WSL terminal, list Linux distributions, and confirms the execution of unmodified Linux binaries.
  • Shows the integration of Linux's file system with Windows and highlights the inefficiencies of a dual-boot system compared to WSL.
  • Introduces basic Linux commands like 'ls', 'mkdir', 'cd', 'touch', and using 'sudo' for administrative privileges.

Chapter 4

Improving the Terminal Experience with Z Shell

3:02 - 1 min, 47 sec

Enhancing the terminal's appearance and functionality using Z shell and Oh My Zsh.

Enhancing the terminal's appearance and functionality using Z shell and Oh My Zsh.

  • Explains changing the command prompt using the PS1 environment variable in the bash or Zsh configuration files.
  • Details installing Z shell and Oh My Zsh to access themes and plugins, including setting the theme to 'random' for variety.
  • Mentions how to select and set a preferred theme in the Zsh configuration.

Chapter 5

Integrating Linux with Visual Studio Code

4:49 - 1 min, 7 sec

How to connect the Linux subsystem with Visual Studio Code for a seamless development environment.

How to connect the Linux subsystem with Visual Studio Code for a seamless development environment.

  • Guide for installing the Remote WSL extension for VS Code.
  • Shows how to open a new VS Code window that's integrated with the Linux environment.
  • Highlights the distinction in running Node.js scripts from Linux versus Windows within VS Code.

Chapter 6

Installing Essential Tools: Node.js and Git

5:55 - 1 min, 51 sec

Instructions on installing Node.js using Node Version Manager (NVM) and updating Git on Ubuntu.

Instructions on installing Node.js using Node Version Manager (NVM) and updating Git on Ubuntu.

  • Provides steps to install NVM and use it to install and manage multiple Node.js versions.
  • Discusses updating Git, setting global configuration values, and caching Git credentials for convenience.

Chapter 7

Setting Up the GitHub CLI and Docker

7:46 - 1 min, 12 sec

Installation of the GitHub CLI and Docker, including tips for using Docker Desktop and the upcoming WSL2 support.

Installation of the GitHub CLI and Docker, including tips for using Docker Desktop and the upcoming WSL2 support.

  • Outlines the steps to install the GitHub CLI for managing GitHub repositories.
  • Recommends Docker Desktop for container management and mentions the expected full support for Docker in WSL2.

Chapter 8

Choosing Browsers for Web Development

8:58 - 57 sec

Recommends installing multiple browsers for testing and debugging web applications.

Recommends installing multiple browsers for testing and debugging web applications.

  • Suggests using Chrome for JavaScript debugging and Firefox for CSS design work.
  • Recommends Brave browser for privacy considerations and user authentication testing.

Chapter 9

Conclusion and Additional Resources

9:54 - 23 sec

Concludes the guide and offers further learning opportunities through FireShip.io.

Concludes the guide and offers further learning opportunities through FireShip.io.

  • Encourages viewers to like and subscribe for more content.
  • Promotes FireShip.io for additional developer productivity resources.

More Fireship summaries

Vector databases are so hot right now. WTF are they?

Vector databases are so hot right now. WTF are they?

Fireship

Fireship

The video delivers updates on recent investments in vector databases, explains what vector databases are, their use cases, and their role in enhancing AI capabilities.

Nuxt in 100 Seconds

Nuxt in 100 Seconds

Fireship

Fireship

A detailed overview of Nuxt.js, a framework for building web applications using Vue.js, covering its features and capabilities.

AI coding assistants just leveled up, again…

AI coding assistants just leveled up, again…

Fireship

Fireship

An in-depth look at the latest AI developments in programming tools and their potential impact.

the ChatGPT store is about to launch… let’s get rich

the ChatGPT store is about to launch… let’s get rich

Fireship

Fireship

The video discusses the potential of monetizing custom GPT agents on OpenAI's platform and provides ideas and steps to build and deploy an agent.

80% of programmers are NOT happy… why?

80% of programmers are NOT happy… why?

Fireship

Fireship

The video discusses the widespread dissatisfaction among developers, drawing insights from the 2024 Stack Overflow survey and other sources.