Setting Up Your Development Environment

Prerequisites to many in- and out-of-class activities.

There’s a lot to install and setup. In total it may take close to an hour.

OS-Specific Setup

  1. If you’re on Windows, please install the Windows Subsystem for Linux (“WSL”) as indicated on our corresponding docs page.
    • Our intention is to have a development environment that is as similar as possible across all OSes. It seems like WSL can help us achieve this.
  2. After you’ve done that, you should be able to proceed with the rest of the instructions here.

Browsers

  1. Install Firefox if you don’t have it already (ensure you have at least 2 browsers installed).
  2. For whatever browsers, install extensions:
    1. a userscripts extension like ViolentMonkey
    2. an accessibility checker extension like WebAIM’s WAVE
    3. add a bookmark(let) for the validator
    4. this HTML validator

Editors

  1. Install VSCode:
    • Windows folks (should have already done this when they competed the prerequisite WSL install steps… 😉) do it this way (because we want you to be in this WSL context).
      • Ensure if you’re asked by the install wizard, that you enable/select the following:
        • Explorer context menu
        • Add to PATH
    • Everyone else: Visual Studio Code
  2. Install these vscode extensions:
    1. HTML Validate Extension
    2. Live Server
    3. Live Share ExtensionPack(weirdly can’t seem to reach that link any more even though it’s still listed on the Live Share Extension page 🤷‍♂️)
    4. Remote Development extension pack
    5. Python
    6. Pylance
    7. Flake8
    8. Black Formatter
    9. isort
    10. Django
    11. Code Spell Checker
    12. JSON Pretty Printer
    13. Todo Tree
  3. Make sure code is available from command line (“CLI”):
    1. Windows: the installer should have done it, try opening Windows Terminal or PowerShell or whatever and just type code and hit enter.
    2. MacOS
    3. Linux: the installer should have added it to your path already, try it in your shell

Git

If you don’t already have git installed (it’s installed by default on macOS and some linux distros), install it (and make sure it’s added to path where you can use the git command from the CLI).

Windows

The git install wizard defaults are probably fine, but if you happen to notice this, consider answering a few of the steps as follows:

Default editor:
vscode
Git Pull something:
rebase
Extra Options:
✅ enable symlinks

(On Windows) Ensure that once you install git, you have git bash, and that in git bash you have curl. This post may help if you don’t have curl on Windows.

Not Windows

Probably you already have git installed, try it in your shell by opening a terminal and running git

Configuring Git (all OSes)

  1. Open a terminal
    • Windows: open git bash
    • mac or linux open a terminal
  2. run the 2 commands found at the following link, but:
    1. don’t type the $ that’s at the beginning and
    2. change the placeholder values for real ones
      • note: the username and email you set do not have to match things github already knows about
    3. ok, here’s the link - Git::First-Time Setup:YourIdentity

GUI for Accessing Files Remotely

  1. Install Filezilla

GUI for Git

One of the best GUIs for Git isn’t available on linux 🤦‍♂️. So in the interest, everyone should Install the GitHub Desktop app.

Prof’s SSH Key

In case you’re trying to troubleshoot something tricky, you may wish to add my public key to your digital ocean droplet. This will permit me to act as whatever user you added it to, but it doesn’t give me your password (and so I can’t sudo or anything like that).

  1. Download my public key from github
  2. Add it to your droplet’s ~/.ssh/authorized_keys file
    • if you have ssh-copy-id on your computer, you can use that as follows:
      • ssh-copy-id -i ~/Downloads/prof-stewart.pub user@droplet-ip
    • if you don’t have ssh-copy-id, you can do it manually:
      • ssh to your droplet and then
        • mkdir ~/.ssh
        • chmod 700 ~/.ssh
        • nano ~/.ssh/authorized_keys
          • paste the contents of the prof-stewart.pub file into this file
  3. let me know your droplet’s IP address or hostname (once we’ve registered domain names and setup DNS)
    • or at least let me know when you need me to connect to it.
Last modified March 17, 2024: fix typo (5b01aef)