O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Getting Started with NativeScript

Book Description

Explore the possibility of building truly native, cross-platform mobile applications using your JavaScript skill—NativeScript!

About This Book

  • Save your marketing time by building for iOS, Android, and Windows Mobile platforms simultaneously
  • Be an ace at utilizing the features of NativeScript and its ability to communicate with each of the host device libraries natively
  • Proficiently, build your fully cross-platform communication application exhibiting the fundamentals of NativeScript

Who This Book Is For

If you are a JavaScript developer and want to build cross-platform applications, then this book is just the right one for you!

What You Will Learn

  • Install and compile your application in NativeScript
  • Get important know-how on the NativeScript project structure
  • Develop and style your screens for multiple platforms
  • Create a full-featured cross-platform communication application
  • Import and use several third-party components
  • Simplify and deal with device resolution and cross-platform issues
  • Test and deploy your application

In Detail

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.

Style and approach

A stepwise guide for building cross-platform mobile applications with the help of easy-to-understand examples.

Downloading the example code for this book. You can download the example code files for all Packt books you have purchased from your account at http://www.PacktPub.com. If you purchased this book elsewhere, you can visit http://www.PacktPub.com/support and register to have the code file.

Table of Contents

  1. Getting Started with NativeScript
    1. Table of Contents
    2. Getting Started with NativeScript
    3. Credits
    4. Foreword
    5. About the Author
    6. About the Reviewer
    7. www.PacktPub.com
      1. Support files, eBooks, discount offers, and more
        1. Why subscribe?
        2. Free access for Packt account holders
    8. Preface
      1. What this book covers
      2. What you need for this book
      3. Who this book is for
      4. Conventions
      5. Reader feedback
      6. Customer support
        1. Downloading the example code
        2. Errata
        3. Piracy
        4. Questions
    9. 1. Introduction to NativeScript
      1. NativeScript
        1. Telerik's NativeScript
        2. Other competitors
        3. NativeScript uniqueness
        4. NativeScript is easy
      2. NativeScript and TypeScript
        1. What is TypeScript?
        2. TypeScript's use in NativeScript
        3. Choosing a development language
        4. Common modules
      3. Installing NativeScript
        1. Prerequisites
          1. node.js
          2. iOS
          3. Android
        2. Installation
          1. Installation help
      4. The NativeScript command line
        1. NativeScript commands
      5. Creating your first application
        1. Creating the application in easy steps
        2. Running the app
      6. Summary
    10. 2. The Project Structure
      1. Project directory overview
        1. The root folder
        2. The app folder
        3. The lib folder
        4. The hooks folder
        5. The node_modules folder
          1. The tns-core-modules folder
        6. The platforms folder
          1. The platforms/android folder
            1. Bad resource files on Android
            2. Compiled Android application location
          2. The platforms/iOS folder
      2. The app folder
        1. The .gradle folder
        2. The App_Resources folder
        3. The fonts folder
        4. The app folder files
          1. The package.json file
          2. License
          3. App.js
        5. App.css
        6. Application page
          1. The main-page.js file
          2. The main-page.css file
          3. The main-page.xml file
          4. The main-view-model.js file
            1. Our rewrite of the main-view-model.js file
      3. Foundational components
        1. Application component
        2. Frame component
        3. Page component
      4. Creating a second page
        1. Creating additional files and pages
          1. Creating settings.js
          2. Navigating to another page
          3. Running the application
          4. Viewing our screen
      5. Summary
    11. 3. Declarative UI, Styling, and Events
      1. Declarative UI
        1. XML parser
        2. Page, StackLayout, label, and more
          1. <Page ...> node
          2. <StackLayout ...> node
          3. <Label ...> node
            1. FormattedString component
            2. Complex properties
          4. <Button ...> node
          5. Second <Label...> node
        3. Declarative UI and components
        4. Visual components
      2. Using the Declarative UI for our settings page
        1. Our settings.xml file
      3. Binding and event system
      4. Event system
      5. Binding
      6. Styling the UI
        1. What is CSS?
        2. Why use CSS?
        3. How to use CSS
        4. Configuring your CSS Rules
        5. Existing CSS properties
        6. Exploring app.css
      7. Trying CSS out and styling our application
        1. Styling on your own
      8. Summary
    12. 4. Building a Featured Application
      1. Layouts
        1. StackLayout
        2. WrapLayout
        3. AbsoluteLayout
        4. DockLayout
        5. GridLayout
      2. Building our featured application
        1. Nonvisual components
        2. Dialogs
          1. Alert dialog
          2. Confirm dialog
          3. Prompt dialog
          4. Login dialog
          5. Action dialog
        3. Promises
        4. The settings screen Declarative UI
          1. GridLayouts
      3. Building the main screen
        1. JavaScript code
        2. Declarative UI
          1. Main page Declarative UI
          2. Main page body
          3. ScrollViews
          4. More about bindings
          5. Repeaters
          6. Main-body footer
        3. The main-page.css file
        4. Application CSS
      4. Fonts
      5. Icons
      6. Communication with the server
      7. Trying out our application
        1. The server
          1. Setting up your own server
        2. Trying crossCommunicator out.
      8. Summary
    13. 5. Installing Third-Party Components
      1. Places to find third-party components
        1. The Telerik plugin site
        2. npmjs.com
        3. The NativeScript unofficial plugin list
      2. How to install a third-party plugin component
        1. Installing the vibration plugin
        2. Installing the webSockets plugin
        3. Installing the Telerik SideDrawer plugin
      3. Using third-party components
        1. Using the vibration plugin
        2. Using Websockets
        3. Using Telerik's side drawer
        4. Easily using the components
        5. Useful third-party components
      4. Summary
    14. 6. Platform Differences
      1. Android and iOS differences
        1. The soft keyboard
        2. The Page.loaded event
      2. Code differences
      3. Platform classes
      4. Declarative UI
        1. Declarative UI properties
        2. Declarative UI platform qualifiers
      5. Platform- and device-specific files
      6. Screen size differences
        1. Fonts
        2. Our own custom resource folders
        3. Compiled application resources on iOS
        4. Compiled application resources on Android
      7. Device differences
      8. Summary
    15. 7. Testing and Deploying Your App
      1. Testing your application
      2. Test frameworks
      3. Local testing of your code
      4. Unit testing on the device
        1. Installing the test framework
        2. Writing tests
        3. Running tests
      5. Testing your app on a device or emulator
      6. Understanding the call stack
        1. Android call stack
        2. iOS call stack
      7. Debugging your application
      8. Publishing your application
        1. Publishing to iOS
      9. Summary
    16. Index