Get Started Tutorial

About This Tutorial

The Intel® XDK is an integrated set of development tools for HTML5 app development. It eases the development of HTML5 apps for many platforms and stores, allowing developers to realize the HTML5 write-once, run-anywhere promise.

This 15- to 20-minute tutorial helps you get started with the Intel XDK by walking you through a typical end-to-end workflow you can ultimately apply to your own app development process.

After you complete this tutorial, you should be able to:

  • Create your new app and set app package options.

  • Preview app functionality on various virtual devices.

  • Edit your app files with the built-in Brackets* code editor.

  • Debug your app with the built-in Google Chrome* Developer Tools (CDT) debugger.

  • Evaluate how your app looks and performs on real physical hardware.

  • Package your app for submission to various app stores and/or for hosting on the web.

This tutorial covers a core set of Intel XDK features to help you learn the app development workflow. It does not cover web services, on-device debugging, performance profiling, Internet of Things (IoT) embedded apps, or HTML5 game development.

Prepare for the Tutorial and Access the Intel XDK

Requirements:

  • Intel XDK installed on a Linux*, Microsoft Windows*, or Apple OS X* development machine

  • App Preview installed on a test mobile device on which you want to run the result of this tutorial, such as a smart phone or tablet

Install the Intel XDK on Your Development Machine

If you do not already have access to the Intel XDK on your development machine, download it from http://xdk.intel.com.

Install App Preview on Your Test Mobile Device

App Preview lets you run Intel XDK project files on real physical hardware without performing a full build.

If you do not already have the App Preview tool installed on your test mobile device, download this free Intel app from the Apple* App Store, Google* Play Store, or Windows* Phone Store.

Access the Intel XDK

  1. Launch the Intel XDK on your development machine.

  2. If necessary:

    • Log in.

    • Sign up for an account. User Name = Your email address.

Start a New App from a Demo

A typical Intel XDK project corresponds to an app and provides a container for your project files and associated settings. There are three main project types:

  • Standard HTML5 - This project code base uses HTML5 and JavaScript* code, may use W3C* standard APIs, but does not support the use of Apache Cordova* APIs (aka Cordova* plug-ins). It can be deployed as a packaged hybrid mobile app on many platforms (Android*, Android Crosswalk*, Apple iOS* and Microsoft Windows 8*) or as a hosted web app for certain web- or OS-based platforms.

  • HTML5 + Cordova - This project code base uses HTML5 and JavaScript* code, and supports the use of Apache Cordova* APIs (via Cordova* plug-ins). It can be built and deployed as a packaged hybrid mobile app for Android*, Android Crosswalk*, Apple iOS*, and Windows 8* devices.

  • Internet of Things embedded apps (Intel® XDK IoT Edition only) - This project code base consists of embedded JavaScript* intended for execution on a Node.js runtime. This project type is only recognized by the Intel XDK IoT Edition. It requires an IoT maker board and is not built like mobile web apps for phones and tablets.

Let’s jump-start this tutorial using a working, HTML5+Cordova demo app as the base for your new app.

If:

  • This is your first project in the Intel XDK - The Intel XDK displays the START A NEW PROJECT palette in the PROJECTS tab and offers an opportunity to take a Quick Tour when project setup is complete.

  • You already have active projects in the Intel XDK - Click the PROJECTS tab drop-down arrow to display the YOUR INTEL® XDK PROJECTS dashboard. Then click the START A NEW PROJECT button to display the START A NEW PROJECT palette.

Get to Know the START A NEW PROJECT Palette on the PROJECTS Tab

START A NEW PROJECT palette on the PROJECTS tab

1

Templates - Use to build an app based on different types of app user interfaces. You can also choose a simple blank template to start with an essentially empty project.

2

Samples and Demos - Use to open a complete, working project to jump-start your own app, learn how HTML5 apps work, or learn how the Intel XDK works. (This is what we will do in this tutorial.)

3

Import Your HTML5 Code Base - Use to create an Intel XDK project by importing an existing HTML5 app, such as an app created using Adobe PhoneGap* or Apache Cordova* APIs, HTML5 APIs, Intel XDK device APIs, or the appMobi* XDK.

Choose the Hello World Demo App

  1. On the START A NEW PROJECT palette on the PROJECTS tab, expand the Samples and Demos option to display a General library of Standard HTML5 demos.

  2. Above the library area, click HTML5 + Cordova to display a General library of HTML5 + Cordova demos.

  3. Scroll to and click the Hello World demo image.

  4. Click the Continue button to start setting up your new project.

Create the XDKTutorial Project

  1. Name your project XDKTutorial, save it in C:\Users\[userid]\XDKTutorial, and click the Create button to create your project.

  2. On the Congratulations! dialog box, click the LET'S DO IT button to take a Quick Tour that provides a basic explanation of the Intel XDK UI.

  3. When the Quick Tour is complete, the Intel XDK displays the DEVELOP tab, which is where you perform most of your app development.

Preview Your App on Virtual Devices

Because we started from a demo, we can immediately preview the XDKTutorial app in browsers, on real devices, or on virtual devices using the LIVE DEVELOPMENT TASKS palette in the DEVELOP tab.

  1. In the LIVE DEVELOPMENT TASKS palette in the DEVELOP tab, click Live Layout Editing to display preview options similar to the following.
    LIVE DEVELOPMENT TASKS palette
  2. Click Run My App to display preview options similar to the following.
    LIVE DEVELOPMENT TASKS palette
  3. Click the Run in Emulator icon Run in Emulator icon to display an Intel XDK Emulator floating window similar to the following.

Get to Know the Intel XDK Emulator Floating Window

EMULATE tab

1

Use the Intel XDK Emulator floating window to quickly identify and fix defects before you test your app on an actual mobile device. You can simulate app functionality on a variety of virtual devices using this device simulator based on the Apache Ripple* emulator. You can also launch a built-in version of the CDT debugger from this floating window to debug app functionality. (We will do this later in this tutorial.)

2

Use the toolbar buttons to reload your app source files and restart your app, launch the built-in debugger in another floating window, display and change emulator settings, and stop executing the app in the emulator.

3

Use the Auto zoom icon Auto Zoom icon to zoom the device visual representation to the maximum size that fully fits in the window, and the slider to manually resize the device visual representation.

4

Use the palettes in the accordion-style columns to configure various virtual devices that help you quickly determine how well your app works in different orientations and a variety of screen sizes and aspect ratios. You can open and close each palette, hide and show the columns, move columns, and move palettes within a column.

5

Use the device visual representation view and test your app.

Play with Your App, Virtual Device Skins, and Palettes

Try:

  • Running your XDKTutorial app - How can you possibly resist clicking the Beep! button?

  • Choosing a different virtual device - Click the DEVICES palette drop-down arrow and choose among the skins.

  • Changing virtual device orientation - Click the orientation icons in the DEVICES palette.

  • Opening and closing each palette - Click the palette header bar.

  • Hiding and showing each palette column - Click the Palette column control and Palette column control controls.

  • Moving a palette - Click and drag a palette header bar to move it up or down the palette column or to another column.

More Handy Information

  • The emulator is also accessible from the EMULATE tab.

  • The Intel XDK Emulator floating window is also accessible by clicking the Undock icon Undock icon at the top right corner of the EMULATE tab label.

  • The Undock icon Undock icon at the top right corner of the EMULATE tab label changes to a Dock icon Dock icon and the EMULATE tab is disabled when the Intel XDK Emulator floating window is displayed. To re-enable the EMULATE tab, either close the floating window or click the Dock icon Dock icon at the top right corner of the EMULATE tab label.

  • The emulator is actually a web app that runs inside a node webkit. Your app runs within an inner HTML frame.

  • The runtime engine rendering your HTML5 code in the emulator is based on the Chromium open source browser. This up-to-date web runtime engine may implement HTML5 features more correctly than the web runtime on a real mobile device, especially if that mobile device has an old OS version.

  • Previous versions of the Intel XDK or appMobi* software refer to appmobi.js in source files. Replace all mentions of appmobi.js with intelxdk.js.

  • The emulator does not support the use of *.mp3 audio files.

Edit Your App

Let’s add some functionality to your XDKTutorial app. If necessary, click the DEVELOP tab to display a window similar to the following.

Get to Know the DEVELOP Tab

DEVELOP tab

1

Use the DEVELOP tab to edit files and add files to your project. You can use the built-in code editor or your favorite code editor.

2

Use the file tree to view the files associated with the active project, including image files, and to choose a file for editing.

3

Use the menu options (or equivalent shortcut keys) to perform common code editor functions.

4

Use the code editor view to edit file contents. Context menus are also available.

5

Use the Intel XDK toolbar buttons (present on all tabs) to access Help information for the displayed tab and general Help information, start the Quick Tour, display and change Intel XDK settings, view recent Twitter Tweets* about the Intel XDK, and display and change account settings.

6

Use the LIVE DEVELOPMENT TASKS palette to preview your code in a browser, on a real mobile device, or on virtual devices. Notice the XDKTutorial app is still running in the Intel XDK Emulator floating window and is set to restart after you save your changes to project files. With Live Editing Layout, code changes appear immediately after you make your edits using the built-in code editor, or after you save project files using an external editor.

7

Use the WEB SERVICES palette to explore built-in third-party web service APIs (cloud services) as well as integrate other third-party web service APIs. This tutorial does not cover web services. See the Develop Overview for more information.

Use the Built-in Code Editor to Edit Your Code

  1. Use the built-in code editor to uncomment <script src="js/debug.js"></script> near line 10.

  2. Choose File > Save to save your edit and change the contents of the Intel XDK Emulator floating window.

More Handy Information

  • The built-in code editor is based on the Brackets* editor, so you can easily add Brackets* extensions (File > Extension Manager).

  • If you use a code editor external to the Intel XDK, you must click the Reload icon Reload App icon on the toolbar to update all files and restart your app when you return to the emulator.

  • If you create an app using the App Designer (Hello World demo files were not created with the App Designer), the Intel XDK offers the CODE and DESIGN views in the DEVELOP tab so you can switch back and forth between the built-in code editor and the drag-and-drop HTML5 layout editor:
    CODE / DESIGN buttons

  • The App Designer editor is available only when you are editing HTML5 files created with the editor.

  • The App Designer is a round-trip editor. For example, you can start creating your apps in the App Designer, switch to the code editor to view the code corresponding to your layout efforts, modify code in the code editor, then switch back to the App Designer to view those modifications – as long as you do not change the App Designer class=”uib*” tag labels (uib stands for user interface builder).

  • Any elements the App Designer does not recognize are still rendered in the DESIGN view; however, they are not editable in the DESIGN view.

Test Your App on Virtual Devices

Let’s check the result of your edits to your XDKTutorial app.

Test App Functionality

Caution: The processor on your development machine is probably faster than the processor on a real mobile device, so performance problems are typically not visible in the emulator.

  1. Notice there are two new buttons in your XDKTutorial app in the Intel XDK Emulator floating window: Good and Bad.

  2. Click the Good button. Notice the header changes to Hello Good!

  3. What do you think will happen when you click the Bad button? Try it. Not what you expected? Guess it is time to debug.

Use the Built-in CDT Debugger to Debug Your App

  1. Click the Launch debugger icon Launch Debugger icon on the Intel XDK Emulator toolbar to open a built-in version of the CDT debugger in a floating window.

  2. Click the Sources button to open a file.

  3. Press Ctrl+O and choose the debug.js file.

  4. Scroll down to near line 46 to display a window similar to the following.
    CDT window

There is the problem!

Correct App Code

Caution: Modifying code in the debugger window impacts future app behavior in the emulator; however it does not modify actual source code, so make your source code modifications in the DEVELOP tab.

  1. Close the Developer Tools floating window.

  2. If necessary, click the DEVELOP tab.

  3. In the file tree, open the www/js folder and choose the debug.js file.

  4. Scroll to near line 46 and comment out var breakDebugger = invalidVariable;>

  5. Choose File > Save.

Retest App Functionality

Now try clicking the Bad button in the Intel XDK Emulator floating window. Better? If not, click the the Reload icon Reload App icon on the toolbar and try again.

More Handy Information

  • What you are actually debugging is a simulation of a real mobile device using the Chromium desktop engine augmented with Cordova* and Intel XDK APIs. This simulation is designed to provide an idea of how your app will render on various devices and form factors. Some visual aspects of your app may render differently on real devices, especially if the real devices have an old OS version.

  • Using the built-in version of the CDT debugger, you can set breakpoints, single-step, display variables in your JavaScript* code, do full DOM debugging, and see the effects of CSS on the DOM. You also have access to the CDT JavaScript* console, where you can view your app console.log messages and interact with your app JavaScript* context by manually inspecting properties and executing methods.

Run Your App on a Real Mobile Device

Now that you are confident your XDKTutorial app works properly on virtual devices, it is time to run it on a real mobile device.

  1. Click the TEST tab.

  2. Click the I HAVE INSTALLED APP PREVIEW button - because you already did this, right? ;-)

  3. Your development machine displays a Please sync with our testing server message the first time you click the TEST tab for a project. Click the DISMISS button so we can first explore the TEST tab.

Get to Know the TEST Tab

Test tab

1

Use the TEST tab to evaluate - over the network - how your app looks and performs on real physical hardware without performing a full build.

2

Use the MOBILE button to test via a test server in the cloud. Advantages: Requires minimal setup; avoids potential firewall and network topography issues; you can pull your files down anytime from anywhere in the cloud.

Use the WIFI button to test via a local Wi-Fi network to which both your development machine and test mobile device are connected. Advantages: Usually faster once set up; does not consume mobile data; pulls files directly from your development machine.

3

Use the instructions as a refresher for testing via mobile or Wi-Fi, with or without the App Preview QR code reader.

4

Use the PUSH FILES button to push the most recent project files on your development machine to the test server in the cloud.

5

Use the QR code with the App Preview QR code reader (accessible from the camera icon) to launch your app on your test mobile device.

Tip: Alternatively, you can launch your app from the Server Apps list (MOBILE mode) or Local Apps list (WIFI mode) on the App Preview tool.

6

You can also remotely debug your app while it runs on real physical hardware using the TEST tab and the weinre* (which stands for web inspector remote) debug console. This tutorial does not cover on-device or remote debugging. See the Test Tab and Debug Tab for more information.

Update, Launch, and Test Your App on Real Physical Hardware

Step

On Your Development Machine

On Your Test Mobile Device

1.

Click the PUSH FILES button to push your XDKTutorial app to the test server in the cloud. The Uploading Bundle message disappears when the upload is complete.

 

2.

 

Make sure the test mobile device is connected to the Internet.

3.

 

Launch the App Preview tool. If necessary, log in with the same user name and password for the Intel XDK.

4.

 

Use the camera icon (top right) in the App Preview tool to scan the QR code on the TEST tab and display the test server URL for your XDKTutorial app.

5.

 

Choose OK in the launch confirmation dialog box to launch your XDKTutorial app.

6.

 

Beep away!

More Handy Information

  • App Preview keeps track of all the apps you upload to the test server.

  • What you are actually testing on the real physical hardware is your app loaded into a platform-specific container app that is representative of the native wrapper included with your app when you build your app.

  • Android* mobile devices: If you cannot access the Google* Play Store, click the Information icon Information icon to email the App Preview download to your mobile device or copy the App Preview download link to your clipboard.

Check Your App Package Options

Now that you are confident the XDKTutorial app works properly on a real mobile device, it is time to build your app. But let's check your app package options first. Click the PROJECTS tab to display a window similar to the following.

Get to Know the PROJECTS Tab

PROJECTS tab

1

Use the PROJECTS tab to manage projects and project information, including options to package your app for submission to app stores.

2

The YOUR INTEL® XDK PROJECTS dashboard lists all known Intel XDK projects on your development machine.

The Intel XDK operates on only one project at a time. The currently active project is always marked in the YOUR INTEL® XDK PROJECTS dashboard and is the project on which all other tabs operate.

3

All your project files are stored locally on your development machine.

The Source Directory is the root location of your sources, including the index.html file, which is the main entry point to your project. The Source Directory and the Project Path may or may not refer to the same directory location, but the root Source Directory must be at or below the Project Path.

4

NOTE: If you plan to build your app using Cordova* 2.x APIs instead of Cordova* 3.x APIs, specify package options in the BUILD tab instead of the PROJECTS tab.

Use CORDOVA 3.X HYBRID MOBILE APP SETTINGS to generate platform-specific intelxdk.conf.<platform>.xml configuration files when you upload your app to the build server for packaging. These configuration files are then stored in your project directory.

Plug-ins provide a way to extend your app JavaScript* APIs, resulting in a tighter integration between your app and mobile device software and hardware. Use PLUGINS AND PERMISSIONS to specify standard Cordova* 3.x plug-ins, featured and custom Cordova* plug-ins, Intel XDK plug-ins, additional third-party plug-ins, and platform-specific permissions in addition to permissions required by chosen plug-ins. Use BUILD SETTINGS to specify details typically needed by app stores. Use LAUNCH ICONS AND SPLASH SCREENS to choose orientation, icons, and splash screens. See the Projects Overview for more information.

Explore Your App Package Options

Take a moment to check out your app package options.

When you are ready to submit your own apps to various app stores, you will need to supply values, such as App ID, App Name, and App Description. The default values are sufficient for this tutorial.

More Handy Information

  • Each project has a <project-name>.xdk file in the root directory. This file does not contain any application code and is not required for your app to execute on a real mobile device.

  • Deleting a project from the project list does not delete the project files or directory from your development machine. You can later reopen your project and add it back to your project list using the OPEN AN INTEL® XDK PROJECT button on the YOUR INTEL® XDK PROJECTS dashboard on the PROJECTS tab.

  • The emulator notes the core Cordova* plug-ins chosen on the PROJECTS tab and presents to your app the APIs corresponding to those core Cordova* plug-ins when your app runs inside the emulator. The emulator presents to your app the complete set of APIs provided by the Intel XDK plug-ins, regardless of what is chosen on the PROJECTS tab.

  • At this time, only the BUILD tab makes use of third-party plug-ins specified in the PROJECTS tab.

Build Your App

It is time to build your app! Click the BUILD tab to display a window similar to the following.

Get to Know the BUILD Tab

BUILD tab

NOTE: If your app is a Standard HTML5 project type instead of an HTML5 + Cordova project type, the Build tab also includes a BUILD AS A WEB APP region.

1

Use the BUILD tab to:

  • Package your app and deploy it as locally installed hybrid mobile app, thereby enabling the use of the same distribution and monetization channels, as well as the same app download, installation, and launch experience as native mobile apps.

  • Create an HTML5 bundle you can submit to certain app stores (such as the Google Chrome* Web Store) or place (hosted) on web servers.

2

Use the PREVIOUS BUILDS palette to view (and refresh) a list of previous builds. You can also hide/show the entire PREVIOUS BUILDS palette.

3

Use CORDOVA 3.X HYBRID MOBILE APP PLATFORMS to create a native app package suitable for submission to app stores. Packages support Cordova* 3.x core APIs and selected plug-ins, and Intel XDK APIs. See the Projects Overview for more information.

Crosswalk is an HTML5 application runtime based on a variety of open source projects. The Intel XDK distribution of the Crosswalk runtime also supports many cutting-edge APIs under consideration for standardization by the W3C* organization. See Crosswalk Overview for more information.

4

Use LEGACY HYBRID MOBILE APP PLATFORMS to create a native app package suitable for submission to app stores. Packages support Cordova* 2.x APIs and Intel XDK APIs. See the Build Tab Overview for more information.

The Tizen* OS is an open source, standards-based, software platform for devices such as smart phones, tablets, netbooks, in-vehicle infotainment devices, and smart TVs. See the Build Tab Overview for more information.

Package Your App as a Mobile App for an Android* Store

  1. Click the Android BUILD button in the CORDOVA 3.X HYBRID MOBILE APP PLATFORMS region to connect to the build server, upload your XDKTutorial app to the cloud, and display a window similar to the following.
    BUILD tab

  2. Notice all packaging configuration has already been performed (in the PROJECTS tab); there is nothing preventing you from building your XDKTutorial app right now. Click the Build App Now button to build the XDKTutorial app as an Android* mobile app and ultimately display a window similar to the following.
    BUILD tab

    If the build fails, click the link to review a more detailed build log.

    The Intel XDK does not provide actual store submission services for your app; however, it does explain a variety of possible next steps (which we obviously will not perform for this XDKTutorial app).

  3. Click the Close Build Page button.

More Handy Information

  • Builds are performed in the cloud, so you do not need to install and configure an SDK or native development system for each target platform (as you must do if you are building a Cordova*/PhoneGap* app).

  • You must obtain the proper developer credentials to submit apps to most app stores.

  • With the exception of Crosswalk for Android* packages, all packages use the built-in webview (embedded browser) that is part of the target mobile device firmware to execute (render) your app. For example, Android* packages use the Android* browser webview built into the Android* mobile device, and iOS* packages use the Apple Safari* browser webview built into the iOS* mobile device.

Intel XDK: Tutorial Summary

This tutorial walked you through how to get started with the Intel XDK.

Step

Tutorial Recap

Key Tutorial Take-aways

Prepare for the tutorial and access the Intel XDK

Launch the Intel XDK. If necessary, sign up for an account.

User Name = your email address.

Start a new app from a demo

Open the START A NEW PROJECT palette in the PROJECTS tab. Choose the Samples and Demos option. Choose the HTML5 + Cordova project type. Choose the Hello World demo app as the base for your XDKTutorial app. Set up the XDKTutorial project.

An Intel XDK project corresponds to an app and provides a container for your project files and associated settings. There are three main project types: Standard HTML5, HTML5 + Cordova, and Internet of Things embedded apps (Intel® XDK IoT Edition only). You can create apps by starting from a template (including a blank template), starting from sample or demo code, or importing an HTML project.

Preview your app on virtual devices

Open the LIVE DEVELOPMENT TASKS palette in the DEVELOP tab. Choose Run in Emulator to display the Intel XDK Emulator floating window. Play with your XDKTutorial app, the virtual device skins, and the palettes.

Use the LIVE DEVELOPMENT TASKS palette to preview your code in browsers, on real mobile devices, or on virtual devices. An emulator based on the Apache Ripple* emulator is accessible from several places in the Intel XDK. Use it to simulate app functionality on a variety of virtual devices.

Edit your app

Return to the DEVELOP tab. Use the built-in code editor to edit XDKTutorial app code.

You can edit project files with the built-in code editor based on the Brackets* editor, or your favorite code editor (even while the Intel XDK is open). If you preview your code while you develop using LIVE DEVELOPMENT TASKS/Run My App, code changes appear after you save your edits. If you preview using LIVE DEVELOPMENT TASKS/Live Editing Layout, code changes appear immediately after you make your edits using the built-in code editor, or after you save project files using an external editor.If you create your app using the App Designer, you can also edit project HTML5 files in a drag-and-drop UI DESIGN view – and switch between the CODE and DESIGN views at any time.

Test your app on virtual devices

Test XDKTutorial app functionality in the emulator. Use the built-in CDT debugger to debug the XDKTutorial app. Return to the DEVELOP tab to correct XDKTutorial app code. Return to the emulator to retest XDKTutorial app functionality.

The processor on your development machine is probably faster than the processor on a real mobile device, so performance problems are typically not visible in the emulator. If you use an editor external to the Intel XDK, click the Reload icon on the emulator toolbar to reload your app source files and restart your app when you return to the emulator. Use the Debug icon on the emulator toolbar to access the built-in CDT debugger. Modifying code in the debugger window impacts future app behavior in the emulator; however it does not modify actual source code. Edit the actual source code in the DEVELOP tab. The emulator is designed to provide a general idea of how your app will render on various mobile devices; always run your app on a real mobile device before building.

Run your app on a real mobile device

On your development machine: Open the TEST tab; push your XDKTutorial app to a test server in the cloud. On a test mobile device: Launch the App Preview tool; scan the QR code on the TEST tab; test the XDKTutorial app.

Use the Intel XDK on your development machine and the App Preview tool on your test mobile device to evaluate – over the network – how your app looks and performs on real physical hardware without performing a full build. You can test your app via a test server in the cloud or via a local Wi-Fi network to which both your development machine and test mobile device are connected.

Check your app package options

Explore the PROJECTS tab.

All your project files are stored locally on your development machine. Each project has a <project-name>.xdk file in the root directory. The main entry point to your project must be an index.html file in the root source directory. All other files must reside in a set of folders below the root directory. Plug-ins provide a way to extend your app JavaScript* APIs, resulting in a tighter integration between your app and mobile device software and hardware. Use PLUGINS AND PERMISSIONS to specify standard Cordova* 3.x plug-ins, featured and custom Cordova* plug-ins, Intel XDK plug-ins, additional third-party plug-ins, and platform-specific permissions in addition to permissions required by chosen plug-ins. Use BUILD SETTINGS to specify details typically needed by app stores. Use LAUNCH ICONS AND SPLASH SCREENS to choose orientation, icons, and splash screens.

Build your app

Open the BUILD tab. Package your XDKTutorial app as a Cordova* 3.x hybrid mobile app for an Android* store.

Use the Intel XDK to package your app for submission to various app stores and/or for hosting on the web. Builds are performed in the cloud, so you do not need to install and configure an SDK or native development system for each target platform. Legacy Cordova* 2.x build package options and web app build package options appear in the BUILD tab, while Cordova* 3.x build package options appear in the PROJECTS tab. The Intel XDK does not provide actual store submission services.

Next step: Apply this knowledge to use the Intel XDK to code, debug, test, and build your own HTML5 apps.

Key Terms

The following terms are used throughout the Intel XDK tutorial:

  • mobile app: App that executes on a real mobile device. It interacts with users and onboard sensors.

  • onboard sensor: Built-in sensor available on a real mobile device, such as an accelerometer, geo location, and similar features.

  • plug-in: JavaScript* API plus native code modules that support the JavaScript* API. In essence, when your app calls the plug-in's JavaScript* API, it is redirected to the underlying plug-in native code that implements that API on the device.

  • real device: Actual, physical hardware, such as a smart phone or tablet.

  • virtual device: Software environment that simulates a real mobile device. It is convenient for testing how an app will look and function on actual, physical hardware.

  • web app: App that executes on a web server. To use this type of app, a mobile device uses a web browser and Internet access.

More Resources

For more information about the Intel XDK and HTML5 development, access the Intel® Developer Zone:


Para obter mais informações sobre otimizações de compiladores, consulte Aviso sobre otimizações.