The complete source code is available here and can be adjusted as desired: Download
We have included the ability to develop and test the application locally through a npm web server. After local development and bundling of the application, it can be uploaded to Watson Content Hub where it is available on the provided CDN. The application includes a configuration file that allows you to configure the server details of the WebSphere Commerce Server that holds the shopping catalog data.
The goal of this sample is to allow a quick start for implementing a custom ecommerce site. The main flow has been implemented as a sample and can be customized; additional flows can be added as required; and the user interface can easily be extended and modified. The catalog and shopping features come from a WebSphere Commerce Server version 8 or higher.
In the sample the main flows for a shopping site were implemented:
1. General Information:
Sign up, Login and Logout of the store. User data is stored in WebSphere Commerce.
3. Browsing the catalog:
Drilling down into categories, allowing to select brands or filtering by price.
4. Searching for a product:
Searching the product catalog.
5. Showing product detail information:
Ability to select product characteristics like for instance color or size of shoes.
6. Shopping cart:
Adding and removing products from the shopping cart and triggering a checkout. Also reviewing what is in the cart for the current session.
7. Checkout flow:
Guest checkout flow, allowing to enter address and payment information and checking out including success message.
Characteristics of the site:
– Responsive design and implementation
– Best of breed open source technologies: Angular, jQuery, Bootstrap
– Leveraging a free html shopping template: Eshopper template
– Leveraging the power of headless eCommerce via WebSphere Commerce integration
– Leveraging the power of Watson Content Hub for hosting and content management and delivery
Update: We have extended the sample package with new features. Check out the details here: Extended storefront sample