The course will consist of four units.

Each unit will focus on a particular aspect of programming:

1. Programming fundamentals
CSCI-E3: Introduction to Web Programming Using Javascript 2. The Javascript language
Course Number/Term: CSCI E-3, Spring 2016 3. Javascript and the behavior of Web pages
Meeting Time: Online (no set meeting times) 4. Javascript libraries and advanced applications

Instructor: Larry Bouthillier

lbouthillier@fas.harvard.edu
Who Should Take This Course
Teaching Fellows: Each student will be assigned to a TF While no programming experience is required for this course, its essential that you are comfortable with your computer:
Office Hours: TBD
sending and receiving emails, attaching files, navigating the Web, finding your way around the file system (Windows
Section Meetings: Multiple section meetings led by course TFs will be scheduled, including in-person
Explorer or the Mac Finder). Basic knowledge of HTML, CSS or any programming language will be very helpful.
meetings in Cambridge as well as online meetings using Web conferencing, starting in
week 2. While HTML and CSS isnt the focus of the course, and students will not be evaluated on their ability to write complex
HTML, well be using HTML and CSS in many examples and assignments.
Course website: https://canvas.harvard.edu/courses/1847
[revision 2015.10.22] Some students in this course will have some experience with programming and Web development. Others will be
starting with no programming experience at all. No matter what your experience level coming in, the goal of this course
will be to build your skills starting from where youre at.
Overview
If youve never done any programming, youll learn some basics that will apply to any programming language. If
This course provides an introduction to web development by way of the essential language and runtime environment youve done some Web development before and used found Javascript in your pages, this course will contain some
that powers modern web interfaces. While no prior programming experience is required, exposure to basic HTML and review. But youll learn some of the basics you may have missed in your previous experience, and then get into some of
CSS and/or basic programming concepts will be very helpful. Students with no prior experience will face a steep
the nuances of Javascript that you need to know to get to writing libraries and modifying your own scripts. Its these
learning curve, and are encouraged to spend some time with online HTML and CSS learning resources such as nuances that define real expertise in Javascript.
Codecademy prior to the start of this class.

Through a series of examples and projects, students learn basic programming concepts while building an understanding
of the power and complexities of Javascript, which can perplex even experienced web developers. The course provides
a solid foundation in computer programming in Javascript: syntax and data structures, conditionals, objects, scope and
closures, AJAX, the DOM, and event handling. Students gain an understanding of the popular libraries that power rich
web applications such as JQuery and others. Upon completion, students are prepared to use Javascript in their projects,
write their own or extend existing Javascript libraries, and build rich web applications using these powerful tools.
Goals
This course is designed to introduce students to programming in general, and then specifically, to explore the use of
Javascript programming to add complex behavior to Web sites and Web applications. Students will learn:
Foundational Skills:
o be able to write, deploy, debug and run Javascript code in the context of client-side Web pages
o have an understanding of the structure and syntax of programming languages, with a focus on
Javascripts unique capabilities and techniques
o algorithmic thinking, and be able to break a complex problem into smaller, solvable chunks
Applications of Javascript to solve real-world problems:
o be able to write Javascript programs to add useful behavior to Web pages
o be able to use and extend popular libraries like JQuery
o Javascripts role in Web architecture
Learning how to learn
o be able to understand and use common Javascript references to discover and use new APIs and
information
o be able to construct a well-written and complete request for programming help, and to answer a request
for help
Why Did We Choose Javascript?
Lets face it many of us started using Javascript to spiff up our Web pages without really understanding how it works.
Sure - for simple things, its often possible to copy-and-paste and putter around with the code and make things work.
But to really understand what Javascript can do, why JS libraries are written like they are, how to build Web
experiences with complex behavior, we have to first go back to some basics that apply to nearly all computer
programming languages, and then explore some of the features that make Javascript somewhat unique among
programming languages. This creates an excellent opportunity to explore the fundamentals of programming while
building practical, useful skills in a popular area of software development.
Course Materials
This book is recommended for students in this course, and there will be references to its pages in every weeks lessons.
The book is available to students from the Harvard Library Safari Books Online subscription, but theres nothing quite
like a physical copy of your own.
Modern Javascript: Develop and Design
by Larry Ullman
ISBN-10: 0321812522
Available from Amazon, Barnes and Noble, and other booksellers
Also available from the Harvard University Library via Safari Books Online (login with HUID
and PIN): http://proquest.safaribooksonline.com.ezp-
prod1.hul.harvard.edu/book/programming/javascript/9780132905848

Introduction to Web Programming Using Javascript 1 Introduction to Web Programming Using Javascript 2
How to Take This Course Unit Problem sets will generally have deadlines 2-5 weeks after they are made available to students, so having
discipline to do some work each week will make a huge difference to your workload. Assume 1-5 hours per
Though this course is an online course, it is not a self-paced course. Materials and assignments will be published on a week, depending on the problem set.
weekly schedule. Each week will consist of:

A set of course Canvas pages that weave together readings, code examples, brief video lessons, web references
and other material to deliver the content and concepts of the weeks topic. There are no long-format video
lectures this course is specifically built for online delivery, with all of its video produced specifically for this
version of the course. The professor will be present in the course on an ongoing basis. Assignments & Evaluation
Readings from the assigned textbook and various Web resources
An optional one-hour section meeting led by one of the course Teaching Fellows. Description Points
Learning to program is a bit like learning to play a musical instrument or learning to speak a foreign language.
Weekly Activities (small assignments, practice sets, peer 150 points
You cant learn to do it without spending time at the keyboard: designing, coding, debugging, and occasionally review)
getting frustrated along the way. To this end, each week will contain one or more Practice Set assignments that
requires you to do research, design solutions, and/or write small bits of code. Four Unit Problem Set assignments over the course of the 600 points
Most weeks will include a peer assessment activity, in which students review Practice Set submissions by other term (150 points each)
students. This activity increases students familiarity with viewing code and recognizing its structure; as well as
Graduate-credit Assignments (33 Points Each) 100 points
exposes students to a variety of possible solutions and approaches to a single problem.
Interaction in the class discussion area on Piazza. Piazza will be the primary place for informal discussion, Final Project 150 points
Q&A, and other interaction between instructors, TAs, and students.
TOTAL 900/1000 points (undergraduate/graduate credit)
Unit Problem Sets: The Unit Problem Sets will contain multiple problems of increasing difficulty, and its expected that
the problems will be done over several weeks time. These problems will be designed to provide experience with real-
world applications of the Javascript concepts learned in the unit. Students will have several weeks to complete these
Assignment Submission: Weekly activities such as Practice Sets will typically be due Mondays at 11:59pm and will not
assignments.
be accepted late. Together, the weekly activities are designed to be worth about 15% of your final course grade. The are
In addition, there will be a final project in which you will use a number of the Javascript techniques covered in the designed so that missing a few due to work or family commitments will not damage your final grade very much, but
course to accomplish something useful (of your choosing). doing them regularly will provide essential practice, keep you engaged with the course week-to-week, and enhance your
final grade. There will be extra-credit opportunities available to help you offset missing a few weekly activities.
Graduate Credit: Students taking the course for graduate credit will have three additional assignments over the
duration of the course. In these assignments, graduate students will demonstrate a deeper level of understanding by Unit Problem Sets will be due at 11:59pm on the published due date, which will always be on a Monday before the next
creating teaching materials or practice sets that exercise concepts covered in the prior weeks of the course. Unit starts. We recognize that students have lives that may sometimes present challenges to getting homework done on
time, therefore each student is given 5 late days for homework at the beginning of the semester. A late day extends the
individual homework project deadline by 24 hours without penalty. You can use them all at once on a single
Expected Time Commitment assignment, here and there for an extra day when you need it, or not at all.

The standard classroom version of this course included a two-hour lecture each week, plus a one-hour optional section, For homework thats late in excess of the five grace days, there will be a 10% penalty for homework less than 2 days
and the assigned readings and problems. The online course will not take less time than the classroom course. The time late, and 20% for less than five days late. Homework more than 5 days late will not be accepted.
commitment will vary according to students prior programming experience, as well as their motivation to push
themselves to the most solid understanding of the course material. The final project is due at 11:59pm the Monday night of the final class week. No late submissions will be accepted on
the final project.
To be clear, in prior teachings of this course, the variation between students perception of the courses difficulty were
quite significant and generally fit on a bell curve. Thus, while its impossible to predict the specific time commitment for We will hold an on-campus project presentation session the final week so that students can demo their projects and/or
an individual, some reasonable targets for typical weekly student time commitment follow: see those of others. Remote students may participate (both viewing and presenting) via Web video conferencing. More
details on this will be arranged in the final weeks of the semester. Attendance and participation in this session is
Two to three (undistracted) hours to go through the lessons in Canvas each week, reading carefully, examining optional.
and understanding the example code, watching the video lessons and demonstrations.
One hour for section meeting (optional, but highly recommended), at which TAs will work through code
examples, present additional material that may help with Unit Problem Sets, answer questions and generally
offer support. Some students choose to attend more than one section per week.
One to four hours on the practice sets, which are designed to exercise your understanding of individual
concepts introduced in the lesson.

Introduction to Web Programming Using Javascript 3 Introduction to Web Programming Using Javascript 4

Academic Integrity
Harvard Extension School expects students to understand and maintain high standards of academic integrity. Breaches of academic
integrity are subject to review by the Administrative Board and may be grounds for disciplinary action, up to and including
requirement to withdraw from the Extension School and suspension of registration privileges.
A Note about Academic Honesty that appears in other Harvard CS courses,1 :
Do not submit as your own work a program based on the work of another! Violations of this rule is plagiarism; it is
dishonorable behavior, and the penalty for it is requirement to withdraw from Harvard College.
Two obvious "exceptions" to this rule may be noted in passing. Courses sometimes supply the main idea or even some
of the text of a program that is to be completed as an exercise; naturally, students are expected to use this assistance.
And there is merit in copying from oneself in a course that develops cumulative programming skills. Here programs
differ from papers; no author would want to write two different pieces with several paragraphs in common, but with
computer programs, this is not unusual. A skill taught in programming courses is how NOT to reinvent the wheel; when
a small phrase or short sentence has proven useful and reliable in one program, a programmer should feel free to reuse it
if the same thing needs to be said in another program. Such clauses play the role of aphorisms; they make a point but
they are not the main point of the piece being written.
Of course, neither of these examples obscures the basic point that a program submitted as original work should not have
been derived from the work of another unless the course has specifically permitted this.
How much help on a programming exercise may you obtain before you are stealing, rather than being assisted?
Teaching fellows and user assistants know the limitations of what is fair and legitimate; their goal is to help you
understand how to solve your own problem, not to solve it for you. If you seek help from other students you are treading
on much thinner ice. When a student answers a simple factual question which could have been answered out of a
manual, no violation of principle is involved; it is not dishonest to ask another student the value of PI or the statement of
the Pythagorean Theorem. But the more your request is for part or all of the solutions to the programming exercise
itself, rather than for general factual information, the less acceptable it is. In the extreme case one student asks for and
receives the actual text of a program which both were to have created independently; in this case both are guilty of
academic dishonesty.
In the Harvard College Handbook for Students is a section related to collaboration:
It is expected that all homework assignments, projects, lab reports, papers, theses, and examinations and any other
work submitted for academic credit will be the students own. Students should always take great care to distinguish
their own ideas and knowledge from information derived from sources.
PLAGIARISM
Plagiarism is the theft of someone elses ideas and work. It is the incorporation of facts, ideas, or specific language that
are not common knowledge, are taken from another source, and are not properly cited.
Whether a student copies verbatim or simply rephrases the ideas of another without properly acknowledging the source,
the theft is the same. A computer program written as part of the students academic work is, like a paper, expected to be
the students original work and subject to the same standards of representation. In the preparation of work submitted to
meet course, program, or school requirements, whether a draft or a final version of a paper, project, take-home exam,
1
The principal author of this section is Prof. Harry R. Lewis, Gordon McKay Professor of Computer Science.
Introduction to Web Programming Using Javascript
computer program, placement exam, application essay, oral presentation, or other work, students must take great care
to distinguish their own ideas and language from information derived from sources. Sources include published and
unpublished primary and secondary materials, the Internet, and information and opinions of other people.
Extension School students are responsible for following the standards of proper citation to avoid plagiarism. A useful
resource is The Harvard Guide to Using Sources prepared by the Harvard College Writing Program and the Extension
Schools tips to avoid plagiarism.
INAPPROPRIATE COLLABORATION AND OTHER ASSISTANCE
Collaboration on assignments is prohibited unless explicitly permitted by the instructor. When collaboration is
permitted, students must acknowledge all collaboration and its extent in all submitted work. Collaboration includes the
use of professional or expert editing or writing services, as well as statistical, coding, or other outside assistance. Because
it is assumed that work submitted in a course is the students own unless otherwise permitted, students should be very
clear about how they are working with others and what types of assistance, if any, they are receiving. In cases where
assistance is approved, the student is expected to specify, upon submission of the assignment, the type and extent of
assistance that was received and from whom. The goal of this oversight is to preserve the status of the work as the
students own intellectual product. Students should remember that the Writing Center is available to assist them with
assessing and editing their own work.
CHEATING
Students may not copy other students work, computer programs or parts of programs, or exams. To avoid any
suggestions of improper behavior during an exam, students should not communicate with other students during the
exam. Neither should they refer to any books, papers, or use electronic devices during the exam without the permission
of the instructor or proctor. All electronic devices must be turned off during an exam.
DUPLICATE ASSIGNMENTS
Students are expected to submit work that is done solely for each course in which they enroll. Prior written permission
of all instructors is required if students wish to submit the same or similar work in more than one course.
Students who repeat a course must have the instructor's approval to reuse or resubmit work that they previously
submitted for the same course.
Weekly Schedule
This is a general guide to the course structure and content. Weekly details are subject to change.
WEEK LESSON TOPICS
DATE
UNIT 1: Programming Fundamentals
1 January 25 Introduction
Course objectives, structure and processes
Communication, Assignments, Support
Program design: Plan before you code
5 Introduction to Web Programming Using Javascript 6
 WEEK LESSON TOPICS
DATE
2 February 2 Basics of the Javascript environment
The browser and Web page execution cycle
Authoring and debugging code
The roles and relationships between HTML, CSS and Javascript

UNIT 2: The Javascript Language

3 February 9 Basic data types, variables, objects, and mathematical operations

4 February 16 Control structures, conditionals, looping, functions

5 February 23 Data and data structures

Objects
Arrays
Dates and other built-in data objects

6 March 1 More data structures

Functions, objects, and data
JSON
Advanced control structures
7 March 8 The real power of JS a deep dive into functions
Inheritance, prototypes, function literals, scoping and closures

March 15: Spring Break Week No New Content, No Due Dates

Unit 3: Javascript and the behavior of Web pages
8 March 22 Making Web pages behave: manipulating the DOM

9 March 29 Working with Browser Events

Script loading, responding to keyboard input or mouse activity, scrolling
10 April 5 Forms and AJAX

11 April 12 Using Javascript Libraries for Advanced Behavior

JQuery and others
Animations, AJAX, form and data handling

Unit 4: Javascript Libraries and Advanced Applications

12 April 19 Understanding How Libraries Work & Extending jQuery
Library Architecture and design patterns
Writing a JQuery plugin

13 April 26 More LibrariesVideo and UI Widgets

Using and Controlling HTML5 Audio/Video
MediaPlayer Libraries

14 May 3 Animation and the <canvas> element

15 May 11 Final Projects due (night before)

Possible in-class meeting for project presentations

Introduction to Web Programming Using Javascript 7