Web Development Recipes, 2nd Edition

Recipe 21

Creating a Widget to Embed in Other Sites

Problem

Widgets are small chunks of code—a combination of HTML, JavaScript, and CSS—that web developers can embed in their pages to load content from another site. From general information about our site to tailored content about a user’s activities, widgets that we create and share help us expand the reach of our site and allow people to share that they use our site. It’s a simple concept, but developing a widget requires some possibly unfamiliar tasks—such as loading data from a remote site and ensuring that your JavaScript doesn’t conflict with existing JavaScript on the site where the widget is embedded. We need to encapsulate our code to ensure that the functions we introduce don’t inadvertently ...