ET-712 Web Client Programming

COURSE 3:

Department of Engineering Technology

ET 712 – Web Client Programming

COURSE CREDIT: 3 (2 Lecture hours, 2 laboratory hours)


Day:  Mon, Tues, Wed, Thurs

Time: 6:10pm – 9:50pm

Room: T-02B

       

COURSE DESCRIPTION


Students will learn to write interactive front-end Web Client programs using JavaScript and JQuery. The course will start teaching the basic programming concepts of JavaScript and how to apply them into a project. Later, JQuery will be introduced as a feature-rich JavaScript library that will help students in the process of writing scripts such as HTML and JavaScript, faster and easier. Also, students will learn how to implement and manipulate different web development techniques and frameworks such as Ajax, JSON, APIs, and how to apply cyber-security technology to keep information safe on the network. At the end, students will learn how to manage project individually and as part of a team. At the projects, students will learn how to deal with error-handling and debugging, filter and sort data and images, and enhance forms to validate user entries.


COURSE OBJECTIVES


At the end of the training process, student shall be able to:

  • Build and test code using text editor and translate design instruction into code.
  • Collect and use existing routines or procedures and integrate them into their code.
  • Translate design direction into a responsive implementation using different web client techniques such as JavaScript, JQuery, Ajax, and APIs.
  • Customize frameworks, bootstrap and AngularJS like a blueprint or a template, for their application.
  • Students will take responsibility for their behavior in a team project, carry his/her share of the team’s load and work with people with a variety of ideas and participate in a team culture.
  • Effectively communicate with instructors and colleagues for important decisions and supports on application and development of projects.
  • Students build the capacity to understand and appreciate each other’s perspective in order to anticipate the needs of the project, customers and/or team.

COURSE MATERIALS

TEXTBOOK

JavaScript & JQuery: Interactive front-end web development by Jon Duckett

ISBN-13: 978-1118531648

ISBN-10: 1118531647


ONLINE LEARNING

https://www.codecademy.com

https://w3school.com


GENERAL INFORMATION


ATTENDANCE:  1-19 minutes is considered ONE LATE, THREE lateness is equal to ONE ABSENCE, and THREE absences result in a “WF” or “F” as the lab grade. More than 20 minutes late counts as an absence.


LECTURE CONDUCT: No eating, drinking, smoking, radio playing, cell-phones, and use of inappropriate words in the classroom. Student should clean up the work bench before leaving the classroom at the end of the session; a dirty bench gets points off for the each exam grade.


CLASS ASSIGNMENTS: There are a total of 10 Class Assignment during the semester. Students are required to perform satisfactory work in the lecture and laboratory in order to receive a passing grade in the course. Each Class Assignment is done individually during lab schedule. All Class Assignments MUST be submitted before due date, late Class Assignments will not be accepted and it will be graded as “zero”.


PROJECTS: There are a total of three main projects during the semester. All Projects MUST be typed, presented in a professional manner, and submitted before due date, late Projects will not be accepted and it will be graded as “zero”.


ACADEMIC INTEGRITY POLICY (Department or College): Academic honesty is expected of all students. Any violation of academic integrity is taken extremely seriously. All assignments and projects must be the original work of the student or teammates. Plagiarism will not be tolerated. Any questions regarding academic integrity should be brought to the attention of the instructor. The following is the Queensborough Community College Policy on Academic Integrity: “It is the official policy of the College that all acts or attempted acts that are violations of Academic Integrity be reported to the Office of Student Affairs. At the faculty member’s discretion and with the concurrence of the student or students involved, some cases though reported to the Office of Student Affairs may be resolved within the confines of the course and department. The instructor has the authority to adjust the offender’s grade as deemed appropriate, including assigning an F to the assignment or exercise or, in more serious cases, an F to the student for the entire course.” The college’s policy on Academic Integrity can be found at


http://www.qcc.cuny.edu/governance/docs/Academic_Integrity_Document.pdf



DISABILITIES: Any student who feels that he or she may need an accommodation based upon the impact of a disability should contact me privately to discuss his/her specific needs. Please contact the office of Services for Students with Disabilities in Science Building, Room S-132, 718-631-6257 to coordinate reasonable accommodations for students with documented disabilities. You can visit the Services for Students with Disabilities website by clicking on this link: http://www.qcc.cuny.edu/SSD/.


Average of Class Assignments: 40%

Project 1: 20%

Project 2: 20%

Team Project: 20%

TOTAL: 100%


LETTER/ POINTS RANGE/ GPA

A Excellent/ 96-100/ 4.0

A-/ 90-95/ 3.7

B+/ 87-89/ 3.3

B Good/ 84-86/ 3.0

B-/ 80-83/ 2.7

C+/ 77-79/ 2.3

C Satisfactory/ 74-76/ 2.0

C-/ 70-73/ 1.7

D+/ 67-69/ 1.3

D Passing/ 64-66/ 1.0

D-/ 60-63/ 0.7

F Failure/ 0-59/ 0

COURSE OUTLINE


Day 1: Introduction to JavaScript

In this session, students understand the key concepts in computer programming: what is computer programming, what the scripting language is, what is the difference between scripting and compiling language, how a flowchart and pseudo code is, how computers fit in with the world around them, how to write a script of a web page, and how JavaScript is used to change the contents of an HTLM page.  

Students will start learning to read and write JavaScript, understand the syntax and grammar of JS, how JS gives a web browser instructions you want it to follow, and how to start with a few building blocks of the language and look at how they can be used to write some very basic scripts, variables, strings, arrays, and operators.

Class Activity 1:

Textbook: Chapter 1: The ABC of programming, Chapter 2: Basic JavaScript Instructions (page 1 – 84)


Day 2: Decisions and Loops

In this session, students learn how to create and control the flow of data in a scripts to handle different situations. To do so, students learn how to analyze values in a script to determine whether or not they match expected results, decide which path to follow according to the results of evaluations, and what to do to repeat the same set of steps.

Class Activity 2:

Textbook: Chapter 4: Decisions and Loops  (Page 145 – 182)


Day 3: Functions, methods, and objects

Students are also leaning how to use functions, methods, and objects to organize their code.

Class Activity 3:

Textbook: Chapter 3: Functions, methods, and objects (page 85 – 144)


Day 4: Document Object Model

This session, students also learn how the Document Object Model (DOM) or Application Programming Interface (API) specifies how browsers should create a model of an HTML page and how JavaScript can access and update the contents of a web page while it is in the browser window.

Class Activity 4

Textbook: Chapter 5: Document Object Model (Page 183 – 242)


Day 5: Events

In the fifth day, students learn how to write scripts that often respond to events by updating the content of the web page through APIs, which makes the page feel more interactive.

Class Activity 5:

Textbook: Chapter 6: Events (Page 243 – 292)


Day 6: Project 1


Days 7-8: JQuery

In the seventh and eighth day, students are introduced to JQuery as a simple way to achieve a variety of common JavaScript tasks quickly and consistently.

Class Activity 6:

Textbook: Chapter 7: JQuery (Page 293 – 366)


Day 9: AJAX and JSON

In the ninth day, students learn how to use Ajax as a technique to load data into part of a page without having to refresh the entire page. This topic include the understanding on how Ajax allows user to request data from a server and load it without having to refresh the entire page, how server interpret data format in HTML, XML, or JSON, and how to use JQuery makes it easier to create Ajax requests and process the data the server returns.

Class Activity 7:

Textbook: Chapter 8: AJAX and JSON (Page 367 – 408)


Day 10: APIs

On day ten, students are also learning Application Programming Interfaces (APIs) and how they allow scripts to access and update the contents of a webpage while loaded in the browser.

Class Activity 8:

Textbook: Chapter 9: APIS (Page 409 – 448)


Day 11:  Error handling and debugging

On this day, students learn how to find the errors in your code. Some of the techniques include how to use the tools built into the browser that help the programmer to hunt for errors, how to identify common sources of errors and how to fix them, and how code can deal with potential error gracefully.

Students also learn how to several examples of content panels that can also give students a practical insight to create scripts using jQuery.

Class Activity 9:

Textbook: Chapter 10: Error Handling & debugging, Chapter 11: Content Panels (Page)


Day 12: Filtering, searching and sorting, and form enhancement and validation

On day twelve, students learn how to filter values by selecting the ones that meet stated criteria, how to search information to show the items that match one of more words the user specifies, and how to reorder a set of items on the page based of criteria.

Project 2

Textbook: Chapter 12: Filtering, searching and sorting, Chapter 13: Form enhancement and validation


Day 13 and 14: Introduction to framework and how to work with Angular JS

On day eleven, students will be introduced to Bootstrap technology to manipulate basic style, master layouts and layout components, and navigation components.

Class Assignment 9

Textbook: Material will be provided by instructor


Day 15: Complete team project

NOTE: Instructor reserves the right to modify the present outline anytime.

 

Campus Cultural Centers

Kupferberg Holocaust Center (KHC)Opens in a new window
Kupferberg Holocaust Center Opens in a new window

Using the lessons of the Holocaust to educate current and future generations about the ramifications of unbridled prejudice, racism and stereotyping.

Queensborough Performing Arts CenterOpens in a new window
QPAC: Performing Arts CenterOpens in a new window

QPAC is an invaluable entertainment company in this region with a growing national reputation. The arts at QPAC continues to play a vital role in transforming lives and building stronger communities.

Queensborough Art GalleryOpens in a new window
QCC Art GalleryOpens in a new window

The QCC Art Gallery of the City University of New York is a vital educational and cultural resource for Queensborough Community College, the Borough of Queens and the surrounding communities.