React Native eCommerce Boilerplate
This React Native Boilerplate gives you a head start when building a React Native e-commerce app for iOS and Android. You can have rich e-commerce content with the super structured PIM engine in Crystallize powering your product catalog.
This boilerplate is connected to the Crystallize API. By default, this React Native eCommerce boilerplate is connected to our demo tenant called “Furniture.” This is the same tenant used in the Jamstack eCommerce Boilerplate using Next JS and shows re-use of product information and rich marketing content across Web, iOS, and Android Apps.
You can also check out this boilerplate as a live eCommerce demo.
Introduction
This guide will walk you through how you can download and set up the react-native boilerplate using our CLI. Then we’ll go over how to run the app. At the moment we’ve only tested this on iOS but we’ll be doing it for Android soon.
Livestream Demo
Getting Started with React Native eCommerce
To get started with your own React Native eCommerce App you simply need to use our CLI. It will walk you through the process
npx @crystallize/cli my-project
Once you do that, you'll be greeted with this screen where you have the option to select our various boilerplates. But for the sake of this guide, we’ll go with React Native. Use the arrow keys to navigate to the bottom of the list. Once you find the React Native option press enter.
Then you’ll be asked to select a Crystallize Tenant. You can either choose our default tenant or you can create your own tenant by signing up on Crystallize.
After choosing your tenant you’ll be asked to enter a Service API URI, you can choose our default one or enter your own service API URI if you have one.
Running on iOS
Configuring Environment Variables
To configure environment variables you can find the env file at the root of the project. Feel free to change them if you have a tenant and service API set up.
CRYSTALLIZE_TENANT_IDENTIFIER=furniture
SERVICE_API_URL=https://service-api-demo.superfast.shop/api/graphql
Next Step: Service API
In order to manage a fully operational eCommerce, you need to manage user authentication, basket validation, payment, and such.
For that, we have prepared a boilerplate for you, the Service API boilerplate, which you would want to add alongside your React Native project. Follow our guide for how to set it up.
