The different strategies to building a cross-platform app

This page summarizes the projects mentioned and recommended in the original post on dev.to

Our great sponsors
  • SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • WorkOS - The modern identity platform for B2B SaaS
  • tamagui

    Style React fast with 100% parity on React Native, an optional UI kit, and optimizing compiler.

    Three good example starter repositories that will get you up and running quickly, with less config work, is either with Tamagui:

  • view-transitions

    Native features faster: Quickest path to utilizing native features/UX improvements once they are released, no need to wait for a third party implementation. Example: shared element transitions first came to native, then were replicated on the web.

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  • react-native-url-router

    Discontinued A new way to create navigation in react-native

    Navigation: It lacks Solito, so it probably doesn’t attempt to unify navigation across native and web… Which would make you less dependent on React Navigation (which Solito uses), so you could use react-native-url-router which aligns with React Router even for native.

  • react-native-screens

    Native navigation primitives for your React Native app.

    react-native-url-router (a single navigation system, using React Router + react-native-screens for stacks + react-native-pager-viewfor tabs).

  • react-native-viewpager

    React Native wrapper for the Android ViewPager and iOS UIPageViewController.

    react-native-url-router (a single navigation system, using React Router + react-native-screens for stacks + react-native-pager-viewfor tabs).

  • expo-auto-navigation

    Discontinued Test automatic navigation using Expo and React Navigation

    Expo Router, upcoming, based on expo-auto-navigation (proof-of-concept / experiment)

  • flutter_platform_widgets

    Target the specific design of Material for Android and Cupertino for iOS widgets through a common set of Platform aware widgets

    Full control of rendering. Optimizes for consistent UI cross-platform, at expense of platform-specific capabilities and look-and-feel (that users on each platform might be more familiar with). But has Cupertino widgets for iOS look-and-feel, to alleviate that. (Android uses Material UI widgets). Could also use flutter_platform_widgets that automatically selects the UI widget's look-and-feel according to the mobile platform (iOS or Android).

  • InfluxDB

    Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

  • solid-site

    Code that powers the SolidJS.com platform.

    PWA can be built in any web framework like Solid, Voby, Vue, Svelte or Qwik.

  • core

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web. (by vuejs)

    PWA can be built in any web framework like Solid, Voby, Vue, Svelte or Qwik.

  • vite

    Next generation frontend tooling. It's fast!

    Tip: Use Tamagui for the optimal experience, and SSR compatibility. It solves the aforementioned problem, as it compiles your styling to CSS media queries on web. Tamagui is a lightweight style + design system library, a component libTamagui even uses a trimmed version of React Native Web internally, called react-native-web-lite that supports Vite.

  • turbo-ios

    iOS framework for making Turbo native apps

    turbo-ios and turbo-android are the shell/wrapper apps handling native navigation, written for native iOS and Android. They are provided for you, and works out-of-the-box, but you risk having to fiddle with iOS and Android development for maintenance/debugging later on.

  • turborepo

    Discontinued Incremental bundler and build system optimized for JavaScript and TypeScript, written in Rust – including Turborepo and Turbopack. [Moved to: https://github.com/vercel/turbo]

    NB: "Turbo" also has other meanings in a React Native context, so don't confuse Hotwire Turbo Native with Turbo Modules or Turborepo (as used in create-t3-turbo, mentioned later here).

  • turbo-android

    Android framework for making Turbo native apps

    turbo-ios and turbo-android are the shell/wrapper apps handling native navigation, written for native iOS and Android. They are provided for you, and works out-of-the-box, but you risk having to fiddle with iOS and Android development for maintenance/debugging later on.

  • turbo

    The speed of a single-page web application without having to write any JavaScript (by hotwired)

    The default option for Hotwire Turbo apps.

  • react-native-turbo

    Discontinued React Native framework for making Turbo native apps

    By using react-native-turbo, that utilizes turbo-ios (and in principle also) turbo-android under the hood.

  • react-native-webview

    React Native Cross-Platform WebView

    7. React inside React Native WebView [hybrid]

  • react-native-react-bridge

    An easy way to integrate your React (or Preact) app into React Native app with WebView.

    react-native-react-bridge is a bridge that makes communication between React and React Native via the WebView easier, so you'd likely want to use that. Alternatively, you could try to ease communication by directly making your WebView and React Native components run each other’s functions.

  • create-t3-turbo

    Clean and simple starter repo using the T3 Stack along with Expo React Native

    Navigation: It lacks Solito, so it probably doesn’t attempt to unify navigation across native and web… Which would make you less dependent on React Navigation (which Solito uses), so you could use react-native-url-router which aligns with React Router even for native.

  • create-kaol-app

    Kaol Stack - Prisma, Expo, Next, TRPC, Solito, Tailwind - A monorepo template for a truly universal app

    create-kaol-app

  • Svelte

    Cybernetically enhanced web apps

    PWA can be built in any web framework like Solid, Voby, Vue, Svelte or Qwik.

  • tailwind-react-native-classnames

    simple, expressive API for tailwindcss + react-native

    twrnc aka. tailwind-react-native-classnames instead of NativeWind, comparison. But twrnc doesn't have responsivity + SSR support.

  • solito

    🧍‍♂️ React Native + Next.js, unified.

    Solito (unifies two navigation systems: react-navigation and nextjs/router)

  • dripsy

    🍷 Responsive, unstyled UI primitives for React Native + Web.

    Dripsy unstyled UI primitives which are responsive (at the expense of SSR support though).

  • react-router

    Declarative routing for React

    Navigation: It lacks Solito, so it probably doesn’t attempt to unify navigation across native and web… Which would make you less dependent on React Navigation (which Solito uses), so you could use react-native-url-router which aligns with React Router even for native.

  • next-auth

    Authentication for the Web.

    Auth: it's own authentication setup, since NextAuth is not for native, until further ado.

  • react-native

    A framework for building native applications using React

    2. React Native + React

  • React

    The library for web and native user interfaces.

    Use any render library you want: React, Solid, Voby, Qwik, Vue, Svelte etc.

  • qwik

    Instant-loading web apps, without effort

    HTML over the wire. Could avoid the need for having a SPA with a GraphQL/REST/RPC API (and having to deal with client-side state management, navigation, etc.). Can use Rails/Laravel/Django for an MPA approach, or Qwik.dev for an SPA+MPA approach if you want to use JS and be cutting edge wrt. SSR and no hydration.

  • react-native-web

    Cross-platform React UI packages

    3. React Native Web (RNW)

  • NativeScript

    ⚡ Empowering JavaScript with native platform APIs. ✨ Best of all worlds (TypeScript, Swift, Objective C, Kotlin, Java). Use what you love ❤️ Angular, Capacitor, Ionic, React, Solid, Svelte, Vue with: iOS (UIKit, SwiftUI), Android (View, Jetpack Compose), Dart (Flutter) and you name it compatible.

    8. NativeScript + PWA [hybrid]

  • react-native-windows

    A framework for building native Windows apps with React.

    React Native can even run on Windows and MacOS too, not only mobile. Even on tvOS and other platforms. See React Native's many platform vision.

  • Ionic Framework

    A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.

    Ionic UI toolkit to get native look-and-feel (replicates style of iOS and Android components).

  • Flutter

    Flutter makes it easy and fast to build beautiful apps for mobile and beyond

    4. Flutter

  • sdk

    The Dart SDK, including the VM, dart2js, core libraries, and more.

    Must learn the Dart language.

  • capacitor

    Build cross-platform Native Progressive Web Apps for iOS, Android, and the Web ⚡️

    5. CapacitorJS + PWA [hybrid]

  • WorkOS

    The modern identity platform for B2B SaaS. The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts