There are a few kinds of javascript-based interactive components that experienced front-end developers have typically built many times. We usually do this because we think the implementation needs to be specific to a given project even though we routinely re-use other code (like contrib modules and base themes) on every project.
If we could avoid this, we'd benefit by reducing time spent re-inventing the wheel, and by making it possible to back-port bugfixes and new features to existing projects.
Well, we can avoid it. Reusable, extensible, customisable implementations of these small interactive components is surprisingly simple--and fast.
In this session, I will:
- outline a flexible way to design and plan simple interactive javascript components for web projects with or without Drupal,
- step through the implementation of a flexible, customisable, and accessible version of the Web Accessibility Initiative's "disclosure" (or show/hide) pattern,
- (time permitting) step through extending the disclosure to create another common type of interactive component.
Attendees to the session will learn:
- a way to decide the appropriate roles of html, javascript, and css when building interactive tools,
- a way to design javascript for progressive enhancement,
- a way to design javascript for reusability & extensibility,
- a way to design javascript for customisibility,
- a way to design javascript for responsivity,
- a way to design your javascript for accessibility,
- a way to make javascript responsive.
