Getting Started

Published

September 9, 2025

In CS312 we will use a variety of software tools and online services. Please get ready for the semester by making sure you have installed the following tools and created the following free accounts.

Online Services

Github

We will be making extensive use of Git and GitHub this semester, including using it for distributing assignment templates and assignment submission. 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!).

Installed software

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 Docker 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.

I will also encourage you to turn on the NPM scripts view in the Explorer (the left-hand pane). Click the three little dots at the top of the Pane and select “NPM scripts”. This adds a panel at the bottom of the pane which automatically detects all of the scripts in your package.json file. If you hover over the scripts you will see a run button that will run the script in a new terminal.

Git

  1. Make sure you have git installed. You may 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 init.defaultBranch main
    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.

If you used git at some point in the past, but not recently, you may have used password authentication for command line interaction, which has now been deprecated. Read through the description for Cloning with HTTPS urls for more information.

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.

There are many ways to install Node, but the best way is to use a tool that will allow you to easily migrate between versions. The recommended approach is to use nvm on OSX or Linux and chocolatey on Windows. If you are on a Windows machine without administrative privileges (e.g., a loaner machine), see the details below.

https://nodejs.dev/ has the short version of the commands you need to run to install node including installing nvm or chocolatey.

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.

Install 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. To install pnpm:

corepack enable pnpm
pnpm -v

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"

Docker

Docker is system for building, distributing and running containerized applications (i.e., running a separate operating system, complete with relevant software automatically installed). Install Docker Desktop, which includes both the docker command line tool and Docker compose (for launching multiple containers at once). You do not need to install any images now, we will automatically download the necessary images in the relevant assignments.

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.