1. User Interface Design and Usability jQuery, jQuery UI & jQuery Plugins
Korab Zhuja, MSc
Cacttus Education

2. What is jQuery
jQuery is a fast, small, and feature-rich JavaScript library.
It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers.
Currently we can use jQuery 3.

3. jQuery History
jQuery was originally released in January at BarCamp NYC by John Resig and was influenced by Dean Edwards' earlier cssQuery library.
It is currently maintained by a team of developers led by Timmy Willison (with the jQuery selector engine, Sizzle, being led by Richard Gibson).

4. jQuery Usage
jQuery is used by 96.2% of all the websites whose JavaScript library we know. This is 72.9% of all websites.
Microsoft and Nokia bundle jQuery on their platforms.

5. What is Ajax
Ajax is a client-side script that communicates to and from a server/database without the need for a post-back or a complete page refresh.
The best definition I've read for Ajax is “the method of exchanging data with a server, and updating parts of a web page – without reloading the entire page.”

6. jQuery UI
jQuery UI is a curated set of user interface interactions, effects, widgets, and themes built on top of the jQuery JavaScript Library.
Whether you're building highly interactive web applications or you just need to add a date picker to a form control, jQuery UI is the perfect choice.
jQuery UI is built for designers and developers alike.
We've designed all of our plugins to get you up and running quickly while being flexible enough to evolve with your needs.

7. jQuery UI | Accordion
Displays collapsible content panels for presenting information in a limited amount of space.

8. jQuery UI | Datepicker Select a date from a popup or inline calendar.
The datepicker is tied to a standard form input field.
Focus on the input to open an interactive calendar in a small overlay.

9. jQuery UI | Buttons
Enhances standard form elements like buttons, inputs and anchors to themeable buttons with appropriate hover and active styles.

10. jQuery UI | ToolTip
Customizable, themeable tooltips, replacing native tooltips.

11. jQuery UI | Dialog Open content in an interactive overlay.
The basic dialog window is an overlay positioned within the viewport and is protected from page content shining through with an iframe.
It has a title bar and a content area, and can be moved, resized and closed with the 'x' icon by default.

12. jQuery Plugin | CurvedText
CurvedText is a simple jQuery plugin that allows you to align text on any curve.
Link:

13. jQuery Plugin | formvalidation.io
Best jQuery plugin to validate form fields
Designed for Bootstrap 3/4, Foundation 5/6, Pure, Semantic UI, UIKit, etc;
Link:

14. jQuery Plugin | ClockPicker
ClockPicker is a clock-style timepicker for jQuery or Bootstrap.
Link: github.io/clockpicker/

15. jQuery Mobile
jQuery Mobile is a HTML5-based user interface system designed to make responsive web sites and apps that are accessible on all smartphone, tablet and desktop devices.
Link: demos.jquerymobile.com

16. Class Practice Building a form with HTML & jQuery UI;
The exercise is explained by a word document that you will have in class.

17. ASK
You are encouraged to ask always anything related to course materials and projects.