Last updated: January 27, 2019
For Windows users:
One of the main appeals of web development is that products work on all devices regardless of OS. That being said, there can be some difficulties when developing web apps from different OS's (particularly Windows). Expect to spend some time debugging and looking around for answers when things don't work quite as expected when installing dependencies and submitting work. The teaching staff will work with you to mitigate these problems!
We highly recommend you use git bash for running scripts. This will allow for more linux-like syntax and operations.
React and Express are popular examples of Node packages which we will become familiar with over the course of this semester.
If you've heard of Yarn, it's another package manager developed by Facebook which largely does the same thing as NPM with subtle differences. For this course, we will stick to npm for homeworks.
To check if Node is installed, open the Terminal or Command Prompt app on your computer and run:
If something along the lines of
v10.16.3 is returned, Node is set up successfully. If you have a version less than 8, consider installing a more recent release. If there is an error or no version is returned, follow the directions below.
You have a few options for installing node, though we highly recommend the first:
The preferred way to install node for this course is NVM (Node Version Manager). This lets you change versions of node from your command line which can make things smoother in the case you have node 8 installed by default but we actually want use to use node 10.
NVM is developed for Linux-based devices (including Macs), so for Windows you should use this alternative.
To install NVM, follow this guide.
To install Node, proceed to the node.js website and download the latest Long Term Support (LTS) version of Node. When the download has finished installing, open the file and follow the prompted instructions until Node is set up on your machine.
To assert everything installed correctly, run:
Few people write JS in full-fledged IDE's in the way you might be used to running Java in Eclipse or IntelliJ. Though there are solutions for this (like Webstorm) these often introduce overhead and unnecessary complexity.
Instead, JS devs often use lighter tools like VSCode, Atom, or Sublime Text. The CIS 197 staff tends to use VSCode because of the strong developer community, UI, and built-in terminal. All of these tools have built in package managers for installing packages which improve the developer experience like syntax highlighting, help formatting, and help with code completion.
There are many ways to test JS code. For simple syntax checking, the easiest way is often via the developer tools in your browser (like Google Chrome) or by running the
node command on its own in your terminal which gives you a Node-based JS REPL (type
Ctrl + C to exit
To test a JS file, navigate in your terminal to the directory where the file is located (if you're not sure how to do this, find an intro guide on how to using your terminal online). From there, you can run
node file-name. Any
console.log statement executed in your file will print out to the console of your terminal. This is also a good way to check for syntax errors. It can also be useful to make a new file specifically for testing functions in another file. In the test file, you can
require the primary file and call functions there.
.eslintrc file which specifies how to configure the linter to meet our preferred style guide for the course. You can learn more about ESLint here.
We recommend installing the ESLint package and related linter packages for your code editor of choice. Said packages will highlight issues with your code as you type so you can easily resolve them, much like a spell checker in Microsoft Word. You can also check for linter errors from your terminal via the
eslint package found here. This is what we run when you submit your assignment to Gradescope.