1. Home
  2. Docs
  3. Mazi
  4. Getting Start

Getting Start

The Mazi React Native UI KIT supports both React Native Cli and Expo Cli (Managed Workflow)

System Requirements

Please refer from React Native official page Setting up the development environment for make sure you already run application with basic setting environment

React Native – Welcome to React App

Expo CLI

After unzip the download pack, you’ll found a source-expo folder with all the files. Open a Terminal in source-expo folder and run command

Mazi – Source Expo
cd ./source-expo
yarn setup 
yarn start

After you run the command successfully then you can find the result like the image below.

Mazi React Native – Expo command

Please install the Expo demo app via Apple Store or Play Store. Then use your phone scan the QR code above for demo the Mazi app (please make sure your phone and your computer are using same the network connection)

React Native CLI

After unzip the download pack, you’ll found a source folder with all the files. Open a Terminal in source folder and run command

Mazi – Source

IOS

Setup and install packages

cd ./source  
yarn setup

Link fonts and resource icons

npx react-native link

If the command npx react-native link is not work. Please try command below

cd ./source/
npm install react-native-asset
npx react-native-asset

Start Metro

yarn start

Start your application 

yarn ios

If you’re using Mac M1, please run the command

yarn ios-m1
Mazi – IOS Simulator

Android

Before getting started, please read thoroughly this React Native official docs for how prepare with Android development https://facebook.github.io/react-native/docs/getting-started
After you finished setup for Android, we will move to next step

Setup

cd ./source  
yarn setup

Link fonts and resource icons

npx react-native link

If the command npx react-native link is not work. Please try command below

cd ./source/
npm install react-native-asset
npx react-native-asset

Start Metro

yarn start

Start your application 

yarn android

You also can use the Android Studio (3.5.3 or last version) and build project with folder ./source/android

Mazi – Android Studio Build

After then please do following steps below

  • Step 1: ADM Manager – Install your virtual devices for use
  • Step 2: Sync project with Gradle files
  • Step 3: Select virtual device and Run your application
Mazi – Android Studio Build with Virtual Device

Video Installation Guide

We also made video for how to set up for Ios and Android