At KiZAN, we’ve been searching for the right set of tools to help us be innovative, stay on the edge of mobile technologies, and delivering the most value to our customers at the best cost. We have previously used PhoneGap/Cordova, Xamarin Forms, and native app development technologies. For the last 6 months, we have been exploring Telerik’s NativeScript – a platform for building cross-platform mobile apps with JavaScript. I recently held a webinar introducing NativeScript to several of our customers. Watch the video and read below for some more information.

Options

As developers, our challenge has been how to remain relevant on all of the various platforms (iOS, Android, and Windows Phone) and languages (objective-c, Swift, C#, Java, etc.). As Justin Tindle previously wrote, hybrid app development is always an option, but has been criticized by many as being slow. This might be acceptable for LOB (line of business) apps, but you should understand the hybrid paradigm before choosing this path.

NativeScript

Considering the options and challenges of hybrid app development, I feel NativeScript is a compelling option for mobile development. NativeScript is a framework for building cross-platform, native apps with JavaScript. Let’s break this down a bit and explain what I mean by this.

• Framework: NativeScript is a collection of development libraries and tools (not a language itself), but it uses languages you already know (JavaScript).
• Cross-platform: for iOS, Android, and Windows Phone
• Native apps: unlike hybrid apps, native apps DO NOT run in a web browser, they are truly native
• JavaScript: yep, JavaScript – you can write in the (arguably) most popular programming language for the web

NativeScript has several building blocks, which are technologies you are likely to be familiar with, including business logic written with JavaScript, user interface structure written with XML, and user interface styling written with CSS.

Native, You Say?

So, you may be asking, how does your app, written with these technologies actually run on mobile devices? Between the code you write and the mobile device hardware, there is a NativeScript runtime. The NativeScript runtime sits between your app and the native platform. When your app runs, the NativeScript runtime intercepts your UI and styling code to render native UI controls on the fly (based upon the XML and CSS markup you created).

When your app needs access to hardware features (i.e., GPS or camera), the NativeScript runtime has a series of modules that interface with the hardware. Behind the scenes, the NativeScript runtime invokes native GPS or Camera code, on the fly.

The NativeScript runtime leverages a lightweight virtual machine running within your app to perform the JavaScript to native code translation and execution. On iOS it uses JavaSCriptCore, and the V8 engine on Android.

Virtual machines may seem a bit sketchy, but stop and think for a minute – we’re already doing this everywhere. Both Java and .NET are virtual machines that happen to run on your server, desktop, or laptop. With NativeScript, we’re simply running a different type of virtual machine on mobile devices.

Re-usability

Let’s have a reality check. How much of your code can you actually reuse and execute across platforms? The goal of NativeScript is to use a single code base. To use a single code base, when your app is built, the NativeScript runtime is packaged up into the app. Your code is also packaged alongside. A different runtime is packaged up with your code depending on the platform, but the same code you wrote is bundled. In essence, you have a single versions of JavaScript code across all your apps.

This works great for the business logic of your app, but what about your UI? For the UI, you have options. Some developers may want a separate UI for each platform, based upon the conventions of a platform – but that’s up to your discretion. With NativeScript, you have the ability to have a single UI or multiple – it’s your choice.

Getting Started

There are 2 ways to get started with NativeScript: via node package manager (npm) package and through the Telerik Platform. Let’s start with npm first. NativeScript is an open-source, free-to-use technology, available (by default) as an npm package. As a developer, you can get started with NativeScript by downloading the npm packages through the command line. After downloading, you have a NativeScript CLI (command line interface) available to build your apps across all of the platforms – Windows, Linux, and MacOS. When you’re ready, you use the CLI to get started, and then an editor of choice to write your code.

To start your projects using the CLI, use the following:

tns create project-name

Once the project has been created, you can add mobile platforms easily, which will add the necessayr platform to your project by scaffolding the project with all the files needed for development:

tns platform add ios

Finally, when you’ve finished adding your application business logic and view code, you can run the project in an emulator easily:

tns run ios --emulator

The CLI option is open source and free; however, you may not be comfortable with a CLI. As a result, Telerik also has an improved user interface you can use, called Telerik Platform. Telerik Platform comes in two flavors: Visual Studio Plugin and Web-Based Development Environment. Behind the scenes of both versions, the CLI is running – these simply give you an easier way to interface with the CLI.

Within Teleirk Platform, you have AppBuilder, which is a tool that lets you build, test, and deploy your app to devices. One of the advantages of using Platform is a feature called LiveSync, which allows you get a QR code for users to scan and share. When you scan the QR code, your mobile device contacts AppBuilder and syncs a live version of your app to the device immediately for testing.

Imagine your users are testing and identify a bug. When they contact you, you verify the bug, change the code to fix the bug, and save the updated code to AppBuilder. Once saved to AppBuilder, the users can double-tap their mobile app with three fingers to “sync” their app, downloading a live-updated version of the app without needed to go through the app stores.

This is an incredibly powerful tool that allows you to get instant feedback from your user, while helping to shorten your development lifecycle.

Where the Love for .NET?

If you’re a .NET developer, you may be asking, “What is there for me in NativeScript?” NativeScript is built on technologies you are likely already familiar with. For example, the XML UI markup used in NativeScript is similar to XAML. Additionally, building off of XAML, data binding in the UI is also very similar to XAML. Finally, if you’re from the .NET world, NativeScript’s integration with Visual Studio and Visual Studio Code is a nice additional – not to mention the capability to writing TypeScript instead of JavaScript.

Conclusion

I hope you’ve learned something today and are inspired to get started with mobile apps and checkout NativeScript!

As you can tell, I’m passionate about mobile and I’d love to talk more, so hit me up on Twitter or LinkedIn. I’d love to hear some of your ideas and how you’ve gotten started with mobile in your business, and what you think about NativeScript.

Thanks!