As a developer with personal projects, I rarely commit to dropping loads of cash on my pet ideas. I prefer to hack something together rather than pay for a tool to shrink my development time. As a cost risk, I consider time less valuable than my limited supply of discretionary funds—that is, until my side-app hits it big and I rake in the billions. But, if you’re not like me, and you’re looking for robust solutions to modernize legacy systems or build scalable internal or customer-facing apps in the right time to market, then I advise you to jump to my cross-platform mobile development guide for enterprises right away.

If not, then this list includes open-source and free cross-platform mobile app development tools that any developer can use immediately.

Note: Some of the free cross-platform mobile application development tools are also available as paid plans, but all provide free and unlimited production use.

 

1. Apache Cordova

Apache Cordova is first on this list because it powers the build process for most free cross-platform mobile application development tools, and many that aren't free, for that matter. Formerly known as PhoneGap, Adobe released Cordova as an open-source project which, as of this writing, has received contributions from BlackBerry, Google, IBM, Intel and Microsoft.

The majority of cross-platform mobile application development tools on this list, both free and paid, use Cordova to package a single codebase into a native executable. Cordova first bundles HTML, CSS and JavaScript into a client-side package. Then, the software executes and renders the custom code within a native WebView — this is known as the “hybrid” application technique. The hybrid approach provides a Write-Once-Run-Anywhere solution (WORA).

The term WebView refers to a native interface element that permits mobile developers to render web content in their application. In web development, we use Iframes; in mobile development, WebViews.

By wrapping web code in a native Cordova package, Cordova can provide access to native APIs. And by incorporating community-built plugins, apps can connect to any number of those APIs using plain JavaScript.

Pros: Cutting out the middleman. By working directly on top of Cordova, developers have access to the latest updates from Apache’s team. With each version, Cordova gains access to critical OS enhancements. These enhancements may improve Cordova’s performance and provide it with access to new APIs. Build right on top of Cordova and you’ll never miss out.

Cons: Cordova is UI and framework-agnostic. It leaves all the design and architecture decisions to the developer. This may not be an issue if you’ve built mobile-first websites before. But if this is your first time working on a mobile application, consider a framework that does a bit more hand-holding. And according to StackOverflow’s developer survey, developers dread working with Cordova above all others.

2. Adobe PhoneGap

Yes, the actual PhoneGap product is separate from Apache Cordova. As stated above, PhoneGap was originally the basis for Cordova, but is now a standalone product powered by Cordova—times they are a changin’. The primary benefit Adobe provides with PhoneGap is a GUI build system that abstracts the command line messiness of Apache Cordova.

By providing an interface to build Cordova applications, PhoneGap simplifies the process and gets developers working sooner. PhoneGap also offers an application server you can run from your machine to host your apps over the network. The server accelerates the build→run→revise loop so developers can spend more time coding and less time running, compiling, and deploying manual updates.

Pros: Simplifies Apache Cordova by providing a GUI build system and template projects to help kick-start hybrid development (one of those templates includes another tool on this list, Framework 7). PhoneGap also has the continued support of Adobe and hundreds of open-source developers.

Cons: PhoneGap does not have a strong opinion on how to build applications. So while it simplifies Cordova, it will not hold your hand much further.

Hmm: PhoneGap, while slim, has a code profile that sits above Cordova. Some developers complain that this results in poor application performance. The merits of this complaint are difficult to assess. I believe that performance issues stem primarily from the specific applications, not the framework itself.

3. Ionic Framework

In the previous section, I revealed that PhoneGap is a thin layer above Apache Cordova that improves the hybrid development experience without forcing an application paradigm or structure onto the developer. For a similar yet more opinionated tool that provides an excellent development experience, consider the Ionic Framework.

Ionic combines Angular with its own UI library to provide a cross-platform mobile application development experience that many web developers will find familiar. They find it so familiar in fact, that Ionic has become synonymous with cross-platform hybrid development. More so than PhoneGap, actually. However, Ionic’s mobile build process relies on PhoneGap and therefore also inherits all of Apache Cordova’s plugins.

Pros: Ionic is the world’s prevailing hybrid cross-platform solution because it allows web developers to continue using the front-end framework many of them are familiar with: Angular. By incorporating Angular into their framework, Ionic eases the transition from web to mobile development. Ionic also supports Progressive Web Applications that run in Chrome, and hybrid desktop applications enabled by Electron.

Cons: At current pricing structures, developers on Ionic’s free Kickstarter plan are limited to development builds. And development builds are restricted to debugging on one’s own device: deploying development builds to either app store is not possible. To publish their applications, developers must upgrade their subscription. 

4. Framework 7

Framework7 is another one of the free cross-platform mobile application development tools powered by Apache Cordova. Framework7 provides an application framework (built on Vue.js) and a host of ready-made interface elements that mimic native interfaces. This tool recreates standard iOS designs and Google’s Material Design patterns to replicate the “native look” mobile users expect. Here’s an example of how Framework7 helps developers make carbon copies of iOS designs:

 

Framework7 also allows developers to customize the interface — these built-in themes are merely guidelines that can shorten development time.

Pros: Framework7 adds two critical layers to Cordova application structure and interface elements. If you’re willing to sacrifice a little control, you will gain plenty of out-of-the-box capabilities with Framework7. These features will accelerate your development cycle when compared to working with Cordova directly.

Cons: This is an open-source project and a recent one, at that. There is no guarantee the Framework7 community will remain active and consistently incorporate the latest designs from Cupertino and Mountain View, potentially leaving applications looking out-of-date. Framework7 is also highly opinionated. If you’re not a fan of Vue or are unwilling to learn, you will have to look for another tool.

5. Apache Weex

Yes, this is another one of the Apache-sponsored free cross-platform mobile application development tools. The developers of Weex combined the idea behind Cordova with a runtime JavaScript interpreter. Their tool generates native experiences from a single source code whereas Cordova executes JavaScript and renders HTML in a WebView. Weex interprets HTML and renders it dynamically using native view elements.

Like Framework7, Weex provides UI components out of the box. But these elements translate to their native counterparts during interpretation, thereby boosting performance considerably. And like Cordova, Weex has a strong community of independent developers that contribute new design and interface plugins to keep the platform current.

Pros: Performance. Weex will execute JavaScript applications at near-native speeds. And users will find it difficult to distinguish a Weex application from a native one: both employ native UI elements whereas hybrid (WebView-based apps) render HTML and CSS directly.

Cons: Unlike Cordova, Weex is not fully endorsed by the Apache Software Foundation. It is currently an incubation project. And developers will not be able to port apps written on Weex to other platforms. So if Weex fails to acquire endorsement, developers may be forced to rewrite a considerable portion of their apps in the future.

6. React Native

Whereas Weex relies on Vue as its core application framework, React Native inherits from React itself. If you’re familiar with building web applications in React, adopting React Native for your mobile development is a no-brainer. And like Weex, React Native interprets your source code and converts it to native elements on-the-fly. But if it’s a toss-up between this and other JavaScript-to-native frameworks, consider React Native’s popularity.

React Native is unquestionably the most popular JavaScript-to-native platform. The tool owes its popularity to its famous founder: Facebook. Both Facebook’s and Instagram’s native applications are built with React Native. If two of the world’s most heavily-used applications can trust this framework, so can you.

Pros: React Native is battle-tested. Facebook and Instagram have millions of daily-active-users each, and those users demand performance. And as long as those products rely on React Native, developers can expect Facebook engineers to regularly update this framework. And just like Weex and other JavaScript-to-Native platforms, React Native offers a performance edge over hybrid solutions.

Cons: If you don’t like to work with React, don’t expect React Native to change your mind. And compared to earlier tools in this list, React Native is not a WORA solution. This may not be an issue for all, but React Native requires that developers tailor each interface implementation to its targeted platform. That means you will create both an Android and an iOS version of each screen and element. And despite relying on web technologies like JavaScript, the interface is a mix of custom markup language and native UI. Therefore, developers cannot use existing CSS libraries or jQuery plugins.

7. NativeScript

NativeScript is React Native’s direct competitor. Supported by a large organization (Progress) and used by industry veterans (SAP), NativeScript offers a similar cross-platform development experience to its backed-by-Facebook rival, but resembles the Ionic Framework approach to development. Like React Native, NativeScript compiles your JavaScript application to a native mobile experience. At its core, it promotes Angular 2 as its application framework, but developers can opt-out and use standard JavaScript with NativeScript APIs.

NativeScript also lets developers get a feel for the end product by providing interface demonstration applications for Android and iOS. Both applications were generated from a single codebase, proving that NativeScript is a WORA solution capable of achieving high performance on both platforms.

Pros: NativeScript offers the same performance over hybrid solutions by building native applications from JavaScript. Enterprise-class companies support and use NativeScript in their own applications, so it’s going to stick around awhile. NativeScript also integrates directly with Gradle and CocoaPods, thereby allowing developers to incorporate native Swift, Objective-C, and Java libraries into their NativeScript projects.

Cons: Compared to React Native, NativeScript applications have not experienced the surge of daily users bombarding their mobile front-ends. One cannot point to a single application built on this tool that millions of users access each hour (like Facebook with React Native). If you anticipate your application to receive immense traffic, there’s no case study that validates NativeScript as a viable option among the free cross-platform mobile application tools out there (but you could be the first!). And like React Native, NativeScript uses a custom markup to design its interfaces—no CSS3 or HTML5.

8. Flutter

We’re going to take a slight left turn to talk about Flutter. Flutter is Google’s answer to Google’s own problem: “we keep building iOS and Android applications for each mobile product; that’s getting annoying.” That’s not an actual quote, but rather a sentiment at least one Googler has certainly expressed. Flutter compiles to native code, but requires something other than JavaScript: Dart. Google’s confounding choice of Dart over JavaScript becomes predictable when you learn that Dart was invented at Google to replace JavaScript.

Not only does Flutter bolster Google’s own programming language, it also remains intimately tied to another Google product: Material Design. If you’re willing to do things the Google way, you will reap the rewards. Flutter is the only open-source multi-platform solution supported by a company that also happens to run a major mobile platform. Apple has no such product, and Microsoft’s Xamarin tool is less permissive.

Pros: A non-zero number of Google’s mobile applications are built on Flutter. And if Flutter is good enough for the corporate king of mobile, it’s probably good enough for you. The Dart language and its mobile run-time approach native performance speeds; Google wouldn’t settle for less. And by using Google’s tools, you can build an app that feels familiar to people who use Gmail, Google Maps, and other applications that incorporate Material Design.

Cons: Flutter is an alpha product. And with a fluctuating mobile landscape, there’s no guarantee it will reach version one or that Google will continue to support it (though anecdotal evidence suggests they will). Additionally, most developers are not familiar with Dart, so Flutter comes bundled with a language you may have to learn before getting started. And while Flutter allows custom widgets and styles, it remains heavily biased toward Material Design.

9. Jasonette

We took a left turn in this list of free cross-platform mobile application development tools with Flutter, but now we’re going to take a u-turn into outer space with Jasonette. If you’re a web developer, you’re familiar with server-side rendering. That process generates the markup on the server and the browser downloads the completed page directly from the cloud. Jasonette functions similarly: your server provides a JSON file for each mobile screen the user interacts with.

On the client side, Jasonette renders this file using native mobile components. With Jasonette, there is no intermediary runtime that executes JavaScript, Dart, or any other non-native language. The only overhead in a Jasonette application is the retrieval and parsing of your JSON layouts. If you plan to build a stateless mobile application, you have no cross-platform option that is superior to Jasonette. And Jasonette provides user actions that can make network requests and draw results without additional server-side rendering.

Pros: Jasonette is as native as you can get—both layouts and logic use on-device APIs and runtimes. And this JSON-based framework may significantly reduce the size of your mobile code base.

Cons: For non-static applications, your server-side implementation requires added functionality to reply with Jasonette-styled JSON. And Jasonette’s support for embedded logic looks something like this:

Which blends logic and layout into a grotesque, un-testable monster. For large teams, a Jasonette-based application may be too unruly to maintain.

10. Manifold

If you have experience working on responsive, mobile-targeted websites or if you already have a working mobile website, ManifoldJS may be the solution for you. Unlike other free cross-platform mobile application development tools on this list, Manifold does not aid your mobile development process in any substantive way. All it does is wrap an existing hosted web application with a native container.

With a command like this,

manifoldjs https://my-website.com -p android

Manifold turns your web application into a native package you can submit to Google Play. Under the hood, Manifold uses the Crosswalk Project to provide consistent WebView performance and capability across all mobile platforms (as do most hybrid tools on this list). So if you’d prefer to build a mobile site or already have one that simply needs a native wrapper, Manifold is your choice.

Pros: Manifold is simple to use and can help you take full advantage of the mobile-first site you already have running on the web. With some tweaks, your web app will run like a native one in a matter of seconds.

Cons: Accessing native APIs is tricky with manifold, but possible. The bigger concern is the lack of an offline mode. Manifold has an “offline feature,” but it merely shows a splash screen to users who attempt to access your application while offline. With Manifold, there is no other option. So if custom offline behavior or cached data is a requirement for your mobile application, look elsewhere.

Reining in the Free Cross-Platform Mobile App Development Tools

You’ve reached the end of the free cross-platform mobile application development tools rope—quite a rope, yes? If, as of this moment, you’re still wondering whether free editions are the right tool for you, then I suggest you take our favorite for a test drive to help you make your decision. 

But, if you felt the options in this list were too hands-on or perhaps you need a tool that will get your team to market faster, take a look at my cross-platform mobile development guides for small budgets and enterprises. And if want to know what the users are saying about them, check out this article about best mobile app development platforms for 2019 based on real users’ reviews.

Thanks for reading! Have you tried any of the free cross-platform mobile application development tools on this list? Are you excited to try a new one out? Let me know on Twitter.