Remix Shopify Polaris

screenshot of Remix Shopify Polaris

Use Shopify Polaris with Remix

Overview

Remix with Shopify Polaris is a template that allows developers to build a Remix app with Shopify Polaris. It provides a convenient setup for handling the initial configuration of the app.

Features

  • AppProvider setup in root.tsx: Enables sharing global settings throughout the application hierarchy.
  • LinkLikeComponent: Ensures that Polaris uses Remix's <Link> component.
  • AppFrame component: Designed for pages that require a standard application frame. It includes a navigation menu item using the Remix useMatches hook.
  • Customizable logo: Users can edit or replace the app-logo.svg and app-logo-light.svg files with their own logo to display properly in the Frame component.
  • Adjustable colors: Polaris utilizes CSS variables in variables.css, allowing users to easily modify the colors.

Summary

Remix with Shopify Polaris is a template that simplifies the process of building a Remix app with the Shopify Polaris design system. It provides key features such as global settings sharing, integration with Remix's <Link> component, a customizable app frame, and adjustable colors. The template also offers a convenient installation process, allowing users to quickly set up and deploy their app.