Framework-Independent JavaScript Components
- Cross-Framework JavaScript Components
- Cross-Framework JavaScript Plugins
- Building Reuseable JavaScript Across Frameworks
- Refactoring Old jQuery Plugins
- Don't Make jQuery Plugins
This talk was inspired by a conversation I had at FluentConf last year with a technical manager. He manages two teams, one in the States and the other in London. One team uses Angular and the other team uses React. His question was how each of his teams could share code across their projects. Since then I've noticed the trend of developers making React-only Components or Angular-only Directives much like the old days where everything was a jQuery Plugin. I can understand why that might be appealing, but with our ever-changing front-end landscape it doesn't lend itself well to code reuse.
The intent of this talk is to discuss the challenge of framework-specific code and then to take a step back and show how to rewrite a plugin to a generic library that can have multiple adapters. Along the way, I'll cover design patterns and techniques that can make a library extensible, testable, and easy to consume by multiple modules systems.
Have you ever wanted to reuse code across your web applications, but your code was written exclusively for one library or framework? We will re-write a jQuery plugin with plain JavaScript and then create adapters for specific libraries and frameworks such as jQuery, Angular, React, etc. We will cover various design patterns and identify potential dangers as we build our reusable component.
Have you ever wanted to reuse code across your web applications, but your code was written exclusively for one library or framework? You may have encountered this when you wanted to use a jQuery plugin, Angular directive, React component, etc... and realized it was tightly-coupled to a specific framework that you weren't using.
In this talk we will re-write a jQuery plugin with plain JavaScript that can be used in many different client-side frameworks. Along the way, we will address various design patterns and identify potential caveats as we build our component. Once we've created a reusable component, we will create adapters for specific libraries and frameworks such as jQuery, Angular, React, Ember, etc.
A reusable component simplifies unit testing, enables you to share code across projects that use different frameworks, enables compatibility for future frameworks, and expands your potential user base if you decide to open source your project.