sencha tools 250 - Getting started with Sencha Touch with Sencha Cmd

Getting started with Sencha Touch with Sencha Cmd

Posted on

sencha tools 250 - Getting started with Sencha Touch with Sencha Cmd

Sencha Touch is a complete MVC JavaScript framework specially designed to create mobile web applications for touchscreen devices like Andriod, Apple iOS. Sencha Touch allows developers to create applications for mobile platforms that feature web browsers implementing the latest standards, like the WebKit browser engine.

Sencha Touch team has taken a deliberate decision not to support other mobile browser engines, such as Gecko (Firefox), this will affects the FireFox developers because only Safari or Google Chrome can be used to debug Sencha Touch applications.

Using Sencha Cmd

Sencha Cmd consists of command line tools that can be used to create and update Sencha Touch/ExtJS applications from a terminal. You can download and install Sencha Cmd from Sencha’s website. Using Sencha Cmd for creating Touch application is fairly simple and i am going to use it to show you how to create your first Touch app using Cmd.

sencha cmd installation - Getting started with Sencha Touch with Sencha Cmd

After installation check my wrriting sencha command into your terminal.

Note: You can use any of your server installed on your machine (XAMPP, WAMP, Tomcat, IIS etc) If you don’t have any webserver installed on your computer then don’t worry. Sencha Cmd comes with a very handy build-in jetty webserver. Just start a command prompt instance and type ‘sencha web start’, access your app on the webserver using URL http://localhost:1841/. I will use this webserver to host my first Touch App. You can stop the server by Cntr+C or execute ‘sencha web stop’ from another terminal.

sencha cmd web server - Getting started with Sencha Touch with Sencha Cmd

Creating your first Touch App

1) Install Sencha Cmd, Java version 6+ and Sencha Touch SDK from sencha’s website. Open a terminal window and type sencha which to verify whether its installed property or not. if yes, you should see Sencha Cmd version and its installed location on terminal window.

2) Create a Directory any where in your local file system. (ie c:\SenchaWeb) This will serve as a Webserver’s default context-root. Open a terminal window and goto that directory and execute sencha web start command. This will start a Jetty webserver on port 1841 for that directory. We will place our application in that directory only.

3) Open a Ternimal window, goto sencha touch sdk directory (in my case its c:\touch-2.3.1 ) and execute sencha generate app TechZoo c:\SenchaWeb\Starter command on terminal. Now sencha will generate a basic direcory structure, copy all necessary library file to that directory and generate model, view controller etc. This command will help to start a Touch Application quickly.

4) With the Jetty webserver is alreay started (if not then follow step 2), you can access your first Touch App by hitting http://localhost:1841/Starter URL in Google Chrome, or Apple Safari browser. If everything goes well, your application will look like as following….

sencha touch first app - Getting started with Sencha Touch with Sencha Cmd

Happy mobile coding…:)