The following explains the details for configuring all of the tools required to build native Android and Windows 8 applications using Sencha on an Windows 8 machine.

In order to build for the Windows 8 platform you must be running on Windows 8.

Why these versions? See http://www.appfoundation.com/2014/02/automating-the-building-of-native-android-and-ios-apps-using-sencha-touch/ for a detailed explanation.

Node 0.10.23 and Cordova 3.4.0

Node is the thing you need to install Cordova. Apache Cordova is a set of device APIs that allow a mobile app developer to access native device function such as the camera or accelerometer from JavaScript (https://cordova.apache.org/). This is what Sencha Command uses behind the scenes to package their Sencha Touch framework on native devices.

An important deviation here from this set of instructions versus the other OS X and general Windows instructions that we are using Cordova 3.4.0 instead of 3.0.0. The reason at the time of the original work Cordova 3.1 and 3.2 would not allow you to add the Android platform and Cordova 3.4 did not yet exist. Cordova 3.2 was the first version to add Windows 8 platform support, but because it didn’t work with Android out-of-the-box this was used. While Cordova 3.4 works with the Android platform, the generated Eclipse project doesn’t work out-of-the-box but it will build at the command-line.

1. Download: http://nodejs.org/dist/v0.10.23/node-v0.10.23.msi

2. Install node-v0.10.23.msi

4. Open a new Command Prompt

3. Type  the following: npm -v

1.3.17

4. Type the following: npm install -g cordova@3.4.0

Lots of GET output

5. Type the following: cordova -v

3.4.0

JDK 7.51

Java is a programming language and computing platform first released by Sun Microsystems in 1995 (http://www.java.com/en/download/faq/whatis_java.xml). You need it in order to install Sencha Command, run the Sencha Command Tools, run a Java based dev environment, use the Android Tool Suite, and use Gradle.

1. Download: http://www.oracle.com/technetwork/java/javase/downloads/jdk7-downloads-1880260.html

2. Double-click the EXE file run the installer

3. Open a new command prompt

4. Type: java -version

java version “1.7.0_51”

6. Create a  JAVA_HOME environment variable with the value that is the location where Java is installed

7. Open a new command prompt

8. Type: echo %JAVA_HOME%

C:\Program Files\Java\jdk\1.7.0_51

Sencha Command 4.0.1.45

From scaffolding a new project, to minifying and deploying your application to production, Sencha Cmd provides a full set of lifecycle management features to compliment your Sencha projects (http://www.sencha.com/products/sencha-cmd/download). Sencha Command is an Ant based scripting tool for natively packaging a Sencha Touch app on various native platforms, but this isn’t one step solution. In order to get it to work for you additional build process work will be required.  For a detailed description of how this process works see http://www.appfoundation.com/2014/02/automating-the-building-of-native-android-and-ios-apps-using-sencha-touch/.

1. Download: http://www.sencha.com/products/sencha-cmd/download

• Unfortunately Sencha does not appear to keep older versions of the product.
• I can only verify that 4.1.0.45 works with all of the other tools listed here.
• Since I do not have permission to distribute Sencha Command, I cannot give you my copy.
• Hopefully you can find it through some other means.

3. Double-click on the EXE to launch the installer

4. Change the install location to C:\sencha-cmd-4

5. Complete the installation

6. Open a new command prompt

7. Type the following: sencha which

Sencha Cmd 4.0.1.45

Ruby 2.0.0

Ruby is the technology used by the underlying Sencha theming method called Compass.

1. Download http://dl.bintray.com/oneclick/rubyinstaller/rubyinstaller-2.0.0-p451.exe?direct

2. Double-click on the EXE to run the installer

3. Follow the installation steps

4. Open a new command prompt

5. type the following: ruby -v

ruby 2.0.0p451

Compass

Compass is an open-source CSS Authoring Framework (http://compass-style.org/). This is what Sencha uses behind the scenes to turn SASS files into CSS files for the purposes of advanced cross platform compatible theming.  You need Ruby installed to be able to use the GEM installation command.

1. Open a new command prompt

2. Type the following: gem install compass

4 gems installed: sass, chunky_png, fssm, compass

Ant 1.8.4

Apache Ant is a Java library and command-line tool that help building software (http://ant.apache.org/). Ant is the underlying technology used by both Sencha Command and Cordova. Specifically you need the bin directory of the Ant installation to be on your path for Cordova to actually work behind the scenes.

1. Download from http://archive.apache.org/dist/ant/binaries/apache-ant-1.8.4-bin.zip

2. Extract it to some location on your computer

3. Add the Ant bin directory to your PATH environment variable

• For example: C:\tools\ant-1.8.4\bin

4. Open a new command prompt

5. Type the following: ant -version

Verify the output: Ant 1.8.4

Gradle 1.6

You don’t need Gradle to do anything with Sencha, however in order to automate the building process you will need a scripting language. Preferably you should use a scripting language which will work on more than one platform. While you could just use Ant, I would highly recommend a more modern technology in which it is easier to do things programmatically (like use conditional logic). Gradle combines the power and flexibility of Ant with the dependency management and conventions of Maven into a more effective way to build (http://www.gradle.org/). I used Gradle to make a single automated process for building native Android, iOS, Windows 8, and Windows Phone apps with Sencha Touch and any other JavaScript based technology as Af Gradle.

1. Download: http://services.gradle.org/distributions/gradle-1.6-all.zip

2. Extract it to some location on your computer

3. Add the bin directory to your PATH environment variable

• Example: C:\tools\gradle-1.6\bin

5. The following: gradle -v

Gradle 1.6

Android Toolkit 2013-1030

The Android SDK provides you the API libraries and developer tools necessary to build, test, and debug apps for Android (http://developer.android.com/sdk/index.html). You need this toolkit in order to build native Android applications. Cordova 3.4.0 will only work with a minimum of the Android API 19. While I have read that it is possible to get it to work with API 18, I attempted to do so and just encountered problems later on in the process.

1. Download: http://dl.google.com/android/adt/adt-bundle-windows-x86_64-20131030.zip

2. Extract it to C:\adt-bundle-windows-x86_64-20131030

• You want to keep it at a root level like this because some of the paths are very long
• Windows does not correctly handle long paths in some cases which will result in compile and other issues later

3. Add the tools and platform-tools directory locations to your PATH environment variable:

• C:\adt-bundle-windows-x86_64-20131030\sdk\platform-tools
• C:\adt-bundle-windows-x86_64-20131030\sdk\tools

4. Open a new command prompt

5. Type the following: adb version

Android Debug Bridge 1.0.31

6. We now need to uninstall the 19 SDK because it is broken for Cordova 3

7. Type the following: android avd

8. Select Tools -> Manage SDK

9. Select “Deselect All”

10. Select “Android 4.4 (API 19) to install everything associated with it

11. Click “Install Packages”

HAXM

This tools provides you with the ability to use the x86 Atom Intel system images for Android emulation. What does that mean? It means in order to run an emulator it only takes 10 seconds to startup versus 5 minutes. The only requirement is that you have to have an Intel processor that supports VT-T emulation.

1. Download it from http://software.intel.com/en-us/android/articles/intel-hardware-accelerated-execution-manager

2. Extract it to wherever you want

3. Double-click on the installer and go through the installation process, it will either work or it won’t.

Eclipse 4.3.1 (Java EE)

Eclipse is a Java based development environment that I personally use to work on Sencha Touch apps, and is a nice to have tool for looking at native android projects.

There are two ways to do this:

1. Download Eclipse and update it yourself

2. Download a preconfigured version of Eclipse.

• Someone you know somewhere has already configured Eclipse with SVN, Android, Gradle, and anything else you need.
• You just need to have this person zip their Eclipse Application directory and give it to you (it will probably be less than 1 GB).

Option 1

1. Download:http://www.eclipse.org/downloads/download.php?file=/technology/epp/downloads/release/kepler/SR2/eclipse-jee-kepler-SR2-win32-x86_64.zip

2. Extract it to somewhere on your computer

3. Double-click on Eclipse.exe to launch it for the first time

4. Get ADT

• Help -> Eclipse Market Place
• Search for “ADT”
• Select to install “ADT”
• Install it
• Restart Eclipse
• Get a dialog stating that Android SDK has not been setup in the preferences
• Select “Open Preferences”
• Select “ C:\adt-bundle-windows-x86_64-20131030\sdk”
• Press apply (see all the found SDKs)
• Press OK
• Select “Use existing SDKs”
• Enter “ C:\adt-bundle-windows-x86_64-20131030\sdk”
• Press “Finish”

5. Get STS Groovy/Gradle

• Help -> Eclipse Market Place
• Search for “GGTS”
• Select to install it for Eclipse Kepler
• Restart Eclipse

6. Set Eclipse Memory to 512m or 1500m

• Edit eclipse.ini to change the memory constraints

Option 2

1. Obtain it

2. Extract it to somewhere on your computer

Visual Studio Ultimate 2012

The is the development environment as well as a series of command-line tools for building Windows applications.

1. Download it from http://www.microsoft.com/en-us/download/details.aspx?id=30678

2. In true microsoft fashion, this is just a wrapper around a remote installer. There is no guarantee what version you are going to get when you run this, but it should be 2012.

MSBuild

This is the command line tool that is used to package windows 8 applications. If you don’t have this installed cordova will silently fail and you won’t get a binary when doing a native build. This tool should have already been installed by either the .NET framework or the visual studio tools, and all you have to do is figure out where msbuild.exe is and add it to you path.

1. Add the location of msbuild.exe to your path, which will be in a location similar to C:\Windows\Microsoft.NET\Framework64\v4.0.30319

Windows Certification Toolkit

This is a GUI and command-line tool for verifying that your Windows application will pass windows store criteria. At this time I am not sure whether or not it is feasible to automate this process, as it requires that you install your application use a PowerShell script, and then feed the app into either the command-line or GUI drive application.

1. Download it from http://msdn.microsoft.com/en-us/windows/apps/bg127575.aspx

2. This is another Windows installer wrapping a lot of download, so be prepared to wait for more downloading.

3. When you are done with the installation you will need to add the following location to the PATH environment variable: C:\Program Files (x86)\Windows Kits\8.1\App Certification Kit

4. The executables are appcert.exe and appcertui.exe.

Remote Tools (ARM)

Remote tools are a plugin for visual studio that allow you to remotely debug applications. This is important for the Surface because this is an easy way to run your app on a surface out of the IDE. This requires that you install the remote tools on both the developer machine (x64) and on the Surface itself (ARM).

You must do this on the remote device, meaning the Microsoft Surface

1. Download it from http://www.microsoft.com/en-us/download/details.aspx?id=38184

2. Double-click on the EXE to install it.

3. Once installed, click on the Windows icon thing in the lower right corner to get into the parallel universe that is Windows 8. Once there select apps and search for “Remote Debugger Application”

4. Run the application, and then go to your desktop.

5. You will see a Window where you can start the remote debugger, and change settings like turning authentication off. Once started the device will be on the network with a name like “JOHNSSURFACE:4016”. This is the address you will attach to on the computer with Visual Studio.

Remote Tools (x64)

This is what you install on the computer that is running the development environment, meaning Visual Studio 2012. You have to create a dummy project in order for the remoting option to be available in future Cordova based projects.

1. Download it from http://www.microsoft.com/en-us/download/details.aspx?id=38184

2. Double-click on the EXE to install it.

3. Once installed open Visual Studio 2012 Ultimate

4. File -> New Project -> Templates -> JavaScript -> Windows Store

5. Next to the play button in the top tool bar, select “Remote Machine”

6. Follow the prompts about creating a developer certificate

7. Specify the remote machine name as whatever it is showing as on the surface, probably something like “JOHNSSURFACE:4016”. If you are running with authentication off, make sure to set that, otherwise you have to enter the username/password used on the device.

8. When you start the initial debugging you will have to confirm several security prompts on the remote device (the Surface).