1. Developing Open Storefront Framework Applications for Oracle Commerce
  2. Understand the Open Storefront Framework
  3. Understand the OSF architecture

Understand the OSF architecture

A key part of OSF is the use of a Node.js server to perform server-side rendering of pages, make REST API calls to the storefront server, and communicate with the shopper’s browser.

On a production system, the Node.js server runs in the same Oracle-hosted environment as the Commerce servers. When it renders a page, it sends it to the shopper’s browser to be displayed.

For development purposes, Commerce supplies tools for setting up a workspace in your local environment. The workspace provides access to an npm (Node Package Manager) registry where you obtain OSF packages and their dependencies, as well as a Node.js server that runs JavaScript application code locally while communicating with Oracle-hosted Commerce servers. Storefront applications can be developed and run locally and then deployed to the Oracle environment for testing and production.

The Open Storefront Framework is designed to render pages quickly and to support rapid development. Its key features include:

  • Optimized page loading – OSF supports single-page applications, in which pages are rendered on the Node.js server, and only the code needed for the specific features on a page is loaded. Pages load quickly and are SEO-friendly.
  • Accelerated development – Development is done using industry-standard, developer-friendly tools, including Yarn and Node.js. The JavaScript APIs support best-practice design patterns.
  • Layered, extensible architecture – The OSF architecture is based on modular building blocks, in which features are loaded as needed at runtime.
  • Framework-neutral presentation layer – The storefront user interface is built using React by default, but you can substitute a different JavaScript framework.

The following diagram provides a high-level overview of the OSF architecture:

OSF high-level architecture