Skip to main content
Rails Storefront is a mobile-first storefront that is fully customizable & themeable.

Tech Stack

Installation

You can install it by running
bundle add spree_storefront
Then run the install generator:
bin/rails g spree:storefront:install
This will set up the storefront views, Tailwind CSS configuration, and page builder migrations. You will also need to create your first theme:
Spree::Store.default.send(:create_default_theme)

Architecture

Rails Storefront consists of:

Themes

Themes are a collection of styles, scripts and templates that are used to style and layout the storefront.

Pages

Pages are the main building blocks of the storefront. They are used to create the structure of the storefront. Each Theme comes with a set of default pages such as Home Page, Product Listing Page, Product Page, etc, but you can create your own custom landing pages as well.

Sections

Sections are the building blocks of the pages. They are used to create the structure of the pages. Each Section is a collection of Blocks.

Blocks

Blocks are the smallest building blocks of the storefront. They are used to create the content of the pages.

Links

Links are used to create the navigation of the storefront. They can be assigned to Sections and Blocks.

Page Builder

The storefront comes with a visual Page Builder that allows non-developers to build pages using a drag-and-drop interface. This allows your team to create new pages and sections, modify existing ones, and add new blocks to the pages in a no-code way. You can learn more about the Page Builder in the User Documentation.