Diploma in Web
Development – Part II
Front-End Development – Week 4
AJAX & Event Handling
Presented by:
Julian Quirke
Web Development Educator
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
Week 3 Recap
JQuery
➢ JQuery: The JavaScript Library
➢ Getting Started with JQuery
➢ Event Handling
➢ Summary
➢ Q&A
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
Today’s Lesson
AJAX & Event Handling
➢ What is User Experience?
➢ Introduction to AJAX
➢ AJAX & JQuery Demonstration
➢ Summary
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
Let’s Begin!
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
What is User Experience?
User Experience (UX)
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
What is User Experience?
User Experience (UX)
is the overall experience of a user of a web or
computer application, particularly in terms of ease
of use and pleasure
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
What is User Experience?
➢ Look
➢ Feel
➢ Usability
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
What is User Experience?
Wait a minute…
➢ Domain of design?
➢ How does JavaScript help?
➢ Development meets Design
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
What is User Experience?
For Developers
➢ Reduce loading times
➢ Create seamless
interactions
➢ Positive Experience
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
Introduction to AJAX
Asynchorous JavaScript And XML
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
Introduction to AJAX
Asynchronous JavaScript And XML
is a script that is run on the front end that can
exchange data with a server and update sections of
a web page without reloading the entire page
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
Introduction to AJAX
Why Use AJAX
➢ Callbacks: use less network bandwidth
➢ Asynchronous Calls: allows user to act
before all the data has arrived
➢ User-Friendly: AJAX applications are more
responsive & dynamic
➢ Increased Speed: sending information to
the server doesn’t disrupt the user
experience (UX)
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
Introduction to AJAX
How does AJAX work?
1. Basic HTML Page is loaded
2. Event triggers a JavaScript (AJAX)
function call
3. The Javascript function retrieves
information from another document
on the server
4. New information inserted into current
HTML page
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
Introduction to AJAX
AJAX with JQuery
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
Introduction to AJAX
Note:
➢ AJAX has evolved since its inception
➢ It is not necessary to know XML for AJAX
➢ Can understand different data types
including JSON, XML, HTML, & plain text
➢ Cross origin requests are not allowed by
JavaScript
➢ Must be run from a server
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
AJAX & JQuery Demonstration
Demo
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
Today’s Lesson
AJAX & Event Handling
➢ What is User Experience?
➢ Introduction to AJAX
➢ AJAX & JQuery Demonstration
➢ Summary
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
Next Week
PHP Development Semester
➢ The next session is “Object Oriented PHP”
• Getting Started with PHP
• Classes & Objects
• Properties & Methods
➢ Recordings are available within 24 hours after the live webinar
➢ Go to www.shawacademy.com and then the Top Right Corner – Members Area
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
Q&A
Next Lesson is
Object Oriented PHP
➢ Learn the key concepts involved in writing
back-end code using PHP in order to generate
dynamic content on your web application
www.shawacademy.com
➢ You will learn how to build an organised back-
www.facebook.com/shawacademy
end using class-based architecture
www.twitter.com/shawacademy
[email protected]
Julian Quirke Recording ADVANCED WEB DEVELOPMENT
Web Development Educator
