This is the multi-page printable view of this section. Click here to print.

Return to the regular view of this page.

Docs

Technical Information about CS 347

Working Locally vs. Remotely

Local

Some JMU CS Students do a significant amount of their software development for their courses on stu. While you can do CS 347 development on stu, you can’t run your code there. In general we assume you’re developing and running locally. That being said, it would be good for you to have your developer tools setup to be able to do things for you remotely (like interact with github for example).

Remote (authentication via key-pairs)

Complete Getting Started with Authentication via Key-Pairs, which will:

  1. offer skip logic in the instructions if you have previously completed CS 261 setup steps
  2. guide you through creating an SSH key
  3. instruct you on how to tell your tools (esp. ssh) that it should know about this key and when to use it
  4. instruct you on how to make stu know this key is legit
  5. instruct you on how to tell github this key is legit

Files

  1. Create some directory where you will place all the projects and code for CS 347 this semester. We will refer ot this directory as 343home throughout our docs.
    • I recommend placing it in a place that isn’t automagically sync’ed by cloud apps like Box, Dropbox, iCloud, Google Drive, OneDrive, etc. Mine’s at something like ~/dev/347f26 (because I may have several semesters of 347 courses, hopefully you won’t 😜)

Windows

PowerShell Execution Policy

We’ll be running some scripts during the semester. Many Windows users are protected by having an Execution Policy that prevents them from running arbitrary code. You shouldn’t run arbitrary code, you’re a CS student now, not “just” an “end user”. You need to run the following command to remove this protection. That’s scary! I’m reluctant to ask you, but it seems necessary. Be careful with pasting into terminals!

In PowerShell, run the following command to ensure you can run scripts in this class:

Set-ExecutionPolicy RemoteSigned -Scope CurrentUser
Set-ExecutionPolicy (Microsoft.PowerShell.Security) - PowerShell | Microsoft Learn

Git

If you don’t have it already, install git on your computer. I personally benefitted for years from starting out with a bit of GUI to help me out with git as I was improving my command line skills. While the only GUI I can personally recommend is unfortunately not available for Linux, the built-in features of vscode are ok.

Python

You can have many versions of python installed on a computer. They shouldn’t have any conflicts in general, but you will need to know how to:

Installing a specific version of Python

For this semester, given the Status of Python versions despite the fact that v3.12 is installed in the JMU CS labs, we will start out on v3.14.x.

  1. Go to the Python 3.14.x downloads page and download the installer for your OS.
    • Note for Windows: when I was testing this, I got the installer msix file and when it was prompting me, I said yes to each of the prompts. You should too!

(Python) Virtual Environments

It’s a good practice to use a python virtual environment or “venv” for each project you work on.

In most cases (all of them for this course) I suggest you place the venv in a directory named .venv in the top directory of the project it is for. Add this .venv directory to your .gitignore if it’s in a git repo.

1 - Firefox DevTools

A curated selection of the Firefox DevTools documentation.

Overview

Most browsers (Firefox, and the lessers too) have some built-in tools to support web developers. Firefox’s are called “DevTools” and they’re pretty great. The most comprehensive documentation for Firefox’s DevTools is in the MDN’s What are browser developer tools?.

Configuring DevTools

The default settings are pretty good, but you may want to make a few of the changes I use.

screenshot showing where to find the devtools settings
to find the devtools settings, have the devtools open (e.g. via right clicking in the browser and choosing Inspect), and then click the ellipsis (`...`), and then choose Settings

Rulers

Sometimes it can be helpful to see the dimensions of the viewport.

screenshot of the devtools settings for rulers
I configure the devtools to have a button so that I can easily toggle these rulers on and off (annoyingly, they don't remember to stay on if the page refreshes as it might if I'm developing locally and using e.g. the Live Server extension).

HTTP Cache

Some of the code we write in developing for the clientside could be cached by the browser. Generally, that’s great, but when we’re actively working on a page and the browser stops showing us the most up-to-date view of it, it can be confounding.

screenshot of the devtools settings for disabling caching
Tell the DevTools to disable caching when they're open.

Responsive Design Mode

Firefox’s DevTools have a great Responsive Design Mode that facilitates you in testing how your page will look on different devices (e.g. with different known viewport sizes, network speeds, etc.).