Introduction to Hotwire Native Apps with Rails

🚀 What is Hotwire and Why the Buzz?

Hotwire (HTML Over The Wire) is a modern, Rails-native approach to building fast and dynamic web applications without writing much JavaScript. Instead of sending JSON and managing a heavy frontend, Hotwire sends fully rendered HTML over the network—whether via HTTP or WebSockets.

This strategy simplifies the architecture of your application:

• The server handles rendering
• The browser receives and directly inserts the HTML
• Turbo (part of Hotwire) efficiently updates the DOM without full-page reloads

⚙️ How Hotwire Works

Hotwire relies heavily on server-rendered HTML and uses a few powerful tools to streamline user interaction:

• Turbo Drive intercepts clicks and form submissions, fetches new HTML pages, and replaces the page content without a full reload.
• Turbo Frames allow you to define updatable regions of your page.
• Turbo Streams handle real-time updates (e.g., adding a new message or comment) via WebSockets or server-sent events.

With these tools, you can achieve SPA-like speed and interactivity without managing state on the frontend or writing complex JavaScript logic.

✅ Result: Fewer bugs, faster dev cycles, and a more maintainable codebase.

🧠 What About JavaScript? Enter: Stimulus

While Turbo handles about 80% of interactivity, there are still situations where you’ll need custom behavior. That’s where Stimulus JS comes in.

Stimulus is a modest, HTML-centric JavaScript framework that works alongside Turbo. It allows you to sprinkle in JavaScript only where you need it—without turning your app into a full-blown frontend JS project.

Think of it as JavaScript for the last 20% of edge cases—dropdowns, toggles, keyboard shortcuts, etc.

(We'll dive deeper into Stimulus in upcoming posts.)

📱 The Real Power: Hotwire Native (Turbo Native)

Perhaps the most exciting part of the Hotwire stack is Turbo Native, also called Hotwire Native.

It’s a web-first way to build native mobile apps for iOS and Android using the same server-rendered HTML you use for the web. Here's how it works:

• 90% of the app’s UI is rendered on the server in HTML.
• 10% is written natively (Kotlin for Android, Swift for iOS) to bridge native navigation and system components.

With this, you can:

• Reuse your existing Rails views
• Build mobile apps without duplicating your logic or UI
• Ship cross-platform faster and with fewer developers

✅ When Should You Use Hotwire?

Hotwire is ideal when:

• You want fast development with less frontend code
• You're already using Ruby on Rails
• You need a unified codebase for web and mobile
• You're building CRUD-heavy apps, dashboards, admin panels, or internal tools

💼 Business Benefits of Hotwire

If you’re building a SaaS product, a startup MVP, or an enterprise dashboard, Hotwire can drastically improve ROI and reduce time-to-market.

🏢 Real-World Success Stories

Some of the most well-known examples of Hotwire in production are:

• Basecamp – Project management software by 37signals
• Hey.com – A privacy-focused email service

Both apps were built in 5–6 months with just 3–4 developers. That's the power of Hotwire—build more with less.

Imagine cutting your development team in half and still launching faster.

🤝 How Humive Can Help

At Humive, we help startups and enterprises build fast, modern web and mobile apps using Hotwire, Turbo Native, and Stimulus—delivering scalable solutions with minimal frontend overhead.

🚀 Whether you’re starting fresh or want to migrate an existing product, we can help you get there faster and smarter.

📩 Let’s connect and discuss how Hotwire can power your next product!