In the previous post, we have seen what is a NativeScript and Hybrid application. Why should we use NativeScript than building Hybrid applications?
In this post, we are going to set up our development environment for building mobile apps with NativeScript, Typescript, and Angular 2.
You can use Windows, Linux or Mac OS X to build Android apps.
However, if you want to build iOS apps, you'll need OS X, which means you'll need an iMac or MacBook.
I will be going through the setup of the development environment assuming you're using Windows. For Linux and Mac also you will have almost similar setup steps.
Cmder is a Linux or Mac Os terminal like console emulator on Windows. It spiced up with the Monokai color scheme and a custom prompt layout. Looking sexy from the start. It has many features like copy past shortcuts and multi-tabs support and so on.
You can install it from
Git is not only useful for code maintenance and version management but also to run few Linux commands on windows.
Download git from here.
Visual Studio Code
Visual Studio Code is a free, Cross Platform code editor by Microsoft. Visual Studio is a great tool for developing TypeScript based Applications. We all loved Sublime text and Atom editors. Luckily Visual Studio Code also has same Plugins and Extensions we have for Atom and Sublime Text. So, It's highly recommended editor for developing NativeScript applications.
Install it for free from here.
Once you install VS Code. You need to install few package to speed up your development.
press ctrl+p to open a command paddle.
ext install nativescript
ext install nativescript-xml-snippets
ext install nativescript-ng2-snippets
This Extinctions will superfast your application development.
Nowadays, everything depends on NodeJs. Even for NativeScript, we need NodeJS.
Install andy Node.js 0.10.x, 0.12.x, 4.x, or 5.x stable official release. Preferably 4.x (LTS).
When you install NodeJs. You will also have
npm in it.
Install node from here.
We need at least Android SDK 22 or a later stable official release. You can download either Android Studio or only SDK from here
Before installing Android Studio or SDK, you'll need to install the Java Development Kit (JDK) 8.
You must also have the following two environment variables setup for Android development:
Along with these installs Maven for Java dependency management.
you can download it from here
The problem with default Android Emulator is it is very slow! Instead of the default emulator we can install the Genymotion emulator. Besides being fast and free, it also has 20 preconfigured mobile devices to emulate. You'll have to create an account (free) to be able to download it.
Alternatively, you can also use this
batch script to install all required software and setup the Environment variables. Copy this code and save it as a
.bat file. Finally, Double-click on that file to run it. It will install all required software for you.
@powershell -NoProfile -ExecutionPolicy unrestricted -Command "iex ((new-object net.webclient).DownloadString('https://chocolatey.org/install.ps1'))" && SET PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin choco install jdk8 SETX JAVA_HOME "C:\Program Files\Java\jdk1.8.0_91\bin" /M choco install android-sdk SETX ANDROID_HOME C:\Program Files\Android\android-sdk" /M echo yes | "%ANDROID_HOME%\tools\android" update sdk --filter tools,platform-tools,android-23,build-tools-23.0.3,extra-android-m2repository,extra-google-m2repository,extra-android-support --all --no-ui
Finally, We have to install NativeScript cli. It contains all the commands to create a new application, run the application on your device or emulator, Watch files for changes and so on..
To install nativescirpt run this command on your console.
npm install -g nativescript
Now you should be able to run
both are same but will be using
tns through out the series.
In the next tutorial, we will see a few ES6/Typescript concepts.