Skip to content
Class repository for Web Advanced Javascript - Section B - Fall 2016, Parsons School of Design
Branch: master
Clone or download
Umi
Latest commit eb89774 Nov 22, 2016
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
_starterkits added starter kit templates Aug 31, 2016
class01 change folder name into "class" Oct 7, 2016
class02 change folder name into "class" Oct 7, 2016
class03 change folder name into "class" Oct 7, 2016
class04 change folder name into "class" Oct 7, 2016
class05 change folder name into "class" Oct 7, 2016
class06 add class week 8 Oct 26, 2016
class07-midterm change folder name into "class" Oct 7, 2016
class08 add class 9 Nov 2, 2016
class09 add class 9 Nov 2, 2016
class10 fix bug Nov 10, 2016
class11 add class 11 & 12 Nov 23, 2016
class12 add class 11 & 12 Nov 23, 2016
inclass class 10 Nov 10, 2016
.DS_Store class 10 Nov 10, 2016
.gitignore Initial commit Aug 30, 2016
PGTE_5505_B_SYAM_FA16.pdf rename syllabus Sep 12, 2016
README.md add class 9 Nov 2, 2016

README.md

Web Advanced: JavaScript (Section B) Fall 2016

MFA Design and Technology, Parsons School of Design.

PGTE 5505, Section B, CRN 5264

  • Course Dates and Times: Wednesdays, from 7:00 pm to 9:40 pm
  • Location: 6 East 16th Street, Room 1208
  • Faculty: Umi Syam
  • Faculty e-mail: umi@newschool.edu
  • Teaching Assistant: Soomi Lee

Course Description

Applications rarely are comprised of a tangled set of static files. They're dynamic. They update. They remember things. The course will introduce the concepts of a database and Web applications as a set of design problems. The class will investigate server-side applications, third-party data sources and APIs and how applications can become dynamic and highly functional. To approach the design and construction of applications that derive from datasources and databases, this course builds upon an essential knowledge of Web Standards, user interface design, and usability to support the creation of functional and responsive projects for the Web across multiple devices and platforms. Students will incorporate interaction design, visual design, user experience and code to rapidly sculpt data into content. By the end of the course, students should be able to design, build and deploy data-driven Web applications. The course employs a pedagogy suitable for designers, artists and technologists who seek an empowerment achieved by being able to build data-driven applications. We will learn JavaScript properly. Then, we will learn useful design patterns. Then we will pick up useful tools for making cool things better.

Course Outline

For a full description of each class, see each week's folder.

class # date topic assignment
1 8/31/2016 JavaScript Basics Pt.1 Choose: Calculator/Quiz App
2 9/7/2016 JavaScript Basics Pt.2 + Web App A simple API-driven web app
3 9/14/2016 Single-Page Application Add more filters to our exercise
4 9/21/2016 Responsive Web Turn any of the 1-3 homework, responsive
5 9/28/2016 Node.js GET/POST exercise or scrape with xray
6 10/5/2016 Database Midterm Proposal Due
10/12/2016 No class - Yom Kippur
7 10/19/2016 Midterm Presentations -
8 10/26/2016 Websockets Read socket chat ex
9 11/2/2016 JS Lib: P5.js Turn any existing Processing sketch into P5
10 11/9/2016 Guest Lecture: Three.js TBA
11 11/16/2016 JS Lib: D3.js TBA
12 11/22/2016 (Tuesday) JS Lib: D3.js Final Project Proposal Due
13 11/30/2016 Class Review + Workshop -
14 12/7/2016 Class Review + Workshop -
15 12/14/2016 Final Presentations Final Project

Learning Outcomes

By the successful completion of this course, students will be able to:

  • Have a better understanding of how web applications work
  • Be comfortable with coding in JavaScript, from server to front-end.
  • Develop working prototypes and publish them.
  • Select and apply different technologies in order to realize their ideas.

Assessable Tasks

All assignments must be submitted through your personal Github repo. I will add each student as a submodule to our student's homework repository so that it's easier to check everyone's homework.

Weekly Assignments

Please refer to each week's readme file for the list of weekly assignment.

Midterm

Build a data-driven web application. Your project must:

  • At least read data from an external source — could be from a JSON file, from a database, or whatever you feel more comfortable with.
  • Have no less than 2 different "screens." If it's a dynamic html website, have at least 2 pages within the same url, but just different “#”/hash page. If you're building a canvas-based game, maybe you have 2 scenes? If it's a datavis, 2 charts or 2 ways of visualizing the same data and so on.
  • Respond to user interaction.

Final Project

Build an interactive web app that meets these requirements:

  • Interacts with the server-side using NodeJS
  • Includes bi-directional communication using websockets, any of these are valid: client <--> server, hardware <--> server communication. We're looking for true communication, sending and receiving data/messages/actions/inputs back and forth.
  • Outputs a visualization on the front-end side using either P5.js, D3.js, or Three.js.

Using database is optional in this case. If you want to make it more interesting, feel free to explore the possibility of connecting microcontrollers hardware as input/output. Send me a proposal of your final project first.

Required Tools

Read the complete syllabus here.

You can’t perform that action at this time.