Book Image

Getting Started with NativeScript

By : Nathanael J. Anderson
Book Image

Getting Started with NativeScript

By: Nathanael J. Anderson

Overview of this book

NativeScript allows you to build a fast cross-platform application that has a native UI. NativeScript is a true cross-platform framework that generates native speed applications using the native components of the host platform, all using JavaScript. Although NativeScript allows you to build your application in JavaScript, you have full access to the host OS from your code, allowing you to easily tweak or use new platform features instantly at native code speeds. Whether you have already developed multiple applications or zero applications, this book will help you to develop your next application in a cross-platform framework quickly, saving you a massive amount of time and money. This book concisely shows you NativeScript’s built-in framework that allows you to rapidly develop a fully-working compiled cross-platform application in just a few chapters. It starts by laying the foundation of NativeScript and working through the fundamentals to create a basic shell of the application. Moving on, you’ll see how to build a full-fledged application step by step. We’ll show you how to use plugins, and how to communicate with the native OS libraries easily so that you can customize your application as if your app was created in Java or Objective C. We then deal with the issues that arise from being cross platform and compensate for the different screen sizes, screen resolutions, and device abilities. Finally, we progress to testing and deploying your app.
Table of Contents (15 chapters)
Getting Started with NativeScript
About the Author
About the Reviewer

Creating your first application

I am going to walk you through how to create an application as it currently requires a couple steps that you need to do from a terminal shell. Then, we will show you how it looks.

Creating the application in easy steps

Creating a project is actually a fairly simple process; we are going to start by creating the application we will develop throughout this book.

  1. Make sure you are at a terminal shell and then type:

    nativescript create crossCommunicator
  2. This will create crossCommunicator as a subdirectory of the current directory you are running the nativescript command in. This new project directory will have all the required files for developing your project.

  3. Next, you will need to switch to that new crossCommunicator directory that it created for you by typing:

    cd crossCommunicator
  4. Then, type:

    nativescript platform add android


    nativescript platform add ios
  5. To add each of the target environment(s), you will be compiling your app from this machine:

If everything worked properly, you should see something like the preceding image results.

Now, I personally do all my development on the Windows platform using JetBrain's wonderful cross-platform PHPStorm development environment. You are free to use any JavaScript editor you are comfortable with. Since I am using the Windows platform, I do the majority of my testing and debugging on the Android platform and emulator. The Android emulator is basically a full Android in your computer, so it behaves like an actual device. However, since I am also targeting iOS, every so often I also copy or sync the code from my Windows app folder to a Macintosh and then verify that everything looks good and works as expected on the iOS emulator and eventually an iOS device. The very first time when I copy my code over to a Macintosh, I use the nativescript platform add ios command as I need to add the iOS target on the Macintosh.


First time requirements

The very first time you create a project or add a platform, you do need an active Internet connection so the nativescript tool can download the current version of the runtime and platform libraries that it uses. In any future executions, it will first try to download the newest version, but if it fails, it will then use the currently cached version.

Running the app

With those simple steps, NativeScript creates a framework for an application that you can already run on your mobile device. Now, to run the project, we execute:

nativescript run android --emulator


nativescript run ios –-emulator

NativeScript will then copy your application to the emulator, automatically start it up, and then you should see your first application running on the emulator screen like this: