Create an Apache Cordova App

There are many, many components of an Apache Cordova cross-platform application. This includes more than nine dependencies you must install and configure. Thankfully, Visual Studio makes this easier for developers. To get started, you create a new project. The Apache Cordova application template is under the JavaScript language group, as shown in Figure 1.20.

FIGURE 1.20 You can find the Apache Cordova project template under the JavaScript templates.

The project template should be familiar to web developers. It includes the core web folders css, images, and scripts. Your screens are written as HTML pages (see index.html in Figure 1.21). The merges and res folders are Cordova-specific; the merges folder is for platform-specific overrides to your code; the res folder is for icons and splash screens specific to a given platform. Figure 1.21 shows the Solution Explorer view of a Cordova application.

FIGURE 1.21 The Apache Cordova project structure should be familiar to web developers.

You write Cordova screens using standard HTML, CSS, and JavaScript. Again, this should be familiar to web developers. You can run and preview your application directly from Visual Studio. To do so, you select your platform in the toolbar (see Android in Figure 1.21) and then select the device emulator (see Ripple – Nexus (Galaxy) in Figure 1.21). From there, you press the green run (or play) button. This builds your application and launches the appropriate emulator. It also give you access to the DOM explorer from Visual Studio. Figure 1.22 shows a simple example of a Cordova application running in the Ripple emulator/debugger and Visual Studio controlling the debug process.

FIGURE 1.22 A sample application being debugged in the Apache Ripple Android emulator.