NativeScript: Build native iOS and Android apps with JavaScript

NativeScript lets you use Angular, TypeScript, or JavaScript to build mobile apps with a truly native look and feel

NativeScript: Build native mobile apps with JavaScript
Thinkstock

Today, enterprise developers have an enormous number of frameworks at their disposal to build mobile applications. A popular approach is to use a framework such as Apache Cordova to build “hybrid” mobile apps, which allow developers to leverage web development skills and still tap native smartphone features like geolocation and the accelerometer. However, because hybrid frameworks replace native user interfaces with HTML, they often don’t deliver native or even consistent performance.

NativeScript is an open source framework for building truly native iOS and Android apps in Angular, TypeScript, or JavaScript. NativeScript not only taps native iOS and Android APIs, but also renders native iOS and Android user interfaces. NativeScript is a good fit for any enterprise team with existing web development skills, as it can dramatically reduce the amount of time necessary to develop native iOS and Android applications. And it can do so without compromising on the user experience.

NativeScript uses a subset of CSS as the design language of the application. It doesn’t try to invent new concepts in that space, but rather leverages existing standards and skills and extends them to the mobile app development world, as seen in this code example of creating an image of an apple and styling it to spin:

Are you compatible with NativeScript? While other frameworks may be prudent options for some app development projects, NativeScript is an excellent choice for organizations with the following six requirements:

<Image src="~/images/apple.jpg"></Image>
@keyframes spin {
  from { transform: rotate(0); }
  to { transform: rotate(360); }
}
Image {
  animation-name: spin; animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

1. Developers want to reuse existing web development skills

The biggest difference among popular mobile frameworks is the language they require developers to write the majority of their code in. For native iOS apps, that language is Objective-C or Swift, while for native Android apps that language is Java. For NativeScript, that language is JavaScript.

NativeScript uses JavaScript because of its flexibility as well as its popularity and widespread use. Fans of TypeScript – a typed superset of JavaScript ­– will find first-class support for TypeScript directly from the NativeScript CLI. Additionally, NativeScript uses a subset of CSS for styling apps, NPM for package managementWebpack for app bundling, and other tools familiar to web developers.

Perhaps the most enticing feature NativeScript offers web developers is integration with the Angular framework. For companies aiming to consolidate technology stacks, the ability to use a single framework for both web and native apps and even share code between web and native projects is hard to beat.

nativescript angular Progress Software

2. The app must run natively on both iOS and Android

NativeScript is a cross-platform framework that enables developers to write native Android and iOS applications from a single codebase. This can be a huge timer saver, especially for maintaining separate Android and iOS apps.

NativeScript lets developers code with familiar JavaScript, TypeScript, markup, and CSS APIs, and it interprets the code into native user interfaces on both iOS and Android. For example, this NativeScript <ActionBar> component abstracts away an underlying UINavigationBar for iOS and android.support.v7.app.ActionBar for Android:

<ActionBar title="My App"></ActionBar>

These native APIs are completely transparent, so developers can run their app with an <ActionBar> and let NativeScript translate the control into the appropriate native user interface components.

nativescript ios android uis Progress Software

While this same application could be written fairly easily in native code for iOS and Android, the cost of maintaining two different codebases that use two separate technology stacks can be high. In addition, often the two applications need to be maintained by separate teams with the appropriate skill sets for each platform. Thus, while NativeScript can be used to write an app for a single platform, the framework works best for apps that must run on both iOS and Android.

3. The app needs native performance

While NativeScript is not the only framework available that allows developers to create Android and iOS apps from a single codebase, its key differentiator from web-based alternatives like Apache Cordova is its user interface (UI).

Whereas Cordova-based frameworks use a WebView to present the interface in HTML, NativeScript renders completely native iOS and Android user interface controls. This use of native user interface components lets NativeScript developers build compelling UIs, as NativeScript is not limited by what can be done with the DOM in web apps. NativeScript works best for apps that need the snappy performance that native user interface controls provide.

4. The app needs native iOS or Android APIs

Enterprise developers might need an iOS or Android app to have access to native iOS or Android APIs. NativeScript provides several features out of the box to make this sort of native access simple, such as the ability to directly access iOS and Android APIs in JavaScript or TypeScript code. This means developers can type things like java.lang.Math.min or UIAlert and have those native APIs simply work. To some developers, using native APIs might be intimidating. Luckily for them, there are hundreds of NativeScript plug-ins that abstract away the complex native details into easy-to-use APIs.

Of course, NativeScript is not the only cross-platform mobile framework with a plug-in ecosystem (Cordova has plug-ins too), but its plug-ins do more than others can, including accessing native frameworks like CocoaPods and letting developers build native user interface plug-ins. Pro tip: Developers should search the NativeScript Plugins Repository to see if the NativeScript community has already created the functionality they need.

5. The tool needs to be free and open source

The NativeScript framework is free and open source. The NativeScript project has hundreds of contributors across the core framework, sample projects, and documentation. The core of NativeScript is licensed under the business-friendly Apache 2.0 software license. This all equates to NativeScript being free to use for any project and having a license that doesn’t paint organizations into corners.

What’s more, nearly all the community-written NativeScript plug-ins are also free and open source. Therefore, if developers need to extend an app with native functionality, they have many existing examples to reference and build on top of. If it’s important for an enterprise to build on an open technology stack that can be easily modified and inspected, NativeScript has that covered.

6. Enterprises need a framework with a strong corporate backing

Many organizations want a framework backed by an established company that is not at risk of going away during a development project. NativeScript is backed by Progress, a large, publicly traded company with a history of building software for screens of all sizes, and that offers a variety of enterprise support agreements for organizations that want to adopt NativeScript on a larger scale.

Progress is also actively developing tooling for NativeScript. Progress recently announced NativeScript Sidekick, a companion application that dramatically accelerates the NativeScript development process. SideKick provides a wealth of tools and application templates for developers to leverage to gets apps up and running quickly.

NativeScript allows enterprises already using JavaScript to leverage the standard to build business applications for a variety of use cases, while delivering first-class application experiences unhindered by WebView performance issues. You never have to wonder whether your mobile development framework will deliver native-like performance. With NativeScript, native performance is guaranteed by design.

Plus, the NativeScript architecture allows JavaScript developers to leverage their favorite front-end framework. Even when developers build an application in standard JavaScript, without trying to rely on frameworks like Angular or Vue, NativeScript can support these to ensure that even framework-specific skills are leveraged. Today, while NativeScript fully supports Angular, there are ongoing efforts in the community to enable support for Vue as well.

And there you have it. NativeScript is a powerful, agile framework that can be used to build business applications for a variety of use cases, especially for apps that must run natively on iOS and Android and need native performance or access to native iOS or Android APIs. NativeScript enables enterprises to capitalize on existing web development skills, leverage free and open source tools, and draw on a framework with strong corporate and community backing.

To get started with NativeScript, check out NativeScript.org for documentation, samples, videos, and tutorials for Angular/TypeScript and JavaScript developers.

Faris Sweis is senior vice president and general manager of the developer tooling business at Progress. Previously Sweis was the chief technical officer at Telerik, which was acquired by Progress in 2014, and prior to that he spent 10 years at Microsoft.

New Tech Forum provides a venue to explore and discuss emerging enterprise technology in unprecedented depth and breadth. The selection is subjective, based on our pick of the technologies we believe to be important and of greatest interest to InfoWorld readers. InfoWorld does not accept marketing collateral for publication and reserves the right to edit all contributed content. Send all inquiries to newtechforum@infoworld.com.

Copyright © 2017 IDG Communications, Inc.