jQuery Aurora starter store
The Aurora starter store in WebSphere Commerce is completely written in jQuery 3.1.0, which is one of the most commonly used JavaScript libraries used in dynamic websites. The jQuery AJAX and events API provides an easy to use framework that meets most AJAX requirements for storefront development.
In addition to all the existing features that are supported in the Dojo version of the Aurora starter store, the jQuery version supports the following additional capabilities:
- Store pages load a minimal number of JavaScript and CSS files, as a build script is provided that merges the code from all the files and then generates fewer files, with all its contents combined and minified. This performance strategy improves the web browser's page load time for store pages.
- A store function is available to control whether dynamic E-Marketing Spots are loaded either server-side with the page, or loaded after the initial page load is complete, to better support Content Delivery Network (CDN) caching.
- Interactions in the category page are implemented using full page loads, rather than using AJAX. This strategy simplifies page coding and removes the complexity of handling the web browser's back, forward, and bookmark features.
1 Publish the jQuery Aurora starter store
The AuroraJQuery.sar archive contains the organization structure, predefined user roles, and access control policies necessary to create either a B2C storefront asset store or a B2B storefront asset store in the Extended Sites business model.
For more information, see Publishing the jQuery Aurora starter store.
2 Work with the jQuery Enhancements API
- AJAX framework
- The AJAX framework helps determine the refresh areas of pages, and the content that populates them. The framework helps track the status of store pages, and the content that is generated when customers interact with the store.
- User interface widgets
- The user interface widgets in the Aurora starter store extend the functionality of available Dojo widgets to create a versatile, customer-friendly store. They add new functionality, changing the appearance and interaction experience in the store.
For more information, see jQuery Enhancements API.
3 Rebuild your store code
For optimal store performance, all JavaScript and CSS files are kept to a minimum inside the store and widget directories. As a result, you must rebuild your store code every time you update it, so that the store can apply your changes. You can trigger a rebuild of your store code by using Grunt plugins.
For more information, see Rebuilding store code.
4 Debug jQuery in the storefront
You can debug jQuery in the Aurora starter store to help determine the locations of potential problems to resolve. The recommended approach is to use the Mozilla Firefox with the Firebug add-on. This approach is available as an optional free browser add-on, and lets you can edit, debug, and monitor CSS, HTML, and JavaScript. It also serves as a network activity and DOM inspector.
For more information, see Debugging tools.