User Interface Development with jQuery Workshop

Owned by Colin Clark
Last updated: Mar 05, 2010Version comment
1 min read

Workshop Materials

Workshop Agenda

  1. What is jQuery?
  2. How does it compare to other toolkits?
  3. The jQuery Way: Unobtrusiveness, etc.
  4. The 10-minute JavaScript Refresher Course
  5. Finding things: using selectors
  6. Attributes
  7. Styling
  8. Events
  9. DOM Manipulation
  10. Accessibility
  11. AJAX
  12. Building Applications: What's Missing?
  13. Infusing Your jQuery App With Fluid Infusion

Example Code: Flutter

  • Build a simple Twitter client using jQuery

Exercises

These exercises will use the Twitter client assets, building upon them into a working application.

  1. Selecting things and using them
    • Using the full Twitter client HTML, try out different types of selectors: id-based, containment, CSS style, pseudo selectors
    • Apply simple CSS class names
    • Add inline styles
    • Adjust attributes
  2. DOM Manipulation
    • Move elements from one spot in the document to another
    • Inject HTML using simple strings and templates
  3. Keyboard accessibility and ARIA
  4. AJAX
    • Calling home: simple GET requests
    • Processing data in JSON format from Twitter
    • POSTing data back to the server