šŸ“•
Meup - Marketplace Events WordPress Theme
  • READ THE FIRST
  • Global
    • Youtube Tutorials
    • Install Theme
    • Update Theme/Plugins
      • Automatic Update
      • Manual Update
    • Support Theme
  • Basic
    • Header Settings
    • Update Footer
    • Home Page
    • Theme Options
      • Typography
      • Layout Global
      • Header Global
      • Footer Global
      • Blog
      • Event
      • Venue
      • Author
      • Site Identity
  • Main Features
    • How to make money with Theme?
    • VENDORS FEATURES
      • READ THE FIRST
      • Package
      • Create Event
        • Basic
        • Ticket
          • Internal link - No Seat
          • Internal link - Simple Seat
          • Internal link - Map
          • Event Online (Virtual Online)
          • External Link
          • Customize Template
        • Calendar
        • Coupon
        • Staff member
        • Cancel booking
        • Extra Service
      • My Listings
      • Wallet
      • General
      • My Bookings
      • My Wishlist
      • My Profile
    • USER FEATURES
      • READ THE FIRST
      • My Bookings
      • My Wishlist
      • My Profile
    • ADMIN FEATURES
      • Create Event
      • Manage Event
      • Manage Packages
      • Manage Venues
      • Manage Categories
      • Manage State, City
      • Manage Custom Taxonomy
      • Manage Custom Checkout Fields
      • Manage all Bookings
      • Manage all Tickets
      • Report Sales
      • Report User
      • Cancel/Refund Booking
      • Manage Withdraw and Payout
        • Method 1
        • Method 2
    • Settings
      • General
      • Event
      • Package
      • Checkout
      • Cancel Booking
      • Mail
      • Tax & Profit
      • Role
      • PDF Invoice
      • Ticket Transfer
      • Date Format
    • Elements in page
      • Search Form
      • Search Half Map
      • Event Category
      • Event Slider
      • Location Event
      • Event Slideshow
      • Event Grid
  • Login/Register User
    • READ THE FIRST
    • Setup Login, Register
    • Customize Register User Form
    • Admin Approve Vendor
  • Scan QR code in ticket
    • READ THE FIRST
    • Via Mobile Phone
    • Via Application
      • Install Application
      • Use Application
      • Customize Application
    • Via a link
    • Note
  • Frontend
    • Change Slug event
    • Event Archive Template
    • Event Detail Template
    • Cart Event Page
    • Checkout page in WooComemrce
    • Author Page
    • Customize PDF Ticket
    • Disable Marketplace
    • Vendor Dashboard
    • Mail
    • Update Sharing Social
  • Other
    • Mail chimp setting
    • Google Map
    • Translation
    • Find Icons
  • FAQs
    • Can't Book Events
    • Cart Event Error
    • Admin will approve event before publish it.
    • Login before booking event
    • when i create events, there is not ''booking button'' but ''share button''
    • Get Token Instagram
    • The vendor submit event without register package
    • Search go to home page
Powered by GitBook
On this page
  • 1: General
  • 2: Build Application

Was this helpful?

  1. Scan QR code in ticket
  2. Via Application

Customize Application

We are using React Native to build application for both IOS and Android.

PreviousUse ApplicationNextVia a link

Last updated 7 months ago

Was this helpful?

1: General

Download theme from themefore then unzip, you will see APP folder includes:

+ Android App Demo: It is .apk file that used to install in Android OS

+ Code: This is React Native Code, you can use it to customize code like add logo, change words...

+ instruction_build_app.rtf: This is instruction file to build code

2: Build Application

We use React Native for creating app. You can follow instruction for making your app.

- Step 1: Setting up the development environment

https://reactnative.dev/docs/environment-setup

- Step 2: Create Project
+ Open terminal 
+ cd to Root folder that included project
+ Run code in terminal:
npx react-native init testmeup

- Step 3: Run project
+ Go to project by command:
cd testmeup
Run in IOS: npx react-native run-ios
Run in Android: npx react-native run-android
+ The project setup correctly if you see ā€œWelcome To React Nativeā€ screen. If you can’t see this screen, please check again step 1 and create again project to test.


- Step 4: Install dependencies

+ npm install @react-native-async-storage/async-storage
+ npm install react-native-barcode-mask
+ npm install react-native-camera
+ npm install react-native-gesture-handler
+ npm install @react-navigation/native
+ npm install @react-navigation/native-stack
+ npm i deprecated-react-native-prop-types
+ npm install react-native-screens
+ npm install react-native-safe-area-context

- Step 5: Fix for React Native Camera

- Develop environment in MacOs - IOS

- Go to testmeup/ios/testmeup/Info.plist and add bellow code. Note insert before </dict>

	<key>NSCameraUsageDescription</key>
    <string>${PRODUCT_NAME} Camera Usage</string>

    <key>NSBluetoothPeripheralUsageDescription</key>
    <string>${PRODUCT_NAME} BluetoothPeripheral</string>

    <key>NSCalendarsUsageDescription</key>
    <string>${PRODUCT_NAME} Calendar Usage</string>

    <key>NSContactsUsageDescription</key>
    <string>${PRODUCT_NAME} Contact fetch</string>

    <key>NSHealthShareUsageDescription</key>
    <string>${PRODUCT_NAME} Health Description</string>

    <key>NSHealthUpdateUsageDescription</key>
    <string>${PRODUCT_NAME} Health Updates</string>

    <key>NSHomeKitUsageDescription</key>
    <string>${PRODUCT_NAME} HomeKit Usage</string>

    <key>NSLocationAlwaysUsageDescription</key>
    <string>${PRODUCT_NAME} Use location always</string>

    <key>NSLocationUsageDescription</key>
    <string>${PRODUCT_NAME} Location Updates</string>

    <key>NSLocationWhenInUseUsageDescription</key>
    <string>${PRODUCT_NAME} WhenInUse Location</string>

    <key>NSAppleMusicUsageDescription</key>
    <string>${PRODUCT_NAME} Music Usage</string>

    <key>NSMicrophoneUsageDescription</key>
    <string>${PRODUCT_NAME} Microphone Usage</string>

    <key>NSMotionUsageDescription</key>
    <string>${PRODUCT_NAME} Motion Usage</string>

    <key>kTCCServiceMediaLibrary</key>
    <string>${PRODUCT_NAME} MediaLibrary Usage</string>

    <key>NSPhotoLibraryUsageDescription</key>
    <string>${PRODUCT_NAME} PhotoLibrary Usage</string>

    <key>NSRemindersUsageDescription</key>
    <string>${PRODUCT_NAME} Reminder Usage</string>

    <key>NSSiriUsageDescription</key>
    <string>${PRODUCT_NAME} Siri Usage</string>

    <key>NSSpeechRecognitionUsageDescription</key>
    <string>${PRODUCT_NAME} Speech Recognition Usage</string>

    <key>NSVideoSubscriberAccountUsageDescription</key>
    <string>${PRODUCT_NAME} Video Subscribe Usage</string>

- Install pod by:
+ cd ios
+ pod install


- Develop environment in MacOs - Android

+ Install Android Studio 

+ Add permissions to your app android/app/src/main/AndroidManifest.xml file:

	<!-- Required -->
    <uses-permission android:name="android.permission.CAMERA" />

    <!-- Include this only if you are planning to use the camera roll -->
    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

    <!-- Include this only if you are planning to use the microphone for video recording -->
    <uses-permission android:name="android.permission.RECORD_AUDIO"/>


+ Insert the following lines in android/app/build.gradle:
android {
  ...
  defaultConfig {
    ...
    missingDimensionStrategy 'react-native-camera', 'general' // <--- insert this line
  }
}

Note: You have to one Android Studio before run above command also choose simulator output in Android Studio.


Step 6: Copy App.tsx and ā€˜src’ folder from ā€˜Code’ folder in package to ā€˜testmeup’ folder

- Run app in IOS
+ cd root/testmeup
+ npx react-native run-ios

- Run app in Android
+ cd root/testmeup
+ npx react-native run-android

Step 7: For first login app:
Please login app then logout and login again.