React Native Quickstart for HyperTrack SDKs

HyperTrack lets you add live location tracking to your mobile app. Live location is made available along with ongoing activity, tracking controls and tracking outage with reasons. This repo contains an example React Native app that has everything you need to get started in minutes.

Create HyperTrack Account

Sign up for HyperTrack and get your publishable key from the Setup page.

Clone Quickstart app

Install SDKs Dependencies

General Dependencies

yarn

or

npm install

iOS Dependencies

Quickstart app uses CocoaPods dependency manager to install the latest version of the iOS SDK. Using the latest version of CocoaPods is advised.

If you don't have CocoaPods, install it first.

cd ios
pod install

Set your Publishable Key

Open the App.js file. Locate the line with publishableKey: "YOUR_PUBLISHABLE_KEY" in the App class and set your Publishable Key inside the placeholder.

Set up silent push notifications

Set up silent push notifications to manage on-device tracking using HyperTrack cloud APIs from your server.

If you prefer to use your own messaging service to manage server-to-device communication, use the sync() method.

Log into the HyperTrack dashboard, and open the setup page and scroll to "Server to Device communication" section.

Android

Enter your "Server key", which you can obtain by going to your Firebase Console, navigate to your project, project settings, Cloud Messaging and copying it from "Project credentials" section.

iOS

Upload your Auth Key (file in the format AuthKey_KEYID.p8 obtained/created from Apple Developer console > Certificates, Identifiers & Profiles > Keys) and fill in your Team ID (Can be seen in Account > Membership).

Run the app

To run the iOS version open the app's workspace file (/ios/Quickstart.xcworkspace) with Xcode. Select your device (SDK requires real device, and won't work using simulator) and hit Run.

To run the Android version execute react-native run-android in the repo's root directory.

Enable location and activity permissions (choose "Always Allow" for location).

HyperTrack creates a unique internal device identifier that's used as mandatory key for all HyperTrack API calls. Please be sure to get the device_id from the app or the logs. The app calls getDeviceID() to retrieve it.

You may also set device name and metadata using the Devices API

Start tracking

Now the app is ready to be tracked from the cloud. HyperTrack gives you powerful APIs to control device tracking from your backend.

To use the HyperTrack API, you will need the {AccountId} and {SecretKey} from the Setup page.

Track devices during work

Track devices when user is logged in to work, or during work hours by calling the Devices API.

To start, call the start API.

curl -X POST \
  -u {AccountId}:{SecretKey} \
  https://v3.api.hypertrack.com/devices/{device_id}/start

Get the tracking status of the device by calling GET /devices/{device_id} api.

curl \
  -u {AccountId}:{SecretKey} \
  https://v3.api.hypertrack.com/devices/{device_id}

To see the device on a map, open the returned embed_url in your browser (no login required, so you can add embed these views directly to you web app). The device will also show up in the device list in the HyperTrack dashboard.

To stop tracking, call the stop API.

curl -X POST \
  -u {AccountId}:{SecretKey} \
  https://v3.api.hypertrack.com/devices/{device_id}/stop

Track trips with ETA

If you want to track a device on its way to a destination, call the Trips API and add destination.

HyperTrack Trips API offers extra fields to get additional intelligence over the Devices API.

• set destination to track route and ETA
• set scheduled_at to track delays
• share live tracking URL of the trip with customers
• embed live tracking view of the trip in your ops dashboard

curl -u {AccountId}:{SecretKey} --location --request POST 'https://v3.api.hypertrack.com/trips/' \
--header 'Content-Type: application/json' \
--data-raw '{
    "device_id": "{device_id}",
    "destination": {
        "geometry": {
            "type": "Point",
            "coordinates": [{longitude}, {latitude}]
        }
    }
}'

To get {longitude} and {latitude} of your destination, you can use for example Google Maps.

HyperTrack uses GeoJSON. Please make sure you follow the correct ordering of longitude and latitude.

The returned JSON includes the embed_url for your dashboard and share_url for your customers.

When you are done tracking this trip, call complete Trip API using the trip_id from the create trip call above.

curl -X POST \
  -u {AccountId}:{SecretKey} \
  https://v3.api.hypertrack.com/trips/{trip_id}/complete

After the trip is completed, use the Trips API to retrieve a full summary of the trip. The summary contains the polyline of the trip, distance, duration and markers of the trip.

curl -X POST \
  -u {AccountId}:{SecretKey} \
  https://v3.api.hypertrack.com/trips/{trip_id}

Track trips with geofences

If you want to track a device goig to a list of places, call the Trips API and add geofences. This way you will get arrival, exit, time spent and route to geofences. Please checkout our docs for more details.

Dashboard

Once your app is running, go to the dashboard where you can see a list of all your devices and their live location with ongoing activity on the map.

Documentation

You can find our integration guide at the SDK's README and API reference on our documentation website. There is also a full in-code reference for all SDK methods.

Support

Join our Slack community for instant responses. You can also email us at [email protected].