Quick Start Guide

This guide will help you create the foundation of a Tabris.js app and test it on a mobile device.

:point_right: If you want to test a code snippet on your mobile device without creating an app on your development machine, check out the Tabris.js Playground first.

Set up a mobile device

All you need is an Android or iOS device, connected to the same network as your development machine. Install the Tabris.js 3 Developer App. Start the app and (optional) log in with your GitHub account.

Set up your development machine

On your development machine, the following software needs to be installed:

  • Node.js (installation guide). You need a version >= 6.0 (type node -v to check your node version).
  • Tabris CLI (type npm install -g tabris-cli).
  • A text editor or JavaScript IDE of your choice.

Create your first app

Create a new empty directory for your project, open a terminal in this directory and type tabris init. The Tabris CLI will ask you a number of questions including the project’s name and version and the type of project to create: a JavaScript App or a TypeScript App.

:point_right: TypeScript projects are more complex, but also provide type safety, better tooling and out-of-the-box declarative UI using JSX. It’s especially recommendable for experienced developers coming from Java or C#.

The CLI will then create a simple example project and install the required dependencies. Let’s have a look at the most important files:

  • package.json: This is the central manifest file of your project. It includes your app’s name and version, dependencies, and a pointer to the app’s main module in the main field. For the details, see the npm doc on package.json.
  • src/app.js, src/app.jsx or src/app.tsx: That’s your app’s main JS/TypeScript file. You are free to change its name and location, but you have to adjust the main field in the package.json.
  • cordova/config.xml: This is the Cordova configuration file. You won’t need this file until you build your app (see build documentation).

Of course, you can also set up your projects manually. At the very least, you need a package.json with a dependency to tabris and a main JavaScript file. If you setup your project manually, you’ll have to run npm install in this directory to install the tabris module.

Run the app

In the project directory, type tabris serve. This will start a server at a free port and print its URL to the console, e.g. http://<your-ip-address>:8080/. Keep the server running as long as you are testing your app.

In the Developer App, go to the URL tab, enter the URL printed by the CLI and tap Connect. The Developer App will now download the source code and execute it on your mobile device.

Swipe from the right edge of the screen to open the developer console, which lets you restart the script or go back to the Developer App.

Now you can start developing. You may want to have a look at the rest of the documentation and the Tabris.js snippets.

Publishing your app

For submission to the App / Play Stores you will need to bundle, brand and build your app, either using the free online build service (on tabrisjs.com) or using a local build. This process is explained in Build your app.

Feedback

Help us improve Tabris.js! Feedback is always welcome. Feel free to invite your friends if you find Tabris.js interesting.

Tabris.js on Twitter EclipseSource on LinkedIn EclipseSource on Google+ EclipseSource on Facebook