{"id":62,"date":"2015-05-27T22:59:28","date_gmt":"2015-05-27T22:59:28","guid":{"rendered":"http:\/\/fluentreports.com\/blog\/?p=62"},"modified":"2015-05-27T22:59:28","modified_gmt":"2015-05-27T22:59:28","slug":"nativescript-the-new-awesome-way-to-build-android-ios-applications","status":"publish","type":"post","link":"https:\/\/fluentreports.com\/blog\/?p=62","title":{"rendered":"NativeScript -> The new Awesome way to build Android, &#038; IOS applications"},"content":{"rendered":"<p>I've been developing applications for a wide variety of platforms (you name it, I've probably touched it) . \u00a0 Over my long career in computer development and devops, this includes a lot of mobile apps.\u00a0\u00a0\u00a0 I've done hybrid apps in Phonegap\/Cordova.\u00a0\u00a0 I've done pure native apps on the Android; and I've done apps on a Nokia Maemo\/Meego, I've even done apps on old Windows Mobile 6.\u00a0\u00a0 So I've had some experience with a lot of mobile platforms.<\/p>\n<p>So, I now have this brand new application that I have decided to write; and of course the majority of my early beta adopters will be on IOS; but the majority of my customers I believe will be on Android.\u00a0 Which means, I need cross platform from the beginning.\u00a0\u00a0\u00a0\u00a0\u00a0 I then spent several weeks evaluating several newer &amp; and re-evaluating several older cross platform systems to try and decide which one to use to tackle this project in. \u00a0 \u00a0 \u00a0\u00a0 After most my research was done, I had narrowed it down to pretty much React Native. \u00a0\u00a0 Unfortunately, React Native does not have any Android bindings yet.\u00a0\u00a0\u00a0 So, I continue looking around and while looking at <a href=\"http:\/\/www.telerik.com\/\" target=\"_blank\">Telerik's<\/a> offerings, I saw a link about this all new cross platform project called <a href=\"http:\/\/nativescript.org\/\" target=\"_blank\">NativeScript<\/a>. \u00a0 Figured, might as well and so I installed what was the first public release v0.9 and ...\u00a0 <strong>fell in love with it.<\/strong><\/p>\n<p>I <strong>LOVE<\/strong> that it is totally cross platform for both Dev and Deployment, it runs on <strong>Mac, Linux<\/strong> and <strong>Windows <\/strong>out of the box.\u00a0\u00a0 And It already supports deployment to both <strong>IOS<\/strong> and <strong>Android,<\/strong> with <strong>Windows Phone<\/strong> bindings coming some time in the future.\u00a0 Being so new it is missing a lot of things that other platforms might already have; but overall it is surprisingly feature complete.<\/p>\n<p>I <strong>LOVE<\/strong> that it has a common library and a common screen building language that works on all the platforms; BUT it has the ability to customize them several different ways for the platform your are targeting in the event you need to make customizations per-platform. Example:<br \/>\n<pre>&lt;span class=&quot;blob-code-inner&quot;&gt;&lt;span class=&quot;pl-s&quot;&gt;&amp;lt;Page&amp;gt;&amp;lt;TextField ios:editable=&#039;False&#039; android:editable=&#039;True&#039; \/&amp;gt;&amp;lt;\/Page&amp;gt;&lt;\/span&gt;&lt;\/span&gt;<\/pre><br \/>\nAs you can see, I can put in a <strong>ios:<\/strong> or <strong>android:<\/strong> prefix and have customizations for values per platform.\u00a0\u00a0 I can also have a <strong>file.android.xml<\/strong> and\/or <strong>file.ios.js<\/strong> to make specific versions of a screen or js file per platform (there are also other valid variations for screen size\/dpi).<\/p>\n<p>I <strong>LOVE <\/strong>that I am not having to create a THUNK layer anytime I want to talk to any Android or IOS api.\u00a0\u00a0 NativeScript allows me to call Java code (on Android) and X Code (on IOS) functions from inside JavaScript.\u00a0 Example for Android: (<a href=\"http:\/\/docs.oracle.com\/javase\/7\/docs\/api\/java\/io\/File.html#exists%28%29\" target=\"_blank\">Java Documentaton<\/a>)<br \/>\n<pre>var path = &#039;\/tmp\/test.data&#039;;\nvar javaFile = new java.io.File(path);\nif (!javaFile.exists()) {\n&nbsp;&nbsp;console.log(&quot;File Exists&quot;);\n} else {\n&nbsp;&nbsp;console.log(&quot;File Does Not exist&quot;);\n}<\/pre><br \/>\nDo you see what I did their -- I called a native android java constructor: <em>new java.io.File(&lt;passed in a Javascript variable&gt;);<\/em><\/p>\n<p>I don't need to create a custom function on the android side for each time I need to do something in Android native land.\u00a0 Then compile that with either the SDK or NDK and then use some sort of thunking\/message layer to call it. \u00a0\u00a0 I can now CALL any native Java code right from my JavaScript and use the Variables and Functions as is. \u00a0\u00a0 (Same applies to the IOS layer)<\/p>\n<p>Now the really awesome news is the entire NativeScript stack is open source.\u00a0\u00a0 You can download any of the pieces from github and build, create, add issues, create pull requests on any of the pieces you need to build a NativeScript IOS or Android application.<\/p>\n<p>1. <a href=\"https:\/\/github.com\/NativeScript\/NativeScript\" target=\"_blank\">Cross Platform Library<\/a> - This is the common library so I can do things like\u00a0 <em>var fs = require('file-system'); if (fs.exists('blah'))...\u00a0 --<\/em> this code has the common and has the device specific modules so it works for every platform.<br \/>\n2. <a href=\"https:\/\/github.com\/NativeScript\/android-runtime\" target=\"_blank\">Android-Runtime<\/a> - This is the code that has the JavaScript v8 engine on the Android Platform<br \/>\n3. <a href=\"https:\/\/github.com\/NativeScript\/ios-runtime\">IOS-Runtime<\/a> - This is the code that runs the JavaScript Core engine on the IOS platform.<br \/>\n4. <a href=\"https:\/\/github.com\/NativeScript\/android-metadata-generator\" target=\"_blank\">Android-metadata-generator<\/a> - this is what creates the JavaScript bindings to the native Android Java.<br \/>\n5. <a href=\"https:\/\/github.com\/NativeScript\/ios-metadata-generator\" target=\"_blank\">IOS-Metadata-Generator<\/a> - this is what creates the JavaScript bindings to the native IOS platform Objective-C.<br \/>\n6. <a href=\"https:\/\/github.com\/NativeScript\/nativescript-cli\" target=\"_blank\">NativeScript Command Line Interface<\/a> - This is what you use to build, deploy, test your application.<\/p>\n<p>Now if all you are interested in building apps; you really don't have to worry about the above repos; you just need to follow the basic install instructions for your platform at <a href=\"http:\/\/nativescript.org\">nativescript.org<\/a>.<\/p>\n<p>If you use VMWare or VirtualBox\u00a0 or Vagrant see my next post which I will link here shortly.<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>I've been developing applications for a wide variety of platforms (you name it, I've probably touched it) . \u00a0 Over my long career in computer development and devops, this includes a lot of mobile apps.\u00a0\u00a0\u00a0 I've done hybrid apps in Phonegap\/Cordova.\u00a0\u00a0 I've done pure native apps on the Android; and I've done apps on a&hellip; <a class=\"more-link\" href=\"https:\/\/fluentreports.com\/blog\/?p=62\">Continue reading <span class=\"screen-reader-text\">NativeScript -> The new Awesome way to build Android, &#038; IOS applications<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,15],"tags":[],"class_list":["post-62","post","type-post","status-publish","format-standard","hentry","category-javascript","category-nativescript","entry"],"_links":{"self":[{"href":"https:\/\/fluentreports.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/62","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fluentreports.com\/blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fluentreports.com\/blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fluentreports.com\/blog\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fluentreports.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=62"}],"version-history":[{"count":4,"href":"https:\/\/fluentreports.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/62\/revisions"}],"predecessor-version":[{"id":66,"href":"https:\/\/fluentreports.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/62\/revisions\/66"}],"wp:attachment":[{"href":"https:\/\/fluentreports.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=62"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fluentreports.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=62"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fluentreports.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=62"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}