Skip to main content
Course web for the Spring 2019 Computer Graphics Class

Installing software that you need

It will be really worth your time to set you computer up for class. The tools you need are discussed at Tools.

Here are some steps that I used to set up a new Windows laptop for working on class projects. This can give you a sense of how to get the things on the Tools page setup on your machine. It will probably be different for you.

  1. Make sure that you’ve already installed Firefox and/or Chrome.

  2. I generally use Firefox as my web browser, and Chrome for programming (just to keep the two separate).

  3. You need at least one of these web browsers to test programs for class.

  4. Make sure they are up to date.

  5. (optional) Install Atom from https://atom.io/ – or some text editor.

  6. Install Node from https://nodejs.org/en/

  7. I let it install all of the build tools.

  8. You will want Node because its helpful for getting JavaScript tools. We will not be using it directly for class.

  9. Install useful Node packages

    • npm install -g http-server
    • npm install -g jshint
      • I picked jshint, but could have used eslint
      • eslint is fancier and more flexible, jshint works out of the box

  10. Install Visual Studio Code https://code.visualstudio.com/

    • see the Visual Studio Code and CS559 page for more thoughts on this
    • add JavaScript support (by clicking on “JavaScript” on the Customize screen)
    • I also added support for TypeScript and Python, since I use those for things beyond class
    • I recommend going through the “Interactive Playground”
    • If you open up the extensions page (File/Preferences/Extensions), you can add other Extensions
      • Debugger for Chrome (or Firefox, or both)
      • live server
      • jshint (eslint seems to come by default)
      • add “Shader Languages Support for VS Code”

  11. Download GIT for Windows https://git-scm.com/download/win

    • other systems have it installed already
    • you might get this when you install other tools

  12. (optional) Set up private keys for GIT

    • This will save a lot of typing of passwords as you work
    • The GitHub guide https://help.github.com/articles/working-with-ssh-key-passphrases/ can help you get started (and explains things well for a Mac)
    • http://guides.beanstalkapp.com/version-control/git-on-windows.html has hints
    • https://www.cgranade.com/blog/2016/06/06/ssh-keys-in-vscode.html has hints (although, I didn’t know you could use ssh-keygen to create keys for putty, I used puttygen)
    • I often use putty/pageant, but openssh might be easier (and it comes with GIT). OpenSSH requires you to type your passphrase all the time, rather than just the first time. Also SourceTree requires putty.
    • Using openssh
      • use ssh-keygen
      • look at the .pub file it created, and put that on GitHub
      • check that you can clone something
    • Using puttygen
      • use puttygen (it comes with SourceTree)
      • be sure to save the keys
      • copy the public part of the key from the UI
      • paste the public key into GitHub
      • set the GIT_SSH environment variable to wherever plink.exe is
      • I had to use the “official” version of GIT for this to work, but it did (even in VSCode)

  13. (optional) Install SourceTree https://www.sourcetreeapp.com/

    • this is optional – I find it easier than the command line
    • warning: it uses putty for SSH, which may be a little confusing, but I actually prefer it (since I can use putty for all SSH – include GIT inside VSCode)
    • SourceTree has its own internal version of GIT, which can save you from having to install regular GIT. I find it’s usefull to have both (so you get the GIT command line). If you use the internal GIT, you may need to update it.