Course Overview

EECS 130: �Tools and Technologies of the World Wide Web

Spring, 2020

Outline

1. Introductions
2. Overview of the course
3. Logistics
4. Questionnaire

About Me

1. Call me Sarah / she / her
2. I majored in Economics (i.e. non-major) at Yale
3. Have done web design and web programming for almost 20 years and have seen many generations of web technologies and their evolution
4. I learned about web programming after undergrad — took a few community college classes, but mostly learned on the job
5. Received my PhD at the School of Information at UC Berkeley. My research focuses on learning and education; and civic tech and civic engagement

Outline

• Introductions
• Overview of the course
• Logistics
• Questionnaire

Overview of the course

1. Why should I take this course?
2. What am I going to learn?
3. How am I going to learn it?

Why should I take this course?

You’re already using the web — why not understand how it works?�Web technologies mediate modern life, shaping the news you see, the ads you get, your beliefs, how companies get information about you, etc. While this course will not go into all of these mechanisms in detail, you will be able to see how these systems work, and what is possible to do with them.

Web technologies are expressive and creative�This is a project-based course that is mostly organized around hands-on activities. You will make a real web application, and experiment with a variety of web technologies via short homework assignments. In doing so, you will be able to pursue your own ideas and interests, be creative, and have a real, computational artifact to share at the end of 10 weeks.

Why should I take this course?

Can be a very generative “first programming experience”�For those of you who are interested in design, communications, and/or the applications of technology, this course will help you think about how networked web technologies can be marshaled towards goals that you might care about.

At the same time, many of the practices and dispositions that you will cultivate in this course (coding, debugging, installing technical software, working on the command line, reading technical documentation, experimenting with sample code, etc.) will help you in other computational and data-related contexts.

Web-related skills can serve as a gateway for people who ultimately go on to pursue tech-related careers (broadly defined).

​

What am I going to learn?

1. HTML Language Basics�Tags, nesting rules, web accessibility, etc�
2. CSS Language Basics�Using selectors; understanding the cascade; working with CSS frameworks�
3. Design�Some techniques for designing web apps

What am I going to learn?

• Introductory JavaScript with ES6
1. DOM manipulation; some programming; working with data (via AJAX)�
• Web Architecture
• Understanding and designing a simple REST API
• High-level intro to IP addresses, DNS, and some of the social/business aspects of networking�
• Web Tools
• git and GitHub; Atom
• Possibly: Heroku & Node.js

See the course schedule for more information.

How am I going to learn all of this?

• Attending lecture
• Doing the readings / video watching (from LinkedIn Learning and other sources).
• Attending your section (required) and office hours
• Practicing

Outline

• Introductions
• Overview of the course
• Logistics
• Questionnaire

Tutorial Sections: Some Changes

• Section attendance and participation make up ~15% of your grade. You can miss two tutorials without a grade penalty, but you must be present for the final tutorial to present your final project.
• Because of the unusual issues with remote teaching and time zone shifts, you are welcome to switch tutorial sections. There will be two sections:
• Thursday from 4-4:50PM with Anna Deng
• Thursday from 7-7:50PM with Olivier Gabison
• Tutorial sections are required: Sign up here

​

Grading

Most of your grade will be based on homeworks and tutorials. Therefore, submitting late work will have a serious impact on your grade. Be mindful of this.

Homework Grading

Homeworks are graded according to the following scale:

Homework Grading

• If you turn your homework late (within 48 hours of the deadline) you will be penalized 3 points (30%).
• No homework will be accepted after 48 hours.

LinkedIn Learning

For the HTML and CSS sections of this course, we will be using Northwestern’s Lynda.com subscription. To login, use the Northwestern login (and authenticate using your NetId):

https://www.linkedin.com/checkpoint/enterprise/login/75814418?application=learning

Course Technologies

• We will be coding during regularly scheduled lecture time.
• We will be using Atom as our code editor
• We will be hosting our websites using GitHub pages (and will therefore be learning how to use git and GitHub)
• Towards the end of the quarter, we may also be learning how to use either Heroku or Firebase (TBD)

Accommodations

Any student requesting accommodations related to a disability or other condition is required to register with AccessibleNU (847-467-5530) and provide professors with an accommodation notification from AccessibleNU, preferably within the first two weeks of class.

All information will remain confidential.

Integrity, Honesty, and Climate

Creating a welcome space�This is a course that is designed for beginners. Please respect each other’s learning process. No shaming, no showing off. If you want to discuss topics beyond the scope of the course, come to my office hours!

Academic Honesty

• Do not exchange code fragments on any assignments
• Do not copy solutions from any source
• You can look at others’ code, but don’t scribe it (whiteboard, paper, code)
• You cannot upload / sell your assignments to code sharing websites
• You cannot “outsource” your work to friends, family, or contractors

Course Staff

Instructor

• Sarah Van Wart

​

​

Peer Mentors

• Anna Deng
• Olivier Gabison

Other Course Logistics

• Office Hours: TBD. We will post them by the end of the week
• Course communication: Piazza. Please register!
• Resources and submissions:
• Course website for public resources (slides, code files, reference material)
• Canvas for private resource: assignment submissions, etc.

Outline

• Introductions
• Overview of the course
• Logistics
• Questionnaire

Questionnaire

https://forms.gle/pAeQsvqMKaXWXrwe9

Some of you have already filled this out

Next Up: Intro the the Web / Internet

Link to Slides