Create Workspace using Sencha Cmd and its Usage

As we already know that we can create Single page  and Multi Page mobile Web Application using Sencha Cmd.

Single Page Application:

A Single Page Application (Sencha Touch App) will contain an Ext.Application class (app.js). Based on some events (tab, mousestart, keyup, initialize etc) we will be attaching other js files inside app.js and rendered into the browser.

Multi Page Application:

In Multi Page Application, we will have multiple pages. Here multiple pages can refer as Sencha Touch and Ext JS Application. With the help of Workspace, we can  categorize the multi page application. Now, we are going to see the workspace and its usage.

What is a Workspace:

As per the Sencha Cmd Documentation, A workspace is simply a folder that contains one or more pages, frameworks, packages and other shared code or files. The location of the workspace root folder should be chosen to facilitate these needs as well as your source control requirements. Any generated applications/pages created in sub-folders of the workspace folder regardless of their depth are consider to be members of the workspace.

How to Generate a Workspace:

To generate a workspace, use this command:

sencha generate workspace /path/to/workspace

This will create the following structure in the specified folder.

-.sencha/ 
        -workspace
             -sencha.cfg
             -plugin.xml

How to Generate Pages (Sencha Touch/Ext JS Apps) in the Workspace:

Once you have a workspace, generating pages ("Ext JS apps") is the same as before:

sencha -sdk /path/to/ext generate app ExtApp /path/to/workspace/extApp

You can also generate Sencha Touch applications in the same workspace:

sencha -sdk /path/to/touch  generate app TouchApp /path/to/workspace/touchApp

Because the targets of these generated pages are in the workspace, the following structure will be created

-.sencha/ 
       -workspace
             -sencha.cfg
             -plugin.xml

-ext

     ...

-touch

     ...

-extApp

     ...

-touchApp

      ...

Finally, we are going to see the workspace usage

Workspace Usage:

• If your project contains multi page applications (Sencha Touch and Ext JS App). We can have a common configuration defined in sencha.cfg file under workspace folder and access in the multi page application.

• You can also store the Sencha Touch and Ext JS SDK Files in a common place (inside ext and touch folder mentioned above) and refer the SDK Files in the multi page applications.

• You can also define share code and access accross multi page applications.

• Maintaining Code will be easier for Multi page Applications.

For More Details, Please refer the Sencha Cmd Workspace documentation

Hope, you enjoyed this Post.