Step 1. Install React App Builder

Step 1. Setup your environment

You will need to set up your computer to prepare for configuring the React App Builder.

You will need Node + NPM to build the phone apps, GIT for version control, and Expo for development testing.

  1. Install node and npm: Download it from here.
  2. Install GIT: Download it from here.
  3. Install Expo: Follow instructions for the local development tool and mobile client.

To verify your installation run

  • node --version
  • npm --version
  • git --version
  • expo --version

Login in expo cli ( This is not recorded in the video above )

Run the command

expo login

Log in with your AppBuilder account.

What you should get


  1. Builder - This represents the builder of the mobile apps - the web project where you define the app
  2. Cloud Functions - Cloud Firestore Functions used to help the Builder do the job like encryption, mail sending...
  3. DOCS.html - Link to the documents
  4. Mobile App - The React Native Project - is the mobile app's code. There is also the script for compiling the apps
  5. SaaS Lading Page - The landing page for your DIY Mobile App Builder 
  6. SyncScripts - Shopify and Radio  data sync script
  7. App Maker Docs - Exported Docs so you can have your own support portal

Step 2. Connect to your Firebase 

In Firebase, go in Project settings, and click on "Add Firebase to your web app"


Then copy the config string. 


** Important Steps **


Then in your Builder, in src/config/ folder there is "firebase_config.js" file.

Replace the config value there, with your value. 


Copy the file "firebase_config.js" and paste it in SaaS Landing Page /app-builder-landing/src/config.

Overwrite the existing file there


Paste the same  "firebase_config.js"  file in Mobile app folder.

Overwrite the existing file there


Paste the same "firebase_config.js" file in Cloud Functions/functions folder.

Overwrite the existing file there

Step 3. Start your app builder locally

Open the Build folder in the terminal or command line. 
Or, you can also open the folder in the Visual Studio CodeThey have a integrated terminal. 



Then execute the commands 

npm install

You may get some warnings and errors during install. But this doesn't mean it will not work. So let's execute the next command

npm start

After running this command in your browser you should see a newly opened window looking like the one in the picture below.

If something goes wrong. Pls, check out our Common Problems page. If this is not answered there, send us a ticket

Include the log output from the terminal.


Admin users

In Builder/src/config/app.js around line 18, you will find adminUsers array.

It should be empty. Add the email you registered in Firebase.


Build Account set

In Builder/src/config/app.js around line 317 (bottom), you will find buildAccountUsername and buildAccountPassword variables.


Change the values with the build account you have created in this step.

Set your purchase code

Go in your CodeCanyon Downloads page, and locate the React App Builder - Unlimited number of apps


Download the License certificate & purchase code ( text )

Open it

Locate the Item purchase code


Copy it and paste it in Builder/src/config/app.js around line 315 in the variable licenseCode


Login in the app builder

Login to your builder whit the email and password that you added.


And after a successful login, you should see this screen. 


If Purchase code is invalid you will see this screen


Set up Google Maps API Key 

Follow this additional step, to enable the Google MAPS widget in your Mobile App Builder.

Then continue with the next steps. 


If you own Regular License follow

Step 2. Deploy React app builder

If you own Extended License - SaaS follow

Getting started with SaaS React App Builder