Skip to content

Instantly share code, notes, and snippets.

@JollyRen
Last active November 22, 2023 20:40
Show Gist options
  • Save JollyRen/e4f6847b92efff1a84734997e1c0dd63 to your computer and use it in GitHub Desktop.
Save JollyRen/e4f6847b92efff1a84734997e1c0dd63 to your computer and use it in GitHub Desktop.
WSL Setup for Fullstack

WSL Setup For Fullstack

What is WSL?

Imagine that WSL is a remote computer separate for yours, for all intents and purposes.

WSL stands for Windows Subsystem for Linux. It creates something between a virtual machine and container that runs a Linux distribution (by default - Ubuntu) in an optimized way on your computer. It's available to install on Windows 10 and 11, whether you're online or offline.

WSL enables you to run a Linux development environment inside of windows (for the most part). There are some limitations:

  • WSL doesn't have access to display protocols in Win 10.
  • WSL (when set up correctly) doesn't have direct access to files on your harddrive that is managed by windows.
  • WSL has a separate network drive that holds its files in a sandbox

Please follow these steps to get your WSL setup completed. There will be some quality of life optional steps at the end.


Installing WSL

There's no better source for installing WSL than Microsoft's own documentation.

Click here to go to Microsoft's tutorial.


tl;dr version

  1. Open PowerShell as an administrator (rightclick windows key for the option) and type:
    wsl --install -d Ubuntu
  2. Set your username
  3. Set your password (something simple, since you will use it often) - your password will not be visible as you type
  4. This new user will be the default user for your account - if you forget your password go here and scroll to the end of the "Set up your Linux username and password" section for instructions.
  5. Update and upgrade your packages. In WSL terminal (Ubuntu with a penguin), type:
    sudo apt update && sudo apt upgrade -y
  6. Restart your computer

Troubleshooting

  • If you're logged in as root and you were never prompted to make a username or password

    1. You have the option to try installing again:
      1. In powershell(admin or not): wsl --unregister Ubuntu
      2. wsl --install -d Ubuntu
      3. Follow the prompt to create a username and password
    2. You can add the user after the fact:
      1. In powershell(admin or not): wsl -u root
      2. Now that powershell loaded in root user:
      3. sudo adduser <username>
        eg: sudo adduser harry - just hit enter for all the prompts, but use a password you can easily remember, and isn't too long.
      4. sudo usermod -aG sudo <username>
        eg: sudo usermod -aG sudo harry
      5. Close the terminal and reopen powershell
      6. Type: wsl config --default-user <username>
        eg: wsl config --default-user harry
      7. Type: wsl or wsl.exeto enter it, you should be the user you just made.
  • If you are getting an error: execvpe /bin/zsh failed 2

    1. Open a new powershell tab: wsl ~ -e bash (this changes the shell back to bash, from zsh)
    2. type: wsl or wsl.exe to enter Ubuntu/WSL
    3. type: sudo apt install zsh
    4. type: sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)" and accept the change to zsh shell.
    5. Click search on your windows taskbar
    6. Type: Ubuntu and if you see the orange icon with "Ubuntu on Windows" and it looks like an installed app, click it. Check to see if you are logged in as the correct user, and if your terminal looks something like this: ~ > or > ~. To see your username, if it isn't visible, type: whoami
  • If you're not getting a network connection while in WSL

    1. open wsl and type to unlink the generated resolv.conf from WSL sudo unlink /etc/resolv.conf
    2. next type to add text to WSLs self-generating resolv.conf:
    cat <<EOF | sudo tee -a /etc/wsl.conf
    [network]
    generateResolvConf = false
    EOF
    1. To add the nameserver for wsl to resolve IPs, then:
    cat <<EOF | sudo tee -a /etc/resolv.conf
    nameserver 8.8.8.8
    EOF
    1. Then, type to make the file immutable by WSL: sudo chattr +i /etc/resolv.conf
    2. Finally, close the WSL terminal and open PowerShell. Then type: wsl --shutdown, wait 5-10 seconds, then open WSL again. Viola!

Installing Windows Terminal

Windows Terminal is not the default terminal app unless you upgraded from Win10 to one of the latest versions of Windows 11. Windows Terminal is a great terminal management application, with tabbed views for multiple terminals, similar to your experience in the IDE we'll install later - Visual Studio Code.

  1. Open the Windows Store and search for
    Windows Terminal
  2. At the top of the terminal, there is a and a . press the and select "settings."
  3. Go to Defualt in the left sidebar and select your default shell from PowerShell to Ubuntu
  4. In the left sidebar, select your Ubuntu profile. In the option to choose the "Starting Directory", replace
    :\Users\<UserName>\Project or /mnt/c/Users/<UserName>/ or %USERPROFILE% or ~
    with \\wsl$\<DistroName>\home\<UserName>
    example: \\wsl$\Ubuntu\home\imalittleteapot
  5. Save in the bottom right, and close your terminal window.

Installing Visual Studio Code

You'll want Visual Studio Code installed on Windows first. If you haven't already done so, go ahead and navigate to it now and install it. Also you want to navigate to your extensions tab (on the left hand side, last icon) and get an extension called "Remote-WSL" or just "WSL".

Once you have Visual Studio Code and WSL installed, open your Windows Terminal (it should default to Ubuntu). Now type in
code .

This will prompt VS Code to install on WSL. If VS Code opened without errors, go ahead and close it now.


Installing node.js, npm, nvm

The preferred method of installing node.js and npm (node package manager) is through nvm (node version manager). For windows users, there's no nvm version from the makers of the nvm package. There is an alternative for bare Windows, however.

Fortunately, since you have WSL, you don't need to go through that painful setup. Instead, just use the curl or wget command in your terminal from this repository.

You should have curl already, but if you want to make sure, type sudo apt-get install curl to get the latest version or install it fresh.

The latest version of nvm as of this writing (9/20/2022) is:

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash

or:

wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash


Once it finishes, close your terminal, open a new one, and type:

nvm -v

You should see it output the nvm version.

After that, you'll need to install node and npm. Type:

nvm install --lts
or
nvm install <specific version number>


Next you want to select the installed version of node:

nvm use <node version>

Otherwise, if for whatever reason nvm is scary for you, you can directly install node.js and npm this way:

type
sudo apt install nodejs

next type node -v to check your version

type
sudo apt install npm


Installing and Configuring Git

To install Git in WSL, open the terminal and type:

sudo apt-get install git

Once it's finished, you want to do some configuration. You'll want to go to GitHub and create a user account (if you haven't already) that uses the email you used to sign up with the course.

Once you have your account signed up and you have a username you can go back to your terminal and start configuring.

git config --global user.name "Your Name"
# replace "Your Name" with your GitHub username
git config --global user.email "youremail@domain.com"
# replace "youremail@domain.com" with your GitHub account email

You now have two choices: GitHub CLI, from your terminal, or using ssh keys and the website. Both are acceptable, but the GH CLI is really quite nice as you use GitHub more.

GitHub CLI (gh)

The official installation instructions are here. Use the "Debian, Ubuntu Linux, Raspberry Pi OS (apt)" installation procedures listed there.

If you are on Ubuntu >22 you can simply type:

sudo apt install gh

For Ubuntu <22 you need to install the package location, as GitHub had to change it's GPG key after the Ubuntu 20 package rollout. For convenience, this is the commands as of 1/23/2023:

type -p curl >/dev/null || sudo apt install curl -y
curl -fsSL https://cli.github.com/packages/githubcli-archive-keyring.gpg | sudo dd of=/usr/share/keyrings/githubcli-archive-keyring.gpg \
&& sudo chmod go+r /usr/share/keyrings/githubcli-archive-keyring.gpg \
&& echo "deb [arch=$(dpkg --print-architecture) signed-by=/usr/share/keyrings/githubcli-archive-keyring.gpg] https://cli.github.com/packages stable main" | sudo tee /etc/apt/sources.list.d/github-cli.list > /dev/null \
&& sudo apt update \
&& sudo apt install gh -y

Any time you need to upgrade the CLI from here out, just type:

sudo apt update
sudo apt install gh

Now, in your terminal you can use commands with gh.

Type: gh auth login

  • Choose GitHub.com
  • Choose HTTP/HTTPS when it gives the options for login type.
  • Copy the code it gives you (highlight with mouse and right-click or Ctrl+Shift+C) and press Enter - this will open your default browser and go to https://github.com/login/device
  • Paste the code into into the first text box, then hit the green button. - You may have to enter your password now.

Manually adding SSH keys and connecting to GitHub.com

Now you'll want to create an ssh key and add it to GitHub. GitHub has a great tutorial to follow to get you up and running. This is the best source, but there's an issue — the website will think you're in Windows, not a Linux environment.


For WSL:

  1. Open your terminal

  2. Check for existing ssh by typing ls -al ~/.ssh
    If anything is here, you have an ssh you can use already, so you can skip to step 6.

  3. If you don't see anything, type
    ssh-keygen -t ed25519 -C "your_email@example.com"
    and make sure you change the email to your email used to sign up with GitHub.

  4. You'll see a phrase in your terminal like:
    Enter a file in which to save the key (/home/you/.ssh/algorithm): [Press enter]
    Go ahead and press enter for the default location.

  5. Next it will ask you to type a secure passphrase, but you can skip this by pressing enter and leaving it blank. Otherwise, you'll have to enter it every time you want to do something in Git, which is quite annoying.

  6. You next need to start and add your ssh to your ssh-agent.
    eval "$(ssh-agent -s)"
    You'll see something similar to:
    Agent pid 59566
    If you don't get errors, then you can type:
    ssh-add ~/.ssh/id_ed25519

  7. Almost done! We have one more step, which is to add your ssh key to GitHub.

    1. Type cat ~/.ssh/id_ed25519.pub
    2. Then select and copy the contents of the id_ed25519.pub file displayed in the terminal to your clipboard.
    3. Once you have it copied to your clipboard, go to GitHub > Settings > SSH and GPG keys > New SSH key.
    4. Type in "Title":  username WSL
    5. Paste your key into the "Key" field.

    Installing PostgreSQL


to install PostgreSQL on WSL type:

sudo apt-get install postgresql postgresql-contrib

When that finishes, type psql --version to check the version.

Close your terminal instance and reopen another Ubuntu instance.

Try this step first before moving on!

Type sudo nano /etc/postgresql/<version_number>/main/pg_hba.conf where the version number is usually 14 or 15.

When you are in pg_hba.conf follow this workflow:

Now that you're in "nano" - a terminal-based text editor - you can only use keyboard commands to navigate (up, down, left, right arrows).

Go all the way to the bottom, and anywhere in the column to the far right you don't see "peer", change it to "trust" (no quotations).

so: scram-sha-256 -> trust and md5 -> trust

pg_hba-settings

Once every row's connection protocol has been changed:

Ctrl+O saves the file enter confirms the file name Ctrl+X exits "nano"

Type: sudo service postgresql start to start the service.

Next type psql -U postgres to attempt logging into psql as user postgres.

in PSQL:

CREATE ROLE <USERNAME_FROM_WSL> WITH LOGIN SUPERUSER CREATEROLE CREATEDB PASSWORD NULL;

Then \q to exit psql

Type createdb $USER to attempt creation of a db for the new role.

If it doesn't work, try manually typing out the name: createdb <WSL_USER_HERE>

Try to run psql from here.

End easier attempt

try starting your PostgreSQL database up: sudo service postgresql start

You have a user called postgres that's associated with a default role. We need to create a password for that user.

sudo passwd postgres

Now, close and reopen your terminal.

To change to that postgres user:

sudo -i -u postgres which means "superuser do: login --> user --> postgres"

Access postgres by typing:

psql and \q to quit

or directly through sudo:

sudo -u postgres psql


Creating a New Role

Create a new user role by logging into the postgres role first, then type:

createuser --interactive

Or, if you aren't logged in first:

sudo -u postgres createuser --interactive

This outputs a series of prompts:

Output
Enter name of role to add: username
# make sure it's __exactly__ the same as your linux username
Shall the new role be a superuser? (y/n) y

We need to create a database for the user by typing:

createdb <username>

or without being logged in as postgres by:

sudo -u postgres createdb <username>

Now log in as the created user:

sudo -i -u <username>
# superuser do -> login -> user -> <username>
psql

or

sudo -u <username> psql

use \q to exit at any time. Your Postgres should now be set up.

To see what user accounts you have type:

psql -c "\du"

or:

psql
\du

There are some commands you need to know once PostgreSQL is installed:

  • psql -d database -U user -W for changing the user you would like to be logged in.
  • sudo service postgresql status for checking the status of your database.
  • sudo service postgresql start to start running your database.
  • sudo service postgresql stop to stop running your database.

What To Do If You Have Multiple Versions

If you end up with multiple versions of postgresql on your wsl, don't panic. You can access them all. you can tell you have multiple versions by doing the commands above, and seeing that you have multiple instances starting or restarting.

If that's the case, you can switch into them by doing the following command: psql -h localhost -p 5432 -U postgres

Note: -h tells it that the next argument is the hostname it should connect to. localhost is the variable for the default of 127.0.0.1. -p tells it that the next argument is the port it should connect to, on the hostname. The default for postgres is 5432. -U tells it which user to log in.

You can find out which port you are connected to by typing psql to enter the psql client / shell. Then type \conninfo to see which user and port you're running on.

If you're already on port 5432, you're likely on a lower version, unless things got out of order.

Every version has its own database and files, under /var/lib/postgresql/<version number> - eg /var/lib/postgresql/12 Likewise, every version has it's own configuration files, under /etc/postgresql/<version> -eg /etc/postgresql/12

One of these files in the configuration needs editing, in order to do developer work a little easily with multiple devs.

type sudo nano /etc/postgresql/<version>/main/pg_hba.conf (/etc/postgresql/12/main/pg_hba.conf) and this will open a configuration file for connection protocols.

Now that you're in "nano" - a terminal-based text editor - you can only use keyboard commands to navigate (up, down, left, right arrows).

Go all the way to the bottom, and anywhere in the column to teh far right you don't see "peer", change it to "trust" (no quotations).

so: scram-sha-256 -> trust and md5 -> trust

pg_hba-settings

Once every row's connection protocol has been changed:

Ctrl+O saves the file enter confirms the file name Ctrl+X exits "nano"

Now you don't need a password to connect to your db. If you have a password set up on your user (except postgres) you can now enter psql and type ALTER ROLE username WITH PASSWORD NULL; and hit enter. You'll see in psql a message of ALTER ROLE to tell you it's confirmed.

Now you can share your db files with anyone else, use the pg router in your node files with just the database url, and you're all set.

Just make sure that you have created a user with all the permissions you think you'll need for all versions you use. For example, psql set to 5432 might have users postgres, mary, lloyd where psql set to 5433 has users postgres, harry, lloyd.

To create a user in psql: CREATE ROLE username WITH LOGIN SUPERUSER CREATEDB CREATEROLE PASSWORD NULL; Your new user will have all the things you probably need now.

If you need to edit the capabilities of a role, as long as the role you are logged into psql as is a superuser, you can: ALTER ROLE username WITH [...OPTIONS YOU FORGOT];

What Should My Environment Look Like?

On final setup, your terminal should look something like this:
terminal
although the prompt will look different since the default shell for WSL is "Bash."

On final setup, your WSL should look like this:
VS-Code-WSL
Note that I'm in WSL: Ubuntu in the bottom left corner. This tells me that I am in the file structure of my WSL Ubuntu virtual machine. If you DO NOT see this, you are in your windows file structure and will get errors with databases and other things.

ALWAYS DEVELOP IN WSL

Also, we don't create files in our Windows file structure, but rather use commands like mkdir and touch to create files in our WSL terminal and file tree. Windows 11 users can use the GUI, but I won't show you how here. 😊


Final Word

Have fun! Programming in WSL is here to make your life better, whether you're programming in your Windows environment or in your WSL Linux environment. Enjoy the power of Linux on your Windows machine. 😊

Supplemental Tools

  • ZSH is a shell that extends the capabilities of bash with a new shell.
    • In your terminal:
      • sudo apt-get install zsh
      • sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"
      • If you got your password wrong when installing oh-my-zsh, don't worry. Just type sudo chsh -s /bin/zsh
  • Beekeeper is a great tool for checking out your SQL databases in a GUI - Download Page Here - WSL users choose the .exe setup and install on windows.
  • NerdFonts are common monospace fonts that developers use, with extra glyphs for environments and other icons for Git, etc.
  • Starship uses NerdFonts, so you need it as a prerequisite. Starship is a really cool piece of tech that detects details about your environment and displays it in your prompt. Node version, file composition, git branch, etc. Go here and choose "Linux", copy the curl command, and then paste it into your terminal. Follow the commands you see for your shell environment. (if you're on bash, add the eval it gives you to your .bashrc, on zsh .zshrc, at /home/username)
    • .zshrc: eval "$(starship init zsh)"
    • .bashrc: eval "$(starship init bash)"
@c-b94
Copy link

c-b94 commented Jan 23, 2023

at the part about installing postgresql, the linux installation command is missing a 't'
"sudo apt-get install posgresql postgresql-contrib" instaed of "sudo apt-get install postgresql postgresql-contrib"

@JollyRen
Copy link
Author

at the part about installing postgresql, the linux installation command is missing a 't'
"sudo apt-get install posgresql postgresql-contrib" instaed of "sudo apt-get install postgresql postgresql-contrib"

resolved, thank you!

@JollyRen
Copy link
Author

11/22/23

Updated or fixed a few things:

  • updated GH install if you are at or above Ubuntu 22
  • added a simplified version of the PostgreSQL setup instructions to try first. Reason: If you try to change to postgres user in linux then log into psql, you need to create a password for postgres, which you don't need to do if you try the simplified steps. Should work, but not thoroughly tested.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment