Mobile SDK Sample App Using React Native
The best way to get up-to-speed on React Native in Mobile SDK is to study the sample
code.
Mobile SDK provides four implementations of the MobileSyncExplorer application, including a React Native version. To use MobileSyncExplorerReactNative, follow the instructions in the MobileSyncExplorerReactNative README.md file.
Here are a few notes about the MobileSyncExplorerReactNative files.
| Path | Description |
|---|---|
| README.md | Instructions to get started |
| installandroid.js | Use this script to install the Android sample. See README.md for details. |
| installios.js | Use this script to install the iOS sample. See README.md for details. |
| ios | The iOS application |
| android | The Android application |
| js | The JavaScript source files for the application |
| index.js | App start page |
| File | Component | Description |
|---|---|---|
| js/events.js | Event model | |
| js/App.js | MobileSyncExplorerReactNative | Root component (the entire application) (iOS and Android) |
| js/SearchScreen.js | SearchScreen | Search screen (iOS and Android) |
| jsContactScreen.js | ContactScreen | Used for viewing and editing a single contact (iOS and Android) |
| js/ContactCell.js | ContactCell | A single row in the list of results in the search screen (iOS and Android) |
| js/ContactBadge.js | ContactBadge | Colored circle with initials used in the search results screen (iOS and Android) |
| js/Field.js | Field | A field name and value used in the contact screen (iOS and Android) |
| js/StoreMgr.js | StoreMgr | Interacts with SmartStore and the server (via Mobile Sync). |
| js/NavImgButton.js | NavImgButton | Navigation Bar button |
| File | Description |
|---|---|
| android/ | Android native project |
| ios/ | iOS native project |