Programming, Vue.js

First Impressions

Having been familiar with HTML and XML layouts building layouts was easy. Styling the layouts feels similar to designing a web app, but not completely the same. Some CSS selectors and HTML attributes aren’t allowed or don’t work the same as you would expect while building a web app. The documentation was mostly helpful, I got hung up on something that wasn’t documented well in my first app. Overall there’s a sense that NativeScript is new and that’s because it is, but I still enjoyed the experience building out the app.


The NativeScript slack channel was immensely helpful when I ran into an issue that wasn’t thoroughly documented and confusing. Someone else happened to experience something similar. The end result was a PR was sent and merged so others wouldn’t run into the same issue.

XML Layout

Building out the layouts uses XML to build the layout. It’s similar enough to HTML that most won’t have issues. I use PhpStorm and added a NativeScript plugin to help autocomplete some items. Without the plugin it would be difficult to determine which properties I could use on XML elements. For example many elements can have a backgroundColor attribute on it which can be confusing to remember because people used to HTML/CSS use background-color is the attribute.

Some of the layouts can get confusing on which can be used inside each other and which cannot or which layouts play well together. The GridLayout can get complex fast, but can be super useful if you need things positioned a certain way.


If you’re used to Vue this will feel very similar. You will feel at home.

Vuex is supported which is a huge plus for storing state and you can use it as expected. At the time of writing it’s not possible to use the Vue Router due to an unresolved issue.


NativeScript has what they call a playground. It’s a web IDE that you scan an image on your phone and can preview the app built in the browser on your phone. It’s super handy for messing around or if you have problems. If you’re able to recreate the problem in the playground then it’s much easier to ask for help.

Also supported is Vue’s debugging tool Vue DevTools. This allows you inspect values in Vuex, events, and components.


While evaluating options for creating native mobile experience with Vue there are few options. All of which are relatively new and developing including NativeScript. Some of the options are Vue Native and Weex.

Final Thoughts

Although I hit a few snags, I will use NativeScript Vue again in future projects due to the community, docs, and integration with Vue.