Introduction to NativeScript

NativeScript provides a set of tools and frameworks for developing apps for various mobile platforms. NativeScript’s motto is “Write Once, Run Everywhere”, which essentially means that any app you write/code in NativeScript, can be deployed as a native iOS, Android and (soon) Windows 10 app; all using the same, single code base which you can create using XML, CSS and JavaScript.

 

In this blog we’ll take a look at some of the key features of NativeScript and how those can help you create cross platform, native apps while saving both time and cost.

 

Open Source

NativeScript was created by and is also supported by Telerik. Its core is licensed under the Apache 2.0 software license. It’s an open source development platform, so it’s free to use. And since its open source, you can inspect, pull, fork and change the source of NativeScript as you like; there’s no restrictions on the changes you can make in NativeScript’s source code.

 

Native UI

NativeScript enables you to create a native UI for each platform you want to deploy your app on. You can either define the app’s UI once and use NativeScript’s ‘adapt to run everywhere’ feature to utilize the same UI across multiple platforms (iOS, Android, etc.), or you can tailor your app’s UI to specific devices and screens. Since NativeScript renders app UIs with the native platform’s rendering engine (it does not use WebViews), it enable you to create cross platform apps that have native app like performance and user experience.

 

CSS Styling

Although NativeScript enables you to render native app UIs, you are free to use CSS to style the app’s UI as you like. NativeScript also supports a subset of CSS properties that help do exactly that. Each VIEW instance exposes a style property (which holds all the style properties for that view) that you can modify as per your requirements. You can even use SASS and LESS in your app.

 

Responsive UI

With NativeScript you can create apps with Responsive UIs that adapt to the devices and screen sizes they’re being used on. This basically mean that the app’s layout changes based on the size and capabilities of the device you’re using it on. NativeScript provides several types of Responsive layouts that you can use, like DockLayout, GridLayout and StackLayout.

 

Data Binding

In NativeScript apps, you can bind UI elements to a data object. So that any changes made in the data object by the code, are automatically reflected in the UI and any changes made in the UI by user, are propagated back to the code. NativeScript supports both one-way and two-way data binding. The default binding method used is one-way data binding though.

 

JavaScript Support

In NativeScript apps, you can simply use JavaScript to write the business logic. So there’s no need to learn a different language for each platform. Each NativeScript app has an embedded JavaScript engine that executes the app logic. NativeScript uses V8 for Android and JavaScriptCore for iOS apps.

 

Native API access

With NativeScript apps, you don’t need to use Objective C or Java, in order to to utilize native APIs in your app. You can access all APIs in pure JavaScript, since NativeScript uses JavaScript engine APIs to build a bridge between JavaScript and native worlds (I’ll talk about this in more detail in my next blog). Thanks to this native API access, you can also use existing native libraries in your app.

 

TypeScript Support

NativeScript also offers extensive support for TypeScript. The NativeScript framework itself has been developed using TypeScript. TypeScript is basically a typed superset of JavaScript that compiles to plain JavaScript. As such it is particularly useful to developers with Object Oriented development backgrounds, who find easier to work with NativeScript thanks to this feature.

 

Angular 2 Support

NativeScript supports deep integration with Angular 2. And although you don’t need to use Angular 2 in your NativeScript app, you’ll find that you build better apps, if you do use Angular 2. Since by using Angular 2, you can reuse skills and code from the web to build beautiful, high performance native mobile apps.

 

LiveSync/Hot Reload

NativeScript also supports Live Sync. So for example, if you are debugging an app in a simulator or on a device and you make some changes to the app’s code, NativeScript will apply those changes to the app without the need for re-compiling, redeploying and restarting the app.

 

NativeScript CLI

In addition to the above features, NativeScript also provides a command line tool that you can use to perform common project related tasks, for example bootstrapping a new project, adding / removing platforms or running / building your app etc.

 

Supported IDEs

NativeScript even provides an extension for Visual Studio code which you can leverage to use features like intellisense, interactive debugging and integration with device emulators.