Creating a cse154 Working Directory

First and probably the most important thing: create a directory that you will do your CSE 154 work in! A new subdirectory will be created for each assignment. We recommend the following structure:

path-to-school-folders/cse154/
  practice-work/
  cp1/
  hw1/
  cp2/
  hw2/
  ...

Atom and Git

Atom is our recommended text editor. We will use it to program in the different languages covered in CSE 154 (HTML, CSS, JS, SQL) as well as to clone assignment Git repositories.

You need to have Atom (or another text editor) and Git starting in Week 1 to get started with your first assignment (CP1) and to follow along lecture/section. If you already have experience using Git, you may use the same process you're familiar with, but we otherwise strongly recommend you follow the Atom/Git setup guides for CSE154, which include helpful packages to support your web development environment in this course:

Node and Local JSLint install

On the client-side, your JavaScript is interpreted by your browser, so it knows how to respond to user events like button clicks and pages loads. On the server-side, your JavaScript is interpreted by a piece of software called Node.js, so that it knows how to respond to user requests over the network. This includes responding with the client-side files (HTML/CSS/Client-side JavaScript) for the client to display, or responding with information stored or calculated on the server. While developing for this course, we will be running both the client-side browser and the server on the same machine (your computer). (We will go more in depth into the server-side later on in the course).

Chrome

You will need a Chrome browser on your machine. Webpages will render a bit differently between different browsers, and for consistency we expect students to use Chrome (which also has very useful web development tools!).

If you have Atom (or an alternative text editor), Git and your first CSE 154 repository cloned, and a browser then congratulations! Your CSE 154 web development setup is complete!