Build Once, Run Anywhere: Setting Up Hotwire Native with Rails for Android & iOS

Build once, run anywhere with Hotwire Native—reuse your Rails HTML/CSS to create Android & iOS apps. Enjoy native navigation, push notifications, and great performance with a single server-driven codebase—no need to rewrite in Swift or Kotlin.

Build Once, Run Anywhere: Setting Up Hotwire Native with Rails for Android & iOS
Build Once, Run Anywhere: Setting Up Hotwire Native with Rails for Android & iOS

Today, we are going to set up a Ruby on Rails 8 Hotwire Native application on iOS and Android devices.

Let's start with the iOS setup first.

IOS Setup

Download and install Xcode 15+ on your device.

Create a new iOS App in Xcode:

Click the “Create New Project” Button and select the default iOS app option, and click the Next button.

Now, in the project creation form, enter the project name, set the Organisation Identifier, select ‘Storyboard’ for the Interface, and choose ‘Swift’ as the Language. Leave the other settings as it is, then click the ‘Next’ button.

Select where to set up the project and then click the ‘Create’ button. 

Integrate Hotewire Native in your project.

Add Package Dependencies to your Project.

File → Add Package Dependencies → Type this into the search bar: github.com/hotwired/hotwire-native-ios → select hotwire-native-ios → Add Package → choose your project as the target project → Add Package.

Now, open the SceneDelegate file and replace your entire code with the code below.

import HotwireNative
import UIKit

let rootURL = URL(string: "https://hotwire-native-demo.dev")!

class SceneDelegate: UIResponder, UIWindowSceneDelegate {
    var window: UIWindow?

    private let navigator = Navigator(configuration: .init(
        name: "main",
        startLocation: rootURL
    ))

    func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
        window?.rootViewController = navigator.rootViewController
        navigator.start()
    }
}

Run

Now run your app, and you can see this type of screen.

viola! Your first Hotwire Native app setup is done!

Android setup

Download and set up Android Studio. 

Create Project

Click the New ProjectNow Select Empty Views Activity → Next

`

Next, choose API level 28 or higher as the minimum SDK, and select Kotlin DSL as the build language.

Now, integrate Hotwire Native into the Android app 

First, add Hotwire Native Dependencies in the app-level build.gradle.kts file.

  dependencies {
   implementation("dev.hotwire:core:latest-version")
   implementation("dev.hotwire:navigation-fragments:latest-version")
}

Enable internet access permission for the app by adding this line above the <application> node in the AndroidManifest.xml file. 

<uses-permission android:name="android.permission.INTERNET"/>

Set up the app's layout by replacing the entire code in activity_main.xml with the code below.

Now, replace all the below code with your ​ MainActivity.kt code 

package com.example.myapplication // update to match your project

import android.os.Bundle
import android.view.View
import androidx.activity.enableEdgeToEdge
import dev.hotwire.navigation.activities.HotwireActivity
import dev.hotwire.navigation.navigator.NavigatorConfiguration
import dev.hotwire.navigation.util.applyDefaultImeWindowInsets

class MainActivity : HotwireActivity() {
   override fun onCreate(savedInstanceState: Bundle?) {
       enableEdgeToEdge()
       super.onCreate(savedInstanceState)
       setContentView(R.layout.activity_main)
       findViewById(R.id.main_nav_host).applyDefaultImeWindowInsets()
   }

   override fun navigatorConfigurations() = listOf(
       NavigatorConfiguration(
           name = "main",
           startLocation = "https://hotwire-native-demo.dev",
           navigatorHostId = R.id.main_nav_host
       )
   )
}

Run

Click to sync and then run the project. And you can see this type of screen.

There you go! Your Android app is ready with Hotwire Native app!

In the Next article, we will learn how to integrate a camera in the Hotwire native app. So keep following us!


At Humive, we specialize in building powerful Hotwire Native apps using Ruby on Rails — enabling you to launch mobile (Android & iOS) and web applications seamlessly with a single, unified codebase. With the same skill set, our team delivers fast, responsive, and maintainable apps across platforms — helping you reduce cost, time, and complexity.

Let’s build something remarkable, once — and run it everywhere.