Skip to main content

Architecture

Overview​

Themes not only define the look and feel of a Fynd Platform website but also determine user interactions, ensuring a seamless and enjoyable shopping experience for users. We use VueJS (v2) and React JS (v18) to build Fynd Platform Themes. You may use any syntax that VueJS (v2) / React JS (v18) supports. We also provide tools and best practices to speed up the development process. As a developer, you can build a new custom theme, customize an existing theme to match your needs, or build a theme to sell on the Fynd Partners Marketplace. You can also build extensions that extend the functionality of a theme.

React Application Layout​

My Image

  • CoreProvider: This is a set of engine-level providers to manage theme data, router and application store. This is not configurable from the theme.
  • GlobalProvider: To allow theme developers to have more control over the application and to be able to add some global configs, the engine supports a GlobalProvider which is injected at the top layout. More details on Global provider
  • Header, Footer: Components that are common to all pages.
  • Route Based Outlet: This is the router component that dynamically mounts the page content based on the current route. Theme developers can export multiple page-level components from their theme/index.jsx files to be mounted on different route paths.