Native push notifications can be daunting, but with a clear understanding of the process and the right tools, you can successfully implement them in your Hotwire Native apps. In this article, we'll dive into the world of push notifications and explore how to get started.

Push notifications are often considered the holy grail of mobile app engagement, offering instant and personalized interactions that drive higher engagement than email or SMS. With native apps still being the best way to send reliable, timely notifications, it's no wonder why they're a major selling point for many mobile applications.

However, implementing push notifications can be a complex process, requiring careful consideration of multiple moving parts. But fear not – with years of experience in implementing push notifications in Hotwire Native apps, we've got you covered. In this article, we'll break down the essential steps to get your native app sending push notifications like a pro.

Understanding the Actors Involved

Before diving into code, it's essential to understand the key players involved in sending push notifications. On iOS devices, push notifications are sent via Apple Push Notifications service (APNs), while on Android devices, they're sent via Firebase Cloud Messaging (FCM). These services rely on unique notification tokens provided by each device.

The flow works as follows:

  1. The device provides a unique notification token and sends it to the server.
  2. The backend server sends a payload to APNs/FCM with the token.
  3. The device receives the push notification from APNs/FCM.

Implementing Push Notifications with Hotwire Native

For Hotwire Native, we often implement a bridge component that registers the device for push notifications and sends the token via an API client to the server.

Here's an example of how this might look in code:

`swift

class NotificationTokenComponent: BridgeComponent {

class var name: String { "notification-token" }

override func onReceive(message: Message) {

let center = UNUserNotificationCenter.current()

let options: UNAuthorizationOptions = [.alert, .sound, .badge]

try await center.requestAuthorization(options: options)

UIApplication.shared.registerForRemoteNotifications()

}

}

`

We then persist the token via Action Push Native in a new JSON endpoint:

`ruby

class NotificationTokensController < ApplicationController

def create

ApplicationPushDevice.find_or_create_by!(

token: params[:token],

owner: Current.user

)

head :ok

end

end

`

Finally, we send a notification to APNs/FCM using the ApplicationPushNotification class:

`ruby

ApplicationPushNotification.new(title: "A new notification!")

.deliver_later_to(Current.user.application_push_devices)

`

Getting Started with Push Notifications

If you're looking for a more detailed approach or want to skip the trial-and-error process, our paid section includes:

  • The exact 4-step approach we follow to get everything working
  • A checklist to help you spend less time debugging
  • The full source code for Rails, iOS, and Android apps

By following these steps and leveraging your understanding of the key players involved in sending push notifications, you'll be well on your way to successfully implementing native push notifications with Hotwire Native.