Getting Started

Published

August 21, 2025

In CS465 we will use a variety of software tools and online services.

Online Services

Github

If you have not already, please create a free GitHub account. Note that you can have multiple e-mail addresses associated with your account, e.g. you can add (and should) add your Middlebury e-mail address to an existing GitHub account.

Once your account is set up, request an education discount for your individual GitHub account (not as an organization). Doing so gives you free private repositories and will unlock free accounts at other services that integrate with GitHub (some of which we will use!).

Observable

We will be making extensive use of Observable, which is a very full featured online notebook which will give us a lot of tools for making visualizations without a lot of extra scaffolding.

I suggest using your GitHub account to sign in.

Installed software

For folks who have taken CS 312 with me, most of these directions will be familiar.

Read the following instructions completely before starting, paying close attention to the version numbers when specified. You may have some of these tools already installed. Don’t just copy-and-paste, some commands require modifications (e.g. with your e-mail address). If you have trouble with installation, skip down to the next section.

A note to Windows users, most of the core tools we are using should be available for Windows. Some of the ancillary tools, e.g. NVM, may not. Our various workflows and exercises will have been developed and tested on OSX and Linux, but not on windows. If you would like to work in a more tested environment, you could make use of VirtualBox or the Windows Subsystem for Linux to get a Linux distribution up and running on your machine.

A note to OSX users, many of these tools can be installed via Homebrew. If you are a current Homebrew user, keep an eye out for that install option. If you are not yet a Homebrew user, I recommend it. Homebrew is “package manager” for OSX that makes it easy to install (and remove) software (especially open-source CLI SW).

Browser

All of the modern browsers should work fine, however to ensure a common, multi-platform environment we will standardize browsers that use the Chromium engine (Chrome, Brave, Vivaldi, Arc, etc…). I also encourage you to install the Rect Development Tools extension, which will allow you to inspect your React component hierarchies (including props).

Editor

As with the web browser, there are a variety of options out there for good programmer’s editors. However, I would like you to install VSCode, which has a good combination of features, a lot of useful plugins, and runs on practically everything. There are two reasons for standardizing on VSCode. First, it is helpful for me if everyone is using the same interface (though you can certainly customize VSCode to be unrecognizable). Second, it has a Live Share plugin that will allow us to share code. This will make office hours and pair programming a lot easier.

Installing extensions is pretty straightforward. You just need to click on the blocks icon on the left and browser the collection. Please install the ‘Live Share Extension Pack’. That should install everything you need to do live sharing.

Some other extensions that I use are: - Code Spell Checker (spell checking in your code) - Biome (highlights linting problems as you work)

I also find it useful to be able to launch VSCode from the command line. Mac users, follow these instructions to install the command line tool.

Git

  1. Make sure you have git installed. You likely already have Git installed (e.g. as part of OSX developer tools).

    As an aside, OSX users should install XCode Command Line tools (which includes compilers and other relevant tools like Git) if you don’t already have XCode installed. You will likely need those tools in another class. This guide includes step-by-step instructions.

  2. If you haven’t already, configure git with your name and e-mail

    git config --global user.name "your name"
git config --global user.email "your email address"
git config --global color.ui auto

    For example:

    git config --global user.name "Christopher Andrews"
git config --global user.email "candrews@middlebury.edu"

  3. GitHub offers both SSH and HTTPS-based interfaces to your repository. SSH requires you to set up a public-key. See GitHub’s help page for more information on these two options.

Node.js

Node.js is a stand-alone JavaScript engine that can be used to execute JavaScript outside the browser, either locally on your computer or on a “backend” server (i.e. “full-stack” JavaScript). As of the writing of this guide, the current “Long Term Support” (LTS) version is v22.17 (“Jod”). The minor version is likely to change, but I would like you to stick to the v22.x releases.

To install, go to the Node website and click the ‘Get Node.js’ button. Use the drop down options to configure it to match your system. On the Mac, pick “using nvm” and on Windows, chose “using Chocolatey”. On both systems, chose “with pnpm”. This will give you a collection of instructions to run.

On Mac, this is currently:

# Download and install nvm:
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.3/install.sh | bash

# in lieu of restarting the shell
\. "$HOME/.nvm/nvm.sh"

# Download and install Node.js:
nvm install 22

# Verify the Node.js version:
node -v # Should print "v22.19.0".

# Download and install pnpm:
corepack enable pnpm

# Verify pnpm version:
pnpm -v

On Windows, this is currently:

# Download and install Chocolatey:
powershell -c "irm https://community.chocolatey.org/install.ps1|iex"

# Download and install Node.js:
choco install nodejs --version="22.19.0"

# Verify the Node.js version:
node -v # Should print "v22.19.0".

# Download and install pnpm:
corepack enable pnpm

# Verify pnpm version:
pnpm -v
Warning

On Windows, you need to make sure you are running the instructions in an administrative shell. If you start the process in an non-administrative shell you will get a partial install and will have to figure out how to delete the partial installation before you can try again.

Changing between node versions in NVM

If you have previously used nvm it is possible that you have multiple versions of node installed on your machine. Open a new Terminal window and type nvm current to make sure that you are using the correct version of node.

If not, you can switch with

nvm use lts/jod

If you want to make this the default, you can type

nvm alias default lts/jod
nvm use default

If you are using the terminal in VSCode, you may need to quit VSCode and reopen for changes to the default to take effect.

PNPM

To speedup package installation and reduce the disk space needed we will use the pNPM package manager. pNPM (performant Node Package Manager) has a number of benefits for us, particularly it reuses previously downloaded dependencies to save disk space (our many assignments have the same dependencies). Note that while pnpm is generally equivalent to the default npm, there some differences in the commands. Pay close attention to the commands specified in the assignments and the tool used by any examples you encounter online.

Configure pnpm with some sane defaults (replacing email address with your e-mail address, etc.):

pnpm set init-author-email "email address"
pnpm set init-author-name "name"
pnpm set init-license "Apache-2.0"

Alternative

Occasionally someone will have trouble getting the tools installed. This could be because you have a Chromebook, or your operating system version is old, or you just don’t have enough free disk space. If this applies to you, please reach out to me about a loaner machine.