WhoBuilt

Getting into Physical web with React of Things

Sep 14, 2018· 30 min· 145 views·Watch on YouTube

Speaker

Vladimir Novick, a software architect at CodeValue, explains beacons, Bluetooth Low Energy, and React Native apps for physical-world interactions at a Callstack tech talk.

Beacons and Bluetooth basics

Novick describes beacons as small Bluetooth Low Energy transmitters that send packets about every tenth of a second. Eddystone can broadcast a URL, while iBeacon broadcasts an identifier with major and minor numbers. BLE uses little power and can run for about a year on a common battery.

Using proximity to add physical context

Novick explains that iBeacons help apps identify a user's proximity to a place or object. Examples include indoor navigation, store offers, hotel check-in, contactless payments, museum information, and airport directions. Apps can match beacon identifiers against server data and use the result to show relevant content or notifications.

Detecting and ranging beacons in React Native

Novick demonstrates an app that compares nearby beacons and shows which one is closest, including two devices with different major and minor values. He outlines registering beacon regions, requesting location permission, checking the user's location, and ranging for matching beacon IDs. For a larger deployment, he says beacon details would typically come from a server.

Connecting to devices with GATT

Novick distinguishes beacon broadcasts from GATT connections, which allow a phone and peripheral to exchange data through services and characteristics. Using the react-native-ble-plx package, he scans for a light bulb, connects, discovers its services and characteristics, and writes values to control brightness and color. For an undocumented bulb, he describes inspecting UUID properties and using captured data and Wireshark to work out the values it accepts.

Takeaways

  • Use beacon IDs and location context to tailor app content to where a user is.
  • Keep beacon data separate from app logic so a server can map IDs to content and actions.
  • For BLE peripherals, discover services and characteristics before attempting to read or write values.
  • Undocumented BLE devices may require inspecting traffic and testing characteristic values to learn their behavior.

Mentioned in this talk

Search inside this talk

What was claimed 5

  • role at
    Vladimir Novick is software architect at CodeValue
    “I work as a software architect at CodeValue.”
    YouTube
    Unverified1 source· Talk
  • feature
    Eddystone: Broadcasts a URL to Physical Web-compatible services
    “Eddystone beacons broadcast a URL to anyone who has a Physical Web-compatible service.”
    YouTube
    Unverified1 source· Talk
  • feature
    iBeacon: Uses a unique ID plus major and minor numbers to identify a beacon and estimate its distance
    “They give you an ability to know where the beacon is and what the distance to it is.”
    YouTube
    Unverified1 source· Talk
  • uses
    “In order to create virtual beacons, we need to import the beacons from React Native Beacons Manager.”
    YouTube
    Unverified1 source· Talk
  • feature
    react-native-ble-plx: Supports scanning for BLE devices, connecting, and discovering services and characteristics
    “We use the react-native-ble-plx package.”
    YouTube
    Unverified1 source· Talk

Related talks