Notifications

in React Native

Shawn

McKay

 

Why Notify?

Why Notify?

Educate

Promote

Notify

Psychology

of

Notifications

Don't be evil

Overview

  • Text Messages are complicated

  • Push Notifications are better

  • Deep Linking is easy

The Project

Alerts

Complexity of Notifications

Semios

Precision Farming

Largest IOT network in AgTech

Mating disruption of pests

Data models/predictions

 

"TIA - Most Promising Startup in BC" - 2018

"Top 20 CleanTech in the World" - 2018

Why we Notify

Notification Types

Email

SMS

Push Notification

 

Grower

Workers

have app
receive: email, push

no app

receive: email, sms

Demo

SMS

5 ways they're complicated

Twilio Common Services

  • Two Factor Authentication

  • Phone Verification

  • Integrations (Slack, Alexa)

  • Extensive API

0.75¢ / segment

4.5¢  /   sms

1. Pricing

What's a Segment?

It's complicated.

GSM > UCS2

2. Carrier

Violations

How to not be labelled a Spammer

3. Messaging Service?

Buying Numbers

$1 / month

4. No Caller ID

Alpha Sender Id not available in US/Canada

5. Beyond SMS

MMS: images, video

RCS: the future of SMS

RCS

SMS Server

npm install twilio

Single Number

Messaging Service

Testing

`twilio(ID, TOKEN).messages.create` is hard to test. Wrap it and use a spy on the sender.

Errors

2160

user texted STOP, STOPALL, UNSUBSCRIBE, CANCEL, END or QUIT

Connection

ESOCKETTIMEDOUT
ETIMEDOUT
ECONNRESET

Push Notifications

A Better Choice?

Sender

OS

User

Check permissions
Check "Do Not Disturb"

Phone, Watch, etc.

dashboard/UI

advanced PN features

$0 - $350 per month.

tiered pricing

code samples

basic features

free

unlimited

Basic

default sound
in notifications view

badge with count
link

Advanced

1. Rich notifications (gif, video, image)

2. Interactive Notifications (response)

3. In App Notifications/Popups

4. Grouped Notifications (thread-id)

5. Silent Notifications

1. Rich Notifications

gif, video, image

2. Interactive

Responses

3. In App Notifications

4. Grouped Notifications

give alert types a "thread-id"

5. Silent Notifications

in notifications view, but no disruption

Push Notifications

with Expo

Notification Server

Errors

  • DeviceNotRegistered (delete token)

  • MessageTooBig (log)

  • MessageRateExceeded (retry)

  • InvalidCredentials (log)

App Permissions

"ExpoToken[somerandomstring]"

Expo Token

Register token with login

Remove token with logout

Foreground vs. Background

1. App closed = notification

2. App open in background = notification

3. App open in foreground = in-app popup

Foreground

"Imitation PN"

`origin = received`

Trigger vibration on IOS

Trigger modal popup

Background

"Real PN"

`origin = selected`

Notifications Listener

Syncing Badge Count

use `"badge": 42` from server
`Notifications.setBadgeNumberAsync(42)` in client

Linking from PN

See 'data' in previous example

does not work in Android
if user has >=4 notifications

Deep Linking

urls for mobile

How Deep Linking Works

Expo

See app.json docs
expo.scheme="appName"

Not Expo

Domain

Linking w/ React Navigation

See "path" in docs

Branch

API

Expo Branch Listener

Testing Deep Linking

Publish a Beta

Review

  • Text Messages are complicated

  • Push Notifications are better

  • Deep Linking is easy

Shawn

McKay

 

Hiring!

Notifications in React Native

By Shawn McKay

Notifications in React Native

  • 2,014