Vue Storefront is now Alokai! Learn More
Key Concepts

Key Concepts

Alokai Storefront is a comprehensive eCommerce accelerator designed for efficiency and adaptability. It provides a robust solution that covers all standard eCommerce functionalities and can be extended with Modules for more sophisticated use-cases. This document aims to offer a detailed and accessible overview of Alokai Storefront's architecture, essential components, and how it revolutionizes eCommerce platform integration.

What is Alokai Storefront?

Alokai Storefront accelerates the development of eCommerce solutions with its modular and extendable architecture. Optimized for speed and user engagement, it's built using popular frameworks such as Next.js for React or Nuxt for Vue.js.

A key feature of Alokai Storefront is its unique approach to handling data from different eCommerce platforms. It does this by implementing the Unified Data Model and Unified Methods contracts, which standardize data structures and operations, making it easier to switch between eCommerce backends with minimal changes to the frontend.

Core Components

The Need and Advantages of Storefront Starter

In traditional setups, eCommerce integrations often come with their front-end implementations, meaning that your storefront will be tightly coupled to your chosen backend. This makes transitioning between platforms a significant task that requires large rewrites of your application. Alokai Storefront addresses this challenge by offering:

  • Single Front-End Codebase: Utilize one frontend for all backend integrations, enhancing agility and reducing vendor lock-in.
  • Unified Data Layer: Facilitates easy switching between eCommerce platforms without significant frontend alterations.

These two components work together to provide a more robust, efficient, and flexible eCommerce platform that is not only easy to maintain and extend but also provides a consistent developer experience regardless of the eCommerce backend being used.

Core Components of Alokai Storefront

  • Alokai SDK: Acts as a bridge between the Storefront and the Middleware. It ensures type safety, modularity and provides simple APIs for data fetching.
  • middlewareModule: This SDK module serves as a user-friendly way to interface with the Unified Data on the frontend. This module dynamically creates methods for interacting with the Unified API Extension endpoints, facilitating customizability and extension.
  • Alokai Middleware: It orchestrates data flow, manages routing requests, handles responses, and integrates with a variety of Third-Party services.
  • Unified API Extension: Responsible for unifying the data from the different eCommerce backend integrations, which facilitates the data interaction across the various parts of the application. This module enhances default eCommerce integrations with endpoints adhering to the Unified Methods contract.
  • Normalizers: These functions transform raw eCommerce responses into the Unified Data Model, ensuring consistency and compatibility across different integrated systems.
  • Third-Party Systems: Alokai Storefront integrates seamlessly with a range of eCommerce platforms, payment gateways, CMS, and search engines, offering a robust and versatile eCommerce solution.

You can find more details about each component in the dedicated sections of this documentation:

Alokai Storefront Data Flow

  1. The Storefront sends a request to the Middleware via the SDK middlewareModule.
  2. Since the request is sent to the Unified API endpoint, the Unified API Extension intercepts the request and processes it.
  3. The Unified API Extension uses configured Integration API Client to send a request to the eCommerce platform.
  4. The eCommerce platform responds with raw data.
  5. The Unified API Extension uses Normalizer function to transform the raw data into the Unified Data Model.
  6. The Unified API Extension sends the transformed data back to the Storefront.
  7. The Storefront receives the response and displays the data to the user.

Data Flow

This data flow ensures that no matter the eCommerce backend, the data delivered to the application is consistent and standardized, thereby reducing complexity, enhancing maintainability, and ensuring a uniform user experience.

Key Takeaways

Alokai Storefront represents a significant leap in eCommerce platform integration, offering a unified, efficient, and customizable solution. Its architecture not only simplifies the development process but also ensures a consistent and enjoyable user experience across various eCommerce backends. This unified approach positions Alokai Storefront as a key player in modern eCommerce solutions, adaptable to the ever-evolving digital marketplace.