$ show bigcommerce/cornerstone
The BigCommerce Cornerstone theme is a reference implementation for building e-commerce stores on the BigCommerce Stencil platform. It provides a complete frontend solution including product listing and detail pages, shopping cart and checkout functionality, customer account management, and search with faceted filtering. The theme follows a modular architecture with Handlebars templates for markup, SCSS for styling, and JavaScript for interactivity, organized by page type and shared utilities. Key strengths include a strong focus on accessibility (ARIA attributes, focus trapping, keyboard navigation), responsive design, and internationalization support. The theme implements reusable patterns such as a modal system with focus management, a faceted search component that synchronizes state with the URL, and currency/language selectors that persist user preferences. The build process uses both Webpack and Grunt to compile and optimize assets, including an SVG sprite system for icons. While the theme is actively maintained and demonstrates solid engineering practices, it relies heavily on jQuery and uses an older version of the Foundation Sites framework, which may present challenges for modernization. The codebase is well-suited for developers looking to create custom BigCommerce themes, offering a robust foundation that balances functionality with extensibility.
The LLM identified 4 files worth highlighting for reuse:
Provides a reusable modal implementation with focus trapping, scroll locking, and customizable content. Used for quick view, cart preview, and alerts. Demonstrates non-obvious skill in managing accessibility constraints (focus trapping, returning focus to trigger) while maintaining a simple API for developers.
Implements a reusable faceted search system with URL synchronization, collapsible facets, and dynamic updates. Handles both checkbox and range filters, updating the page URL to reflect filter state. Demonstrates skill in managing state via the URL and ensuring accessibility through proper ARIA attributes and keyboard navigation.
Manages currency switching, including updating prices, storing preference in localStorage, and validating cart compatibility with the selected currency. Demonstrates skill in integrating with the BigCommerce cart API to prevent invalid currency changes and persisting user preferences across sessions.
Uses the `Intl.DisplayNames` API to display language names in their native script and updates the URL locale parameter. Demonstrates skill in leveraging modern browser APIs for proper language name localization and providing a lightweight, accessible language switching mechanism.