Part 1: jquery & History of DOM Scripting

Size: px
Start display at page:

Download "Part 1: jquery & History of DOM Scripting"

Transcription

1 Karl Swedberg: Intro to JavaScript & jquery 0:00:00 0:05:00 0:05:01 0:10:15 0:10:16 0:12:36 0:12:37 0:13:32 0:13:32 0:14:16 0:14:17 0:15:42 0:15:43 0:16:59 0:17:00 0:17:58 Part 1: jquery & History of DOM Scripting Benefits of Using jquery (and Karl s Story) Introduction to Karl and his contributions to the jquery Project What is DOM Scripting and book recommendations. Karl explains how painful DOM Scripting was to do in the past which gave birth to jquery (and other DOM Scripting libraries). He also gives us an example of feature testing Karl s story tells first-hand how jquery allows you to progress quickly. He went from a beginner creating to eventually being contacted by a publisher to write the Learning jquery book jquery s core developers spend a lot of time fixing browser inconsistencies which helps improve your efficiency as a developer Excellent documentation for jquery and Karl hints at a new jquery learning site How jquery pioneered unobtrusive JavaScript Example of DOM Scripting vs using jquery to get the viewport dimensions Where to get help and support with jquery 0:17:59 0:18:39 0:18:40 0:19:18 0:19:19 0:21:09 0:21:10 0:24:18 Core Concepts of jquery Find something, do something Why jquery uses the $ character as it s main function Overview of the $() Function, passing a selector string into this main function creates an array-like collection of elements What you can do with jquery and what it excels at 0:24:19 0:26:14 0:26:15 0:28:33 Part 2: Developer Tools Debbuggers, Libraries, Code Sharing Introduction, pain of testing in multiple browsers Use Modernizr for feature testing and polyfills (i.e. backfill canvas support with VML) 1

2 0:29:01 0:30:12 0:30:13 0:32:51 0:32:52 0:38:15 0:38:16 0:42:35 0:42:36 0:45:47 0:45:48 0:46:39 0:47:00 0:48:11 0:48:12 0:49:27 Audience gives Karl a feature to research browser support with Code sharing tools like jsbin and jsfiddle can be useful for quickly mocking something up or getting help over IRC and forums TextMate can be enhanced with bundles and Karl demos a few he finds helpful. He also lists a few popular code editors for both Mac and PC. Firefox Firebug and Chrome Developer Tools Karl demos some of his favorite Chrome Dev. Tools tricks ($0, color format, keyboard shortcuts, save to css file, etc) Enabling Safari Developer Menu IE8+ (F12) Developer Tools and options for IE7 and lower *bonus info* Karl s favorite compliment! :) 0:49:28 0:54:17 0:54:18 0:56:12 0:56:13 0:38:15 0:58:28 1:02:11 1:02:12 1:04:54 1:04:55 1:10:50 1:10:51 1:11:36 1:11:37 1:12:19 1:12:20 1:15:26 1:15:27 1:17:32 1:17:33 1:18:13 Part 3: Bare-bones JavaScript Basic Working Knowledge of the Language JavaScript primitives: Strings (quotes), Numbers, Booleans, Arrays and Objects...covers a few things to note about Arrays like: index starts at 0 (unlike nth-child in CSS which starts at 1), mixing types in arrays and nesting arrays JavaScript variables - making sure to declare them because of scoping issues Conditionals, operators and logical operators like +, -, %, &&,, >, <, ==,!=, ===, etc Demo of == vs === 0 and empty string are falsy and not exactly false JavaScript loops use explicit iterations vs CSS uses implicit iteration but jquery allows for both. List of types of loops Breaking-down for loops and examples of a few different ways to use them For-in loops for iterating through keys in objects While and do-while loops and how they don t iterate for you Functions - naming them, returning values and assigning returns arguments object to allow for unlimited arguments to be passed to a function Exercise (using arguments and for loop). *Try coding the answer!* 2

3 1:18:14 1:25:31 1:25:32 1:27:48 1:27:49 1:28:10 Live coding of answer using arguments, += and a for loop Audience throws a wrench into Karl s answer by passing in a string number and Karl shows how to solve it using parsefloat. These basics should be familar to you in jquery-land 1:28:11 1:29:45 1:29:46 1:32:14 1:32:15 1:34:57 1:34:58 1:35:45 1:35:46 1:37:43 1:37:44 1:38:54 Named and Anonymous Functions Returning functions (multiplication example) Named vs Anonymous functions List of uses for anonymous functions and code example using named function vs anonymous in as a callback Audience asks, Do elements have a.ready? Karl says no but explains about load Using immediately invoked function expressions (aka IFFE pronounced iffy ) for protecting variable scope Using anonymous functions as a callback 1:38:55 1:39:10 1:39:11 1:39:51 1:39:52 1:39:57 1:39:58 1:40:48 1:40:49 1:40:55 1:40:56 1:41:28 1:40:29 1:42:12 1:42:13 1:43:39 1:43:40 1:47:41 1:47:42 1:49:38 1:49:49 1:50:39 Objects In JavaScript nearly everything is an object window is a global object and list of some of it s useful properties and methods Date object and it s methods RegExp object constructor vs expression literal Math object (slide with list of Math functions) Similarities between object literals and CSS rules Functions and objects can be properties of objects Leaving trailing commas in your objects causes bugs in IE Using dot and array notations to access properties in objects and example Example of using array notation with passing in a string variable Advanced example of iterating through an object and using dot notation 3

4 1:50:40 1:52:05 1:52:07 1:54:39 Using objects as a single argument to pass in multiple options (like with jquery plugins) JSON (JavaScript Object Notation) as a subset of the object literal 1:54:40 2:00:04 2:00:05 2:03:09 2:03:10 2:09:18 2:09:19 2:10:32 2:10:33 2:10:32 jquery and JavaScript Loading Referencing scripts in HTML, loading jquery locally or from a CDN. Performance considerations for script loading $(document).ready() vs $(window).load() - when to use (or not use) each method. Tips on executing JavaScript before $(document).ready like in the case of immediate ajax calls and avoiding the dreaded flash of unstyled content Script loaders for loading scripts asynchronously Script placement and execution (demo) 2:10:33 2:16:36 2:16:37 2:18:40 Part 4: jquery Selectors and Traversal Find something Finding with jquery using CSS selectors and explanation of selectors like + and ~ Attribute selectors [attr...], custom form selectors and misc selectors 2:18:41 2:24:18 2:24:19 2:25:56 2:25:57 2:28:52 2:28:53 2:34:10 2:34:11 2:36:48 2:36:49 2:37:19 2:36:49 2:25:07 Traversal methods Moving up - parent and closest methods (with a note about usefullness of nextuntil) Moving sideways - siblings, next, prev Moving down - children, find Filtering - filter (with selector or function), not, slice (code demo), eq Context - second param in jquery (Karl recommends just using find), add, andself, end Check - hasclass, is (returns boolean) Demos of traversal with next, nextuntil (also Karl fixes his demo), nth-child, firstchild, last-child, last, eq. Audience asks if nth-child works in IE through jquery. Karl answers yes and explains why 2:52:08 2:37:19 Chaining and Looping JavaScript itself has chaining. Examples with replace, split and join methods. 4

5 2:54:26 2:56:01 2:56:02 3:00:47 3:00:48 3:04:22 3:04:23 3:06:18 Chaining traversal methods returns new jquery collection Using the end method to step back through collections and strategies for chaining Looping - implicit iteration vs explicit iteration using each this refers to current element 3:06:19 3:07:32 3:07:34 3:11:07 3:11:08 3:13:36 3:13:37 3:15:10 jquery Selecting Tips Store selectors in variable for later use (can prefix variables with $ to idenify it as a jquery collection) Use.length to check if something exists, but often times you don t need to because jquery operates on on empty collections without throwing an error Avoid custom selectors (slow) and alternatives Selector methods like first, eq, and slice are better than psuedo selectors like :first 3:15:11 3:16:01 3:16:02 3:32:07 3:32:08 3:28:35 3:28:36 3:32:35 3:32:36 3:35:52 Part 5: Q & A Open questions with Karl Karl says that the next workshop is all jquery all the time Audience asks about putting all code in external script files and sharing variables from server side languages. Karl demos PHP json_encode to export variables to JavaScript Karl goes more in-depth into variable scoping, namespacing and using IFFEs Audience asks where is jquery going? In terms of popularity over 50% of the top 10,000 websites use it (more than Flash). Karl breaks down version number usage and how jquery team s release cycle is getting faster and why old versions exist Audience asks if you break things when upgrading jquery. Karl says there aren t many breaking changes but with 3rd party plugins it can get tricky. He also explains how jquery takes backwards compatibility very seriously 5

The course is supplemented by numerous hands-on labs that help attendees reinforce their theoretical knowledge of the learned material.

The course is supplemented by numerous hands-on labs that help attendees reinforce their theoretical knowledge of the learned material. Lincoln Land Community College Capital City Training Center 130 West Mason Springfield, IL 62702 217-782-7436 www.llcc.edu/cctc WA2442 Introduction to JavaScript Objectives This intensive training course

More information

JavaScript CS 4640 Programming Languages for Web Applications

JavaScript CS 4640 Programming Languages for Web Applications JavaScript CS 4640 Programming Languages for Web Applications 1 How HTML, CSS, and JS Fit Together {css} javascript() Content layer The HTML gives the page structure and adds semantics Presentation

More information

This course is designed for web developers that want to learn HTML5, CSS3, JavaScript and jquery.

This course is designed for web developers that want to learn HTML5, CSS3, JavaScript and jquery. HTML5/CSS3/JavaScript Programming Course Summary Description This class is designed for students that have experience with basic HTML concepts that wish to learn about HTML Version 5, Cascading Style Sheets

More information

footer, header, nav, section. search. ! Better Accessibility.! Cleaner Code. ! Smarter Storage.! Better Interactions.

footer, header, nav, section. search. ! Better Accessibility.! Cleaner Code. ! Smarter Storage.! Better Interactions. By Sruthi!!!! HTML5 was designed to replace both HTML 4, XHTML, and the HTML DOM Level 2. It was specially designed to deliver rich content without the need for additional plugins. The current version

More information

JQuery WHY DIDN T WE LEARN THIS EARLIER??!

JQuery WHY DIDN T WE LEARN THIS EARLIER??! JQuery WHY DIDN T WE LEARN THIS EARLIER??! Next couple of weeks This week: Lecture: Security, jquery, Ajax Next Week: No lab (Easter) I may post a bonus (jquery) lab No quiz (yay!) Maybe a bonus one? Snuneymuxw

More information

JavaScript. History. Adding JavaScript to a page. CS144: Web Applications

JavaScript. History. Adding JavaScript to a page. CS144: Web Applications JavaScript Started as a simple script in a Web page that is interpreted and run by the browser Supported by most modern browsers Allows dynamic update of a web page More generally, allows running an arbitrary

More information

CGS 3066: Spring 2015 JavaScript Reference

CGS 3066: Spring 2015 JavaScript Reference CGS 3066: Spring 2015 JavaScript Reference Can also be used as a study guide. Only covers topics discussed in class. 1 Introduction JavaScript is a scripting language produced by Netscape for use within

More information

JavaScript. History. Adding JavaScript to a page. CS144: Web Applications

JavaScript. History. Adding JavaScript to a page. CS144: Web Applications JavaScript Started as a simple script in a Web page that is interpreted and run by the browser Supported by most modern browsers Allows dynamic update of a web page More generally, allows running an arbitrary

More information

Introduction to JavaScript p. 1 JavaScript Myths p. 2 Versions of JavaScript p. 2 Client-Side JavaScript p. 3 JavaScript in Other Contexts p.

Introduction to JavaScript p. 1 JavaScript Myths p. 2 Versions of JavaScript p. 2 Client-Side JavaScript p. 3 JavaScript in Other Contexts p. Preface p. xiii Introduction to JavaScript p. 1 JavaScript Myths p. 2 Versions of JavaScript p. 2 Client-Side JavaScript p. 3 JavaScript in Other Contexts p. 5 Client-Side JavaScript: Executable Content

More information

JavaScript CS 4640 Programming Languages for Web Applications

JavaScript CS 4640 Programming Languages for Web Applications JavaScript CS 4640 Programming Languages for Web Applications 1 How HTML, CSS, and JS Fit Together {css} javascript() Content layer The HTML gives the page structure and adds semantics Presentation

More information

jquery Cookbook jquery Community Experts O'REILLY8 Tokyo Taipei Sebastopol Beijing Cambridge Farnham Koln

jquery Cookbook jquery Community Experts O'REILLY8 Tokyo Taipei Sebastopol Beijing Cambridge Farnham Koln jquery Cookbook jquery Community Experts O'REILLY8 Beijing Cambridge Farnham Koln Sebastopol Taipei Tokyo Foreword xi Contributors xiii Preface xvii 1. jquery Basics 1 1.1 Including the jquery Library

More information

Copyright Descriptor Systems, Course materials may not be reproduced in whole or in part without prior written consent of Joel Barnum

Copyright Descriptor Systems, Course materials may not be reproduced in whole or in part without prior written consent of Joel Barnum Ajax The notion of asynchronous request processing using the XMLHttpRequest object has been around for several years, but the term "AJAX" was coined by Jesse James Garrett of Adaptive Path. You can read

More information

Frontend guide. Everything you need to know about HTML, CSS, JavaScript and DOM. Dejan V Čančarević

Frontend guide. Everything you need to know about HTML, CSS, JavaScript and DOM. Dejan V Čančarević Frontend guide Everything you need to know about HTML, CSS, JavaScript and DOM Dejan V Čančarević Today frontend is treated as a separate part of Web development and therefore frontend developer jobs are

More information

Index. Boolean value, 282

Index. Boolean value, 282 Index A AJAX events global level ajaxcomplete, 317 ajaxerror, 316 ajaxsend, 316 ajaxstart, 316 ajaxstop, 317 ajaxsuccess, 316 order of triggering code implementation, 317 display list, 321 flowchart, 322

More information

INTERFACE FOUNDATIONS OF WEB DEVELOPMENT

INTERFACE FOUNDATIONS OF WEB DEVELOPMENT INTERFACE FOUNDATIONS OF WEB DEVELOPMENT FOUNDATIONS OF WEB DEVELOPMENT SYLLABUS Course Description Foundations of Web Development is a 10-week, part-time course where students learn the basic concepts

More information

,

, Weekdays:- 1½ hrs / 3 days Fastrack:- 1½hrs / Day [Class Room and Online] ISO 9001:2015 CERTIFIED ADMEC Multimedia Institute www.admecindia.co.in 9911782350, 9811818122 Welcome to one of the highly professional

More information

JavaScript. Training Offer for JavaScript Introduction JavaScript. JavaScript Objects

JavaScript. Training Offer for JavaScript Introduction JavaScript. JavaScript Objects JavaScript CAC Noida is an ISO 9001:2015 certified training center with professional experience that dates back to 2005. The vision is to provide professional education merging corporate culture globally

More information

Course 2320 Supplementary Materials. Modern JavaScript Best Practices

Course 2320 Supplementary Materials. Modern JavaScript Best Practices Supplementary Materials Modern JavaScript 1 Modern JavaScript JavaScript is an essential component of HTML5 web applications Required by HTML5 application programming interfaces (APIs) Extends basic functionality

More information

JAVASCRIPT AND JQUERY: AN INTRODUCTION (WEB PROGRAMMING, X452.1)

JAVASCRIPT AND JQUERY: AN INTRODUCTION (WEB PROGRAMMING, X452.1) Technology & Information Management Instructor: Michael Kremer, Ph.D. Class 4 Professional Program: Data Administration and Management JAVASCRIPT AND JQUERY: AN INTRODUCTION (WEB PROGRAMMING, X452.1) AGENDA

More information

Client-Side Web Technologies. JavaScript Part I

Client-Side Web Technologies. JavaScript Part I Client-Side Web Technologies JavaScript Part I JavaScript First appeared in 1996 in Netscape Navigator Main purpose was to handle input validation that was currently being done server-side Now a powerful

More information

Jquery Manually Set Checkbox Checked Or Not

Jquery Manually Set Checkbox Checked Or Not Jquery Manually Set Checkbox Checked Or Not Working Second Time jquery code to set checkbox element to checked not working. Apr 09 I forced a loop to show checked state after the second menu item in the

More information

jquery Tutorial for Beginners: Nothing But the Goods

jquery Tutorial for Beginners: Nothing But the Goods jquery Tutorial for Beginners: Nothing But the Goods Not too long ago I wrote an article for Six Revisions called Getting Started with jquery that covered some important things (concept-wise) that beginning

More information

Index. C CakePHP framework, 232 Cascading Style Sheets (CSS)

Index. C CakePHP framework, 232 Cascading Style Sheets (CSS) A Absolute link, 61, 62 Agile project management, 15 16 budget management, 18 19 scope management, 19 20 time management, 17 Ajax. See Asynchronous JavaScript and XML (Ajax) Anonymous functions, 183 188

More information

Master Project Software Engineering: Team-based Development WS 2010/11

Master Project Software Engineering: Team-based Development WS 2010/11 Master Project Software Engineering: Team-based Development WS 2010/11 Implementation, September 27 th, 2011 Glib Kupetov Glib.Kupetov@iese.fraunhofer.de Tel.: +49 (631) 6800 2128 Sebastian Weber Sebastian.Weber@iese.fraunhofer.de

More information

Getting started with jquery MIS Konstantin Bauman. Department of MIS Fox School of Business Temple University

Getting started with jquery MIS Konstantin Bauman. Department of MIS Fox School of Business Temple University Getting started with jquery MIS 2402 Konstantin Bauman Department of MIS Fox School of Business Temple University Exam 2 Date: 11/06/18 four weeks from now! JavaScript, jquery 1 hour 20 minutes Use class

More information

Comprehensive AngularJS Programming (5 Days)

Comprehensive AngularJS Programming (5 Days) www.peaklearningllc.com S103 Comprehensive AngularJS Programming (5 Days) The AngularJS framework augments applications with the "model-view-controller" pattern which makes applications easier to develop

More information

BEFORE CLASS. If you haven t already installed the Firebug extension for Firefox, download it now from

BEFORE CLASS. If you haven t already installed the Firebug extension for Firefox, download it now from BEFORE CLASS If you haven t already installed the Firebug extension for Firefox, download it now from http://getfirebug.com. If you don t already have the Firebug extension for Firefox, Safari, or Google

More information

[paf Wj] open source. Selenium 1.0 Testing Tools. Beginner's Guide. using the Selenium Framework to ensure the quality

[paf Wj] open source. Selenium 1.0 Testing Tools. Beginner's Guide. using the Selenium Framework to ensure the quality Selenium 1.0 Testing Tools Beginner's Guide Test your web applications with multiple browsers the Selenium Framework to ensure the quality of web applications David Burns [paf Wj] open source I I Av< IV

More information

Welcome to CS50 section! This is Week 10 :(

Welcome to CS50 section! This is Week 10 :( Welcome to CS50 section! This is Week 10 :( This is our last section! Final project dates Official proposals: due this Friday at noon Status report: due Monday, Nov 28 at noon Hackathon: Thursday, Dec

More information

SCHEME 7. 1 Introduction. 2 Primitives COMPUTER SCIENCE 61A. October 29, 2015

SCHEME 7. 1 Introduction. 2 Primitives COMPUTER SCIENCE 61A. October 29, 2015 SCHEME 7 COMPUTER SCIENCE 61A October 29, 2015 1 Introduction In the next part of the course, we will be working with the Scheme programming language. In addition to learning how to write Scheme programs,

More information

CSCI-GA Scripting Languages

CSCI-GA Scripting Languages CSCI-GA.3033.003 Scripting Languages 9/11/2013 Textual data processing (Perl) 1 Announcements If you did not get a PIN to enroll, contact Stephanie Meik 2 Outline Perl Basics (continued) Regular Expressions

More information

Lecture 4: Data Collection and Munging

Lecture 4: Data Collection and Munging Lecture 4: Data Collection and Munging Instructor: Outline 1 Data Collection and Scraping 2 Web Scraping basics In-Class Quizzes URL: http://m.socrative.com/ Room Name: 4f2bb99e Data Collection What you

More information

Overview

Overview HTML4 & HTML5 Overview Basic Tags Elements Attributes Formatting Phrase Tags Meta Tags Comments Examples / Demos : Text Examples Headings Examples Links Examples Images Examples Lists Examples Tables Examples

More information

Front End Nanodegree Syllabus

Front End Nanodegree Syllabus Front End Nanodegree Syllabus Build Stunning User Experiences Before You Start You've taken the first step toward becoming a web developer by choosing the Front End Nanodegree program. In order to succeed,

More information

PHP / MYSQL DURATION: 2 MONTHS

PHP / MYSQL DURATION: 2 MONTHS PHP / MYSQL HTML Introduction of Web Technology History of HTML HTML Editors HTML Doctypes HTML Heads and Basics HTML Comments HTML Formatting HTML Fonts, styles HTML links and images HTML Blocks and Layout

More information

Varargs Training & Software Development Centre Private Limited, Module: HTML5, CSS3 & JavaScript

Varargs Training & Software Development Centre Private Limited, Module: HTML5, CSS3 & JavaScript PHP Curriculum Module: HTML5, CSS3 & JavaScript Introduction to the Web o Explain the evolution of HTML o Explain the page structure used by HTML o List the drawbacks in HTML 4 and XHTML o List the new

More information

CL_55244 JavaScript for Developers

CL_55244 JavaScript for Developers www.ked.com.mx Av. Revolución No. 374 Col. San Pedro de los Pinos, C.P. 03800, México, CDMX. Tel/Fax: 52785560 Por favor no imprimas este documento si no es necesario. About this course. This course is

More information

UI Course HTML: (Html, CSS, JavaScript, JQuery, Bootstrap, AngularJS) Introduction. The World Wide Web (WWW) and history of HTML

UI Course HTML: (Html, CSS, JavaScript, JQuery, Bootstrap, AngularJS) Introduction. The World Wide Web (WWW) and history of HTML UI Course (Html, CSS, JavaScript, JQuery, Bootstrap, AngularJS) HTML: Introduction The World Wide Web (WWW) and history of HTML Hypertext and Hypertext Markup Language Why HTML Prerequisites Objective

More information

Course Details. Skills Gained. Who Can Benefit. Prerequisites. View Online URL:

Course Details. Skills Gained. Who Can Benefit. Prerequisites. View Online URL: Specialized - Mastering jquery Code: Lengt h: URL: TT4665 4 days View Online Mastering jquery provides an introduction to and experience working with the JavaScript programming language in the environment

More information

CS Final Exam Review Suggestions - Spring 2018

CS Final Exam Review Suggestions - Spring 2018 CS 328 - Final Exam Review Suggestions p. 1 CS 328 - Final Exam Review Suggestions - Spring 2018 last modified: 2018-05-03 Based on suggestions from Prof. Deb Pires from UCLA: Because of the research-supported

More information

This document is for informational purposes only. PowerMapper Software makes no warranties, express or implied in this document.

This document is for informational purposes only. PowerMapper Software makes no warranties, express or implied in this document. OnDemand User Manual Enterprise User Manual... 1 Overview... 2 Introduction to SortSite... 2 How SortSite Works... 2 Checkpoints... 3 Errors... 3 Spell Checker... 3 Accessibility... 3 Browser Compatibility...

More information

Project Covered During Training:Real Time Project Training

Project Covered During Training:Real Time Project Training Course name: Ajax and JQuery Training with Live Project. CAN YOU CALL/WHATSAPP ME AT 91-9347045052 TO MY MOBILE TO PLANNING AND EXECUTION OF THIS TRAINING. Can you attend demo class today or tomorrow,

More information

JavaScript Specialist v2.0 Exam 1D0-735

JavaScript Specialist v2.0 Exam 1D0-735 JavaScript Specialist v2.0 Exam 1D0-735 Domain 1: Essential JavaScript Principles and Practices 1.1: Identify characteristics of JavaScript and common programming practices. 1.1.1: List key JavaScript

More information

for Lukas Renggli ESUG 2009, Brest

for Lukas Renggli ESUG 2009, Brest for Lukas Renggli ESUG 2009, Brest John Resig, jquery.com Lightweight, fast and concise - Document traversing - Event Handling - AJAX Interaction - Animating High-level, themeable widgets on top of JQuery.

More information

Lesson: Web Programming(6) Omid Jafarinezhad Sharif University of Technology

Lesson: Web Programming(6) Omid Jafarinezhad Sharif University of Technology Lesson: Web Programming(6) Omid Jafarinezhad Sharif University of Technology React QUICK START QUICK START ADVANCED GUIDES React QUICK START Installation Hello World Introducing JSX Components and Props

More information

TIME SCHEDULE MODULE TOPICS PERIODS. HTML Document Object Model (DOM) and javascript Object Notation (JSON)

TIME SCHEDULE MODULE TOPICS PERIODS. HTML Document Object Model (DOM) and javascript Object Notation (JSON) COURSE TITLE : ADVANCED WEB DESIGN COURSE CODE : 5262 COURSE CATEGORY : A PERIODS/WEEK : 4 PERIODS/SEMESTER : 52 CREDITS : 4 TIME SCHEDULE MODULE TOPICS PERIODS 1 HTML Document Object Model (DOM) and javascript

More information

LAST WEEK ON IO LAB. Install Firebug and Greasemonkey. Complete the online skills assessment. Join the mailing list.

LAST WEEK ON IO LAB. Install Firebug and Greasemonkey. Complete the online skills assessment. Join the mailing list. LAST WEEK ON IO LAB If you haven t done these things already, please do them before we begin today s lecture Install Firebug and Greasemonkey. Complete the online skills assessment. Join the iolab@ischool

More information

JAVASCRIPT AND JQUERY: AN INTRODUCTION (WEB PROGRAMMING, X452.1)

JAVASCRIPT AND JQUERY: AN INTRODUCTION (WEB PROGRAMMING, X452.1) Technology & Information Management Instructor: Michael Kremer, Ph.D. Class 1 Professional Program: Data Administration and Management JAVASCRIPT AND JQUERY: AN INTRODUCTION (WEB PROGRAMMING, X452.1) WHO

More information

Introduction. Part I: jquery API 1. Chapter 1: Introduction to jquery 3

Introduction. Part I: jquery API 1. Chapter 1: Introduction to jquery 3 Introduction xix Part I: jquery API 1 Chapter 1: Introduction to jquery 3 What Does jquery Do for Me? 4 Who Develops jquery? 5 Obtaining jquery 5 Installing jquery 5 Programming Conventions 8 XHTML and

More information

JavaScript: Events, the DOM Tree, jquery and Timing

JavaScript: Events, the DOM Tree, jquery and Timing JavaScript: Events, the DOM Tree, jquery and Timing CISC 282 October 11, 2017 window.onload Conflict Can only set window.onload = function once What if you have multiple files for handlers? What if you're

More information

WELCOME TO JQUERY PROGRAMMING LANGUAGE ONLINE TUTORIAL

WELCOME TO JQUERY PROGRAMMING LANGUAGE ONLINE TUTORIAL WELCOME TO JQUERY PROGRAMMING LANGUAGE ONLINE TUTORIAL 1 The above website template represents the HTML/CSS previous studio project we have been working on. Today s lesson will focus on JQUERY programming

More information

Web Application Development

Web Application Development Web Application Development Produced by David Drohan (ddrohan@wit.ie) Department of Computing & Mathematics Waterford Institute of Technology http://www.wit.ie JavaScript JAVASCRIPT FUNDAMENTALS Agenda

More information

JAVASCRIPT AND JQUERY: AN INTRODUCTION (WEB PROGRAMMING, X452.1)

JAVASCRIPT AND JQUERY: AN INTRODUCTION (WEB PROGRAMMING, X452.1) Technology & Information Management Instructor: Michael Kremer, Ph.D. Class 8 Professional Program: Data Administration and Management JAVASCRIPT AND JQUERY: AN INTRODUCTION (WEB PROGRAMMING, X452.1) AGENDA

More information

Summer 2017 Discussion 10: July 25, Introduction. 2 Primitives and Define

Summer 2017 Discussion 10: July 25, Introduction. 2 Primitives and Define CS 6A Scheme Summer 207 Discussion 0: July 25, 207 Introduction In the next part of the course, we will be working with the Scheme programming language. In addition to learning how to write Scheme programs,

More information

Participation Status Report STUDIO ELEMENTS I KATE SOHNG

Participation Status Report STUDIO ELEMENTS I KATE SOHNG 2015 Participation Status Report STUDIO ELEMENTS I KATE SOHNG Table of Contents I. Wataru... 1 A. JQuery discussion... 1 B. Other JavaScript libraries... 1 C. CakePHP framework... 2 D. Webpage feedback...

More information

HTML 5 and CSS 3, Illustrated Complete. Unit L: Programming Web Pages with JavaScript

HTML 5 and CSS 3, Illustrated Complete. Unit L: Programming Web Pages with JavaScript HTML 5 and CSS 3, Illustrated Complete Unit L: Programming Web Pages with JavaScript Objectives Explore the Document Object Model Add content using a script Trigger a script using an event handler Create

More information

JavaScript: The Definitive Guide

JavaScript: The Definitive Guide T "T~ :15 FLA HO H' 15 SIXTH EDITION JavaScript: The Definitive Guide David Flanagan O'REILLY Beijing Cambridge Farnham Ktiln Sebastopol Tokyo Table of Contents Preface....................................................................

More information

a Very Short Introduction to AngularJS

a Very Short Introduction to AngularJS a Very Short Introduction to AngularJS Lecture 11 CGS 3066 Fall 2016 November 8, 2016 Frameworks Advanced JavaScript programming (especially the complex handling of browser differences), can often be very

More information

Why Use A JavaScript Library?

Why Use A JavaScript Library? Using JQuery 4 Why Use A JavaScript Library? Okay, first things first. Writing JavaScript applications from scratch can be difficult, time-consuming, frustrating, and a real pain in the, ahem, britches.

More information

Telerik Test Studio. Web/Desktop Testing. Software Quality Assurance Telerik Software Academy

Telerik Test Studio. Web/Desktop Testing. Software Quality Assurance Telerik Software Academy Telerik Test Studio Web/Desktop Testing Software Quality Assurance Telerik Software Academy http://academy.telerik.com The Lectors Iliyan Panchev Senior QA Engineer@ DevCloud Testing & Test Studio Quality

More information

Introduction to PHP. Handling Html Form With Php. Decisions and loop. Function. String. Array

Introduction to PHP. Handling Html Form With Php. Decisions and loop. Function. String. Array Introduction to PHP Evaluation of Php Basic Syntax Defining variable and constant Php Data type Operator and Expression Handling Html Form With Php Capturing Form Data Dealing with Multi-value filed Generating

More information

MS Excel VBA Class Goals

MS Excel VBA Class Goals MS Excel VBA 2013 Class Overview: Microsoft excel VBA training course is for those responsible for very large and variable amounts of data, or teams, who want to learn how to program features and functions

More information

Simple AngularJS thanks to Best Practices

Simple AngularJS thanks to Best Practices Simple AngularJS thanks to Best Practices Learn AngularJS the easy way Level 100-300 What s this session about? 1. AngularJS can be easy when you understand basic concepts and best practices 2. But it

More information

Web Development & SEO (Summer Training Program) 4 Weeks/30 Days

Web Development & SEO (Summer Training Program) 4 Weeks/30 Days (Summer Training Program) 4 Weeks/30 Days PRESENTED BY RoboSpecies Technologies Pvt. Ltd. Office: D-66, First Floor, Sector- 07, Noida, UP Contact us: Email: stp@robospecies.com Website: www.robospecies.com

More information

2/6/2012. Rich Internet Applications. What is Ajax? Defining AJAX. Asynchronous JavaScript and XML Term coined in 2005 by Jesse James Garrett

2/6/2012. Rich Internet Applications. What is Ajax? Defining AJAX. Asynchronous JavaScript and XML Term coined in 2005 by Jesse James Garrett What is Ajax? Asynchronous JavaScript and XML Term coined in 2005 by Jesse James Garrett http://www.adaptivepath.com/ideas/essays/archives /000385.php Ajax isn t really new, and isn t a single technology

More information

ORB Education Quality Teaching Resources

ORB Education Quality Teaching Resources JavaScript is one of the programming languages that make things happen in a web page. It is a fantastic way for students to get to grips with some of the basics of programming, whilst opening the door

More information

Intro to XML. Borrowed, with author s permission, from:

Intro to XML. Borrowed, with author s permission, from: Intro to XML Borrowed, with author s permission, from: http://business.unr.edu/faculty/ekedahl/is389/topic3a ndroidintroduction/is389androidbasics.aspx Part 1: XML Basics Why XML Here? You need to understand

More information

Lecture 8 (7.5?): Javascript

Lecture 8 (7.5?): Javascript Lecture 8 (7.5?): Javascript Dynamic web interfaces forms are a limited interface

More information

Front End Nanodegree Syllabus

Front End Nanodegree Syllabus Front End Nanodegree Syllabus Build Stunning User Experiences Before You Start You've taken the first step toward becoming a web developer by choosing the Front End Nanodegree program. In order to succeed,

More information

Sections and Articles

Sections and Articles Advanced PHP Framework Codeigniter Modules HTML Topics Introduction to HTML5 Laying out a Page with HTML5 Page Structure- New HTML5 Structural Tags- Page Simplification HTML5 - How We Got Here 1.The Problems

More information

AngularJS Fundamentals

AngularJS Fundamentals AngularJS Fundamentals by Jeremy Zerr Blog: http://www.jeremyzerr.com LinkedIn: http://www.linkedin.com/in/jrzerr Twitter: http://www.twitter.com/jrzerr What is AngularJS Open Source Javascript MVC/MVVM

More information

JavaScript Programming

JavaScript Programming JavaScript Programming Course ISI-1337B - 5 Days - Instructor-led, Hands on Introduction Today, JavaScript is used in almost 90% of all websites, including the most heavilytrafficked sites like Google,

More information

Client Side JavaScript and AJAX

Client Side JavaScript and AJAX Client Side JavaScript and AJAX Client side javascript is JavaScript that runs in the browsers of people using your site. So far all the JavaScript code we've written runs on our node.js server. This is

More information

!"#"## $% Getting Started Common Idioms Selectors Animations & Effects Array vs. NodeList Ajax CSS Credits. jquery YUI 3.4.

!### $% Getting Started Common Idioms Selectors Animations & Effects Array vs. NodeList Ajax CSS Credits. jquery YUI 3.4. j Q u e r y wwwjsrosettastonecom Getting Started Common Idioms Selectors Animations & Effects Array vs NodeList Ajax CSS Credits G e t t i n g The and objects are globals and the jquery library itself

More information

Front-End Web Developer Nanodegree Syllabus

Front-End Web Developer Nanodegree Syllabus Front-End Web Developer Nanodegree Syllabus Build Stunning User Experiences Before You Start You've taken the first step toward becoming a web developer by choosing the Front End Web Developer Nanodegree

More information

Learn Web Development CodersTrust Polska course outline. Hello CodersTrust! Unit 1. HTML Structuring the Web Prerequisites Learning pathway.

Learn Web Development CodersTrust Polska course outline. Hello CodersTrust! Unit 1. HTML Structuring the Web Prerequisites Learning pathway. Learn Web Development CodersTrust Polska course outline Hello CodersTrust! Syllabus Communication Publishing your work Course timeframe Kick off Unit 1 Getting started with the Web Installing basic software

More information

Index. Ray Nicholus 2016 R. Nicholus, Beyond jquery, DOI /

Index. Ray Nicholus 2016 R. Nicholus, Beyond jquery, DOI / Index A addclass() method, 2 addeventlistener, 154, 156 AJAX communication, 20 asynchronous operations, 110 expected and unexpected responses, 111 HTTP, 110 web sockets, 111 AJAX requests DELETE requests,

More information

JavaScript Fundamentals_

JavaScript Fundamentals_ JavaScript Fundamentals_ HackerYou Course Syllabus CLASS 1 Intro to JavaScript Welcome to JavaScript Fundamentals! Today we ll go over what programming languages are, JavaScript syntax, variables, and

More information

iframe programming with jquery jquery Summit 2011

iframe programming with jquery jquery Summit 2011 iframe programming with jquery jquery Summit 2011 who invited this guy? name s ben strange last name work at disqus co-author, Third-party JavaScript disqus? dis cuss dĭ-skŭs' third-party commenting platform

More information

Web Site Design and Development JavaScript

Web Site Design and Development JavaScript Web Site Design and Development JavaScript CS 0134 Fall 2018 Tues and Thurs 1:00 2:15PM JavaScript JavaScript is a programming language that was designed to run in your web browser. 2 Some Definitions

More information

Build An HTML5 Game: A Developer's Guide With CSS And JavaScript By Karl Bunyan READ ONLINE

Build An HTML5 Game: A Developer's Guide With CSS And JavaScript By Karl Bunyan READ ONLINE Build An HTML5 Game: A Developer's Guide With CSS And JavaScript By Karl Bunyan READ ONLINE If searched for a ebook by Karl Bunyan Build an HTML5 Game: A Developer's Guide with CSS and JavaScript in pdf

More information

Microsoft Expression Web Quickstart Guide

Microsoft Expression Web Quickstart Guide Microsoft Expression Web Quickstart Guide MS-Expression Web Quickstart Guide Page 1 of 24 Expression Web Quickstart Guide (20-Minute Training) Welcome to Expression Web. When you first launch the program,

More information

Basics of Web Technologies

Basics of Web Technologies Dear Student, Based upon your enquiry we are pleased to send you the course curriculum for Web Designing Given below is the brief description for the course you are looking for: Introduction to Web Technologies

More information

SCHEME 8. 1 Introduction. 2 Primitives COMPUTER SCIENCE 61A. March 23, 2017

SCHEME 8. 1 Introduction. 2 Primitives COMPUTER SCIENCE 61A. March 23, 2017 SCHEME 8 COMPUTER SCIENCE 61A March 2, 2017 1 Introduction In the next part of the course, we will be working with the Scheme programming language. In addition to learning how to write Scheme programs,

More information

JavaScript Enlightenment: From Library User To JavaScript Developer By Cody Lindley

JavaScript Enlightenment: From Library User To JavaScript Developer By Cody Lindley JavaScript Enlightenment: From Library User To JavaScript Developer By Cody Lindley Written for JavaScript developers with intermediate-level skills, this book will you need to create a cross-browser JavaScript

More information

Prototype jquery. To and from JavaScript libraries. Remy Sharp (remysharp.com)

Prototype jquery. To and from JavaScript libraries. Remy Sharp (remysharp.com) Prototype jquery To and from JavaScript libraries. Remy Sharp (remysharp.com) Why Prototype? Extends the DOM and core JavaScript objects An arsenal of utility functions Based on Prototype 1.5.1 & 1.6 Why

More information

Professional Course in Web Designing & Development 5-6 Months

Professional Course in Web Designing & Development 5-6 Months Professional Course in Web Designing & Development 5-6 Months BASIC HTML Basic HTML Tags Hyperlink Images Form Table CSS 2 Basic use of css Formatting the page with CSS Understanding DIV Make a simple

More information

Boot Camp JavaScript Sioux, March 31, 2011

Boot Camp JavaScript  Sioux, March 31, 2011 Boot Camp JavaScript http://rix0r.nl/bootcamp Sioux, March 31, 2011 Agenda Part 1: JavaScript the Language Short break Part 2: JavaScript in the Browser History May 1995 LiveScript is written by Brendan

More information

Part of this connection identifies how the response can / should be provided to the client code via the use of a callback routine.

Part of this connection identifies how the response can / should be provided to the client code via the use of a callback routine. What is AJAX? In one sense, AJAX is simply an acronym for Asynchronous JavaScript And XML In another, it is a protocol for sending requests from a client (web page) to a server, and how the information

More information

55249: Developing with the SharePoint Framework Duration: 05 days

55249: Developing with the SharePoint Framework Duration: 05 days Let s Reach For Excellence! TAN DUC INFORMATION TECHNOLOGY SCHOOL JSC Address: 103 Pasteur, Dist.1, HCMC Tel: 08 38245819; 38239761 Email: traincert@tdt-tanduc.com Website: www.tdt-tanduc.com; www.tanducits.com

More information

Web Site Development with HTML/JavaScrip

Web Site Development with HTML/JavaScrip Hands-On Web Site Development with HTML/JavaScrip Course Description This Hands-On Web programming course provides a thorough introduction to implementing a full-featured Web site on the Internet or corporate

More information

55191: Advanced SharePoint Development

55191: Advanced SharePoint Development Let s Reach For Excellence! TAN DUC INFORMATION TECHNOLOGY SCHOOL JSC Address: 103 Pasteur, Dist.1, HCMC Tel: 08 38245819; 38239761 Email: traincert@tdt-tanduc.com Website: www.tdt-tanduc.com; www.tanducits.com

More information

Professional Diploma in Web Designing

Professional Diploma in Web Designing Professional Diploma in Web Designing DOT-NET Institute: DOT-NET is a leading Educational Training institute based in Delhi. As excellence is embedded in the very core of DOT-NET principles, it provides

More information

Section 1. How to use Brackets to develop JavaScript applications

Section 1. How to use Brackets to develop JavaScript applications Section 1 How to use Brackets to develop JavaScript applications This document is a free download from Murach books. It is especially designed for people who are using Murach s JavaScript and jquery, because

More information

Acknowledgments. Who Should Read This Book?...xxiv How to Read This Book...xxiv What s in This Book?...xxv Have Fun!...xxvi

Acknowledgments. Who Should Read This Book?...xxiv How to Read This Book...xxiv What s in This Book?...xxv Have Fun!...xxvi Contents IN DeTAIl Acknowledgments xxi Introduction xxiii Who Should Read This Book?....xxiv How to Read This Book....xxiv What s in This Book?...xxv Have Fun!...xxvi Part I: Fundamentals 1 What Is JavaScript?

More information

5. Strict mode use strict ; 6. Statement without semicolon, with semicolon 7. Keywords 8. Variables var keyword and global scope variable 9.

5. Strict mode use strict ; 6. Statement without semicolon, with semicolon 7. Keywords 8. Variables var keyword and global scope variable 9. Javascript 1) Javascript Implementation 1. The Core(ECMAScript) 2. DOM 3. BOM 2) ECMAScript describes 1. Syntax 2. Types 3. Statements 4. Keywords 5. Reserved words 6. Operators 7. Objects 3) DOM 1. Tree

More information

0.9: Faster, Leaner and Dijit? July 25, 2007 Dylan Schiemann. presented by

0.9: Faster, Leaner and Dijit? July 25, 2007 Dylan Schiemann. presented by 0.9: Faster, Leaner and Dijit? July 25, 2007 Dylan Schiemann presented by Key Features Browser support Package/build system Easy widget building Declarative widget creation Rich built-in widget set Comprehensive

More information

JavaScript: the language of browser interactions. Claudia Hauff TI1506: Web and Database Technology

JavaScript: the language of browser interactions. Claudia Hauff TI1506: Web and Database Technology JavaScript: the language of browser interactions Claudia Hauff TI1506: Web and Database Technology ti1506-ewi@tudelft.nl Densest Web lecture of this course. Coding takes time. Be friendly with Codecademy

More information

Frontend UI Training. Whats App :

Frontend UI Training. Whats App : Frontend UI Training Whats App : + 916 667 2961 trainer.subbu@gmail.com What Includes? 1. HTML 5 2. CSS 3 3. SASS 4. JavaScript 5. ES 6/7 6. jquery 7. Bootstrap 8. AJAX / JSON 9. Angular JS 1x 10. Node

More information

Software. Full Stack Web Development Intensive, Fall Lecture Topics. Class Sessions. Grading

Software. Full Stack Web Development Intensive, Fall Lecture Topics. Class Sessions. Grading Full Stack Web Development Intensive, Fall 2017 There are two main objectives to this course. The first is learning how to build websites / web applications and the assets that compose them. The second

More information