Docs appalling - how to actually get started?

[airaid]

Trying to get up and running with Touch has been a terrible experience. The quick start applies to 1.x:

http://www.sencha.com/learn/sencha-touch-quick-start/

The getting started page gives confusing (and conflicting?) information and requires the SDK Tools:

http://www.sencha.com/learn/getting-...rted-section-3

SDK Tools don't work (incorrect directory error), which apparently is because we require CMD (only discovered through Googling the SDK error message):

http://www.sencha.com/forum/showthre...om-the-install

...which links to a page which links to a post which links to the docs which says I need JRE and Compass...

Seriously? Just to get started?

I just want to be able to do a quick 'Hello World' and I'm tearing my hair out because I don't even know if I'm following the right install instructions.

So is there an up-to-date guide? Can I get a bullet list?

[bricemason]

You will need:

Sencha Touch 2.1
This is the actual framework and can be downloaded here: http://www.sencha.com/products/touch/download/

Sencha Cmd 3.0
This is the system used to generate and build your Sencha Touch 2.1 apps. You can get that here:
http://www.sencha.com/products/sencha-cmd/download

There are some supporting tools that will need to exist on your system:

• Ruby - Use this to install SASS and Compass if not already on your machine. If you're on Windows, you'll need to download Ruby. If you're on a Mac, it's already there.
• SASS - Manages the styles/theming of Sencha Touch, install this using Ruby
• Compass - Based on SASS, install this using Ruby
• JRE - Java is required for the Sencha Cmd
• Ant - Sencha Cmd is based on Ant
• A web server running locally for testing
• A modern browser to test in such as Google Chrome or Apple Safari

If you had previously installed the Sencha SDK Tools, I'd recommend uninstalling that first before installing Sencha Cmd as they share the same command 'sencha'.

Once you have everything installed:

1. Open a command line
2. Change directory to the root of your sencha touch 2.1 library
3. Run the command sencha generate app MyApp [pathToTheApp] where [pathToTheApp] is a path to a web serverable directory. MyApp is the name of the application (it can be whatever you like)
4. Run the app in your browser.

That's the 'hello world' app that is auto-generated.

Try it out, if it fails post a reply with the errors you get or questions you have. There are a good group of people on this forum ready to help.

Brice

[airaid]

Brice, I'm hugely grateful. That's the most concise list of requirements I've seen and a lot more useful than any official docs I could find.

I think I'm up and running, I've managed to generate an app and build a production version which has got to be a good start. Now I need to learn how to use it

Thanks again.

[bricemason]

That's great, glad to hear you're able to start digging in. Now that you've started coding, I have found the guides to be helpful to get started:

http://docs.sencha.com/touch/2-1/#!/guide

Keep using the forums too, I have found them very helpful.

Brice

[loren.rogers]

That's great Brice. But I want to build a downloadable APK for Android. I don't want to run from my Web browser on my device. How do I do this?
/Loren

[bricemason]

If you want to use PhoneGap, you could try out my project which hooks into the the Sencha build process. You can learn more about it here:

http://bricemason.github.com/sencha-cordova-builder/

I have two screencasts there, the first is how to use it and the second is how to incorporate phonegap plugins in the build process if you should need them.

You can also use the Sencha native build process, here is a link to the docs for that:

http://docs.sencha.com/touch/2-1/#!/...tive_packaging

Brice

[loren.rogers]

Thanks, Brice! I've also been looking into Phonegap 2.2.0. I thought it was a case of "one or the other". But it looks like I can use both? Phonegap seems a bit more intuitive for me to use.
/Loren

[bricemason]

They work together just fine. If you're developing your android app in a windows environment and are not able to use the Sencha Cordova Builder, you could also refer to this screencast which walks through the basics of how to get a sencha touch android app up and running:

https://vimeo.com/55335529

Brice

[loren.rogers]

C:\Users\Loren\xampp\htdocs\sencha_apps\my-app>sencha app build package
Sencha Cmd v3.0.0.250
[INF] init-properties:
[INF] init-sencha-command:
[INF] init:
[INF] -before-app-build:
[INF] app-build-impl:
[INF] package:
[INF] -before-init-local:
[INF] -init-local:
[INF] -after-init-local:
[INF] init-local:
[INF] find-cmd:
[INF] -before-init:
[INF] -init:
[INF] -after-init:
[INF] init:
[INF] -before-build:
[INF] sass:
[INF] -before-sass:
[INF] -sass:
[INF] [shellscript]
[INF] [shellscript] C:\Users\Loren\xampp\htdocs\sencha_apps\my-app\resources\sass>compass compile --boring --force
[INF] [shellscript] identical ../css/app.css
[INF] -after-sass:
[INF] page:
[INF] -before-page:
[INF] -page:
[INF] building application
[INF] Deploying your application to C:\Users\Loren\xampp\htdocs\sencha_apps\my-app\build\MyApp\package
[INF] Copied app.js
[INF] Copied resources/css/app.css
[INF] Copied C:\Users\Loren\xampp\htdocs\sencha_apps\my-app\resources\icons
[INF] Copied C:\Users\Loren\xampp\htdocs\sencha_apps\my-app\resources\startup
[INF] Resolving your application dependencies (file:///C:/Users/Loren/xampp/htdocs/sencha_apps/my-app/index.html)
[INF] Compiling app.js and dependencies
[INF] Processing classPath entry : C:\Users\Loren\xampp\htdocs\sencha_apps\my-app\sencha-compile-temp-dir
[INF] Processing classPath entry : C:\Users\Loren\xampp\htdocs\sencha_apps\my-app\touch\src
[INF] Processing classPath entry : C:\Users\Loren\xampp\htdocs\sencha_apps\my-app\app.js
[INF] Processing classPath entry : C:\Users\Loren\xampp\htdocs\sencha_apps\my-app\app
[INF] Processing class inheritance graph
[INF] Processing instantiation refereces to classes and aliases
[INF] Processing source dependencies
[INF] Concatenating output to file C:\Users\Loren\xampp\htdocs\sencha_apps\my-app\build\MyApp\package\app.js
[INF] Completed compilation.
[INF] Processed remote file touch/sencha-touch.js
[INF] Processed local file app.js
[INF] Minified app.js
[INF] Minified resources/css/app.css
[INF] Generated app.json
[INF] Embedded microloader into index.html
[INF] Successfully deployed your application to C:\Users\Loren\xampp\htdocs\sencha_apps\my-app\build\MyApp\package
[INF] -after-page:
[INF] run:
[INF] -build:
[INF] -init-properties:
[INF] -is-android-built:
[INF] -is-android-init-ready:
[INF] [echo] checking android initialization using the following resources:
[INF] [echo] cordova library C:/Users/Loren/Documents/phonegap2.2
[INF] [echo] android tools C:/Users/Loren/Documents/phonegap2.2/lib/android/bin
[INF] [echo] android create script C:/Users/Loren/Documents/phonegap2.2/lib/android/bin/create
[INF] [echo] android javascript file C:/Users/Loren/Documents/phonegap2.2/lib/android/cordova-2.2.0.js
[INF] [echo] android project C:\Users\Loren\xampp\htdocs\sencha_apps\my-app\build\MyApp/android
[INF] [echo] android project built state...false
[INF] -before-init-android-internal:
[INF] -before-init-android:
[INF] -init-android-internal:
[INF] [echo] initializating android build...
[INF] [echo] creating android project with the following details:
[INF] [echo] project path: C:\Users\Loren\xampp\htdocs\sencha_apps\my-app\build\MyApp/android
[INF] [echo] project namespace: com.dell.kace.MyApp
[INF] [echo] project name: MyApp
[ERR] BUILD FAILED
[ERR] com.sencha.exceptions.BasicException: Execute failed: java.io.IOException: Cannot run program "C:\Users\Loren\Documents\phonegap2.2\lib\android\bin\create": Create
rocess error=193, %1 is not a valid Win32 application
[ERR] at com.sencha.exceptions.BasicException.wrap(BasicException.java:43)
[ERR] at com.sencha.cli.Command.dispatch(Command.java:104)
[ERR] at com.sencha.cli.Commands.dispatch(Commands.java:49)
[ERR] at com.sencha.cli.AbstractCommand.dispatch(AbstractCommand.java:182)
[ERR] at com.sencha.ant.SenchaCommandTask.doExecute(SenchaCommandTask.java:58)
[ERR] at com.sencha.ant.BaseAntTask.execute(BaseAntTask.java:22)
[ERR] at org.apache.tools.ant.UnknownElement.execute(UnknownElement.java:291)
[ERR] at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
[ERR] at sun.reflect.NativeMethodAccessorImpl.invoke(Unknown Source)
[ERR] at sun.reflect.DelegatingMethodAccessorImpl.invoke(Unknown Source)
[ERR] at java.lang.reflect.Method.invoke(Unknown Source)
[ERR] at org.apache.tools.ant.dispatch.DispatchUtils.execute(DispatchUtils.java:106)
[ERR] at org.apache.tools.ant.Task.perform(Task.java:348)
[ERR] at org.apache.tools.ant.Target.execute(Target.java:392)
[ERR] at org.apache.tools.ant.Target.performTasks(Target.java:413)
[ERR] at org.apache.tools.ant.Project.executeSortedTargets(Project.java:1399)
[ERR] at org.apache.tools.ant.Project.executeTarget(Project.java:1368)
[ERR] at org.apache.tools.ant.helper.DefaultExecutor.executeTargets(DefaultExecutor.java:41)
[ERR] at org.apache.tools.ant.Project.executeTargets(Project.java:1251)
[ERR] at com.sencha.ant.AntRunner.run(AntRunner.java:156)
[ERR] at com.sencha.ant.AntRunner.run(AntRunner.java:72)
[ERR] at com.sencha.command.BasePluginCommands$BasePluginCommand.run(BasePluginCommands.java:87)
[ERR] at com.sencha.command.BasePluginCommands$BasePluginCommand.run(BasePluginCommands.java:91)
[ERR] at com.sencha.command.BasePluginCommands$BaseNamePathCommand.run(BasePluginCommands.java:135)
[ERR] at com.sencha.command.app.AppCommands$BuildCommand.execute(AppCommands.java:106)
[ERR] at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
[ERR] at sun.reflect.NativeMethodAccessorImpl.invoke(Unknown Source)
[ERR] at sun.reflect.DelegatingMethodAccessorImpl.invoke(Unknown Source)
[ERR] at java.lang.reflect.Method.invoke(Unknown Source)
[ERR] at com.sencha.cli.Command.dispatch(Command.java:78)
[ERR] at com.sencha.cli.Commands.dispatch(Commands.java:49)
[ERR] at com.sencha.cli.Commands.dispatch(Commands.java:49)
[ERR] at com.sencha.command.Sencha.main(Sencha.java:71)
[ERR] Caused by: C:\Users\Loren\Documents\sencha-cordova-builder\build-cordova-android.xml:52: Execute failed: java.io.IOException: Cannot run program "C:\Users\Loren\Do
uments\phonegap2.2\lib\android\bin\create": CreateProcess error=193, %1 is not a valid Win32 application
[ERR] at org.apache.tools.ant.taskdefs.ExecTask.runExec(ExecTask.java:675)
[ERR] at org.apache.tools.ant.taskdefs.ExecTask.execute(ExecTask.java:498)
[ERR] at org.apache.tools.ant.UnknownElement.execute(UnknownElement.java:291)
[ERR] at sun.reflect.GeneratedMethodAccessor8.invoke(Unknown Source)
[ERR] at sun.reflect.DelegatingMethodAccessorImpl.invoke(Unknown Source)
[ERR] at java.lang.reflect.Method.invoke(Unknown Source)
[ERR] at org.apache.tools.ant.dispatch.DispatchUtils.execute(DispatchUtils.java:106)
[ERR] at org.apache.tools.ant.Task.perform(Task.java:348)
[ERR] at org.apache.tools.ant.Target.execute(Target.java:392)
[ERR] at org.apache.tools.ant.Target.performTasks(Target.java:413)
[ERR] at org.apache.tools.ant.Project.executeSortedTargets(Project.java:1399)
[ERR] at org.apache.tools.ant.Project.executeTarget(Project.java:1368)
[ERR] at org.apache.tools.ant.helper.DefaultExecutor.executeTargets(DefaultExecutor.java:41)
[ERR] at org.apache.tools.ant.Project.executeTargets(Project.java:1251)
[ERR] at com.sencha.ant.AntRunner.run(AntRunner.java:156)
[ERR] at com.sencha.ant.AntRunner.run(AntRunner.java:80)
[ERR] at com.sencha.command.ant.AntCommand.execute(AntCommand.java:75)
[ERR] at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
[ERR] at sun.reflect.NativeMethodAccessorImpl.invoke(Unknown Source)
[ERR] at sun.reflect.DelegatingMethodAccessorImpl.invoke(Unknown Source)
[ERR] at java.lang.reflect.Method.invoke(Unknown Source)
[ERR] at com.sencha.cli.Command.dispatch(Command.java:78)
[ERR] ... 31 more
[ERR] Caused by: java.io.IOException: Cannot run program "C:\Users\Loren\Documents\phonegap2.2\lib\android\bin\create": CreateProcess error=193, %1 is not a valid Win32
pplication
[ERR] at java.lang.ProcessBuilder.start(Unknown Source)
[ERR] at java.lang.Runtime.exec(Unknown Source)
[ERR] at org.apache.tools.ant.taskdefs.Execute$Java13CommandLauncher.exec(Execute.java:862)
[ERR] at org.apache.tools.ant.taskdefs.Execute.launch(Execute.java:481)
[ERR] at org.apache.tools.ant.taskdefs.Execute.execute(Execute.java:495)
[ERR] at org.apache.tools.ant.taskdefs.ExecTask.runExecute(ExecTask.java:631)
[ERR] at org.apache.tools.ant.taskdefs.ExecTask.runExec(ExecTask.java:672)
[ERR] ... 52 more
[ERR] Caused by: java.io.IOException: CreateProcess error=193, %1 is not a valid Win32 application
[ERR] at java.lang.ProcessImpl.create(Native Method)
[ERR] at java.lang.ProcessImpl.<init>(Unknown Source)
[ERR] at java.lang.ProcessImpl.start(Unknown Source)
[ERR] ... 59 more
[ERR] Total time: 14 seconds
[ERR] com.sencha.exceptions.BasicException: Execute failed: java.io.IOException: Cannot run program "C:\Users\Loren\Documents\phonegap2.2\lib\android\bin\create": Create
rocess error=193, %1 is not a valid Win32 application


C:\Users\Loren\xampp\htdocs\sencha_apps\my-app>Any ideas (on Windows)?

[bricemason]

On windows, you'll need to update a property in the cordova.properties file from:

cordova.android.tools.bin.create=${cordova.android.tools.bin}/create

to:

cordova.android.tools.bin.create=${cordova.android.tools.bin}/create.bat

Aside from that, the paths in the properties file use forward slashes which you might want to use too. I think windows is pretty forgiving on that.

I have only tested this project on mac but I think it should be fine on windows given these slight modifications.

Just make sure that before you build again that you delete any of these files from the root of your sencha root that might be there. You'll need to do this for subsequent builds too:

_android.built
_android.deploy

I should probably update the project to detect the OS and choose the appropriate create script, it's easy enough.

Brice