INFO 343: Client-Side Web Development

GETTING STARTED

Just joining us? Start by doing the following:

  1. Fill out the intro survey
  2. Read through the course syllabus (this page) and the course policies
  3. Join the class Slack team! Feel free to say hello :)
  4. Visit and bookmark the course book

Contact Information

Instructor Joel Ross
Email joelross@uw.edu; Phone: (206) 685 1622
Office MGH 330C; Office hours: Tue/Thu 10:30a-12:30p, or by appointment

TA Evan Frawley, frawley@uw.edu; Office hours: by appointment

Class meeting times
   Lecture M/W 10:30 am - 12:20 pm (MGH 430)
   Lab F 10:30 am - 11:20 am (MGH 430)

Course Book

Code on GitHub

Q&A on Slack

Journaling Instructions and Example

Course Description

This course will teach you the skills and techniques necessary for creating sophisticated and accessible interactive web applications. It focuses on the client-side languages, tools, and libraries that professionals use to build the web sites you use every day. We will learn not only the basic syntax and mechanics of web development, but also the best practices that separate professional developers from amateurs. Upon completing this course, students will be able to build robust web applications, and will have the foundation for independently learning new skills in the every-changing world of web development. This course is intense and our expectations are high, but we will make sure that everyone, including the total beginners, are prepared to succeed.

Prerequisites: CSE 142; INFO 201. If you haven't taken INFO 201, you can still enroll in this course but you will need to do some extra work the first week.

Learning Objectives

After completing this course, students will be able to:

  • Produce web pages that are well-formed, standards-compliant, semantically rich, and universally accessible.
  • Style the appearance of those pages to create intuitive, usable, and engaging experiences for human readers on different kinds of devices.
  • Create interactive and feature-rich web applications leveraging existing programming frameworks, libraries, and APIs.
  • Interpret documentation in order to harness existing software packages for web development.
  • Utilize development tools to automatically manage, implement, and validate web applications.

Course Structure

As with any form of computer programming, the best way to learn web development is by doing it. Moreover, web programming is a constantly and rapidly changing discipline, so professional developers need to constantly learn new tools and techniques on their own.

To help you practice this web programming and independent learning, this course is offered in a mostly "flipped instruction" format. This means that all the information needed for the course is available in the course book, rather than introduced during scheduled meeting times. Instead, meetings will be used for focused review activities and collaborative work time for assignments. Instead of getting information in lecture and doing assignments at home, you'll get information at home and (partially) do assignments in lecture.

This structure will you allow you to work at a pace that is comfortable for you individually, rather than requiring lectures to fit a diverse range of backgrounds. It also means you'll easily be able to get more direct support when learning and practicing the material: whether from us or from other students in the class.

However, this structure does require you to take more responsibility for your own learning: it is up to you to read the course materials before each class meeting, and to be willing to ask questions and seek help if there are any problems. We will serve as mediators and support for your learning, but your participation in and outside of class is essential. You are accountable for your own learning—but we are here to help!

Assignments

Find complete assignment details and due dates on the Assignments page.

This course will involve two types of assignments:

Exercise Sets

Each topic in this course will be accompanied by a number of exercise sets. Each exercise is a small, directed programming problem designed to give you practice with a particular web development concept. Exercises will be graded on a "completion" basis: you will get credit when the exercise is finished and passes all its functionality tests.

An exercise set will be due every week, in order to keep you on track.

Projects

You will also be creating a number of larger projects that bring together multiple concepts learned through the exercises. Projects will be more open-ended, allowing you to creatively apply your new skills and develop "portfolio" pieces that you can show off in the future.

There will be 5 projects (including a final group project), due approximately every other week.

Specific Rules and Policies

Course policies (including grading and late work policies) are on the Policies page.

Course Schedule

This course will cover topics following the approximate schedule below (subject to change):

Week Topic Reading
0 Introduction Chapters 1-4
1 Modern HTML and CSS Chapters 5-7
2 Responsive Design Chapters 8-9
3 Programming in JavaScript Chapters 10-11
4 DOM and Interactivity Chapters 12-13
5 Asynchronous Data; ES6 Chapters 14-15
6 React Chapters 16-17
7 Firebase Chapter 18
8 Client-Side Routing (Thanksgiving) Chapter 19
9 Structuring React Apps
10 Special Topics

Course Summary:

Date Details Due
CC Attribution Non-Commercial Share Alike This course content is offered under a CC Attribution Non-Commercial Share Alike license. Content in this course can be considered under this license unless otherwise noted.