13 enhancements in Sencha Architect 3 that will boost your team’s productivity

Sencha recently announced the availability of the beta version of their Sencha Architect 3. For those who already know and for those who wants to know, the goals of Sencha Architect are very clearly stated by Sencha that it endeavors to achieve:

With this in mind, I am going to highlight the 13 features that have made to the Sencha Archiect 3, so far, that are worth understanding and see how they are going to boost the overall productivity of your team.

1) Quick way to get started with Sencha Architect 3

When you launch the Sencha Architect 3, it has a Getting Started section with the links to a detailed document describing the steps to create your first ExtJS/Touch application using Sencha Architect.

Though the links, currently, point to the Sencha Architect 2 documentation, once the product moves towards GA release, it shall point to the documents related to version 3. Having said that, the steps are still valid, mostly, for Sencha Architect 3 as the basic process of creating the application has not changed much from version 2 to 3.

It’s a great way for a newcomer to find their starting point and learn the tool on their own.

2) Choose from existing templates to create your project

This is one of the greatest features and would save time and effort (hence time..some cases frustration). Sencha Architect 3 provides a list of pre-defined templates that one can choose from to create the basic layout of their application.

The Basic category has some basic application templates where the which is very useful in case you are planning to create a very simple application and not concerned with layouts on your main page.

The Layout category contains templates that can help you structure you page content using the combinations of different layouts offered by Sencha ExtJS

The Starter App category contains applications that can be used as a template to generate a project

3) Save your project as a template and use it

Besides allowing you to select a template to create a new project, the Architect also allows you to save your project as a template and use the same for subsequent project creation.

4) Choose the framework license (GPL/Commercial) to create new project

Previously, it was not so straight forward to select the framework based on your license – GPL or Commercial. Now, the Sencha Architect prompts you to select the license at the time of creating a new project and uses the information to use the appropriate ExtJS/Touch libraries

5) Sencha Cmd based project creation

Sencha Architect 3 is now integrated with Sencha Cmd for the project creation as well as build. The following screenshot shows that Sencha Cmd is launched to create the new project:

With Sencha Cmd integrated it opens up the opportunity in the area of build, packaging, and testing the application without leaving the Sencha Architect, which I expect to come in the near future.

6) Choose from available themes

Sencha ExtJS offers three themes – classic, gray, neptune. However, it was not so straight forward to use a theme, other than classic, in the project (we had to work with Resources). In version 3, themes are now available for us to apply to our application with no effort

Same applies to the Sencha Touch projects, where you can apply the blackberry, windows theme to your application with tremendous ease.

7) Import Custom extensions

In Architect 3, it is straight forward to import a custom user extension into your project and use it. And user extension could contains one or more components, plugins, proxy, etc. Integrating User Extension in Architect shows how to do it. In case you want to know how to create user extensions for Sencha Architect 3, read Creating User Extension.

This is one feature that we were looking for in the Sencha Architect as there are many extensions you might have seen on the internet or your team may have written and you had a tough time using them in the Architect. I know the enterprise developers are going to love this.


8) Code completion in the code editor

Now when you write a handler code, or a custom method, etc. the code editor offers automatic code completion and it also shows the suggestions when you click Ctrl-Space bar. On mouseover, it also shows the documentation of the property/method

While I would liked to see the suggestion coming out when I hit the dot (.), but I think we can live with the Ctrl-Space option.

9) Keyboard Shortcut to toggle between Code/Design views

May not realize it as a great feature but if you are a developer you would know what I am talking about.

10) Manage storage effectively

Projects, extensions, components, templates, and themes have separate storage locations settings that can be used to store them in separate place that makes the sharing and usage of theses entities easier. In case, you need to share them across multiple machines (users), you may mount a shared drive and use that as the storage location.

11) Console with Log and Output

Helps you to look at the Sencha Architect log messages as well as application logs

12) Specify application name at the time of saving a project

Specify application name and project name, separately, at the time of saving the project. Previously, we had to go to modify the config – name – on the application class. But, now it is part of the Project settings, which means it is the metadata of the project and can be used in the build/test/etc.

13) Create, test, and use new custom theme

With the integration with Sencha Cmd and Compass, you can modify the theme variables, define new ones and create a new theme instantaneously. For Sencha Touch themes, the pictos images are also available that you can use in your theme.

Well, above was the list of 13 features that I wanted to emphasize. There are many more features that would be coming as part of the version 3 roadmap (e.g. Appurify based Touch application testing, creating multi-profile touch applications, etc.), which are highly desirable and looking at the Sencha Architect 3 Goals, I must say it should be a matter of time. I hope you found this article helpful!

In case you need any professional support on Sencha products like ExtJS, Sencha Touch, and Architect do visit our website and get in touch with us.


Sencha Architect 3 Documentation

Build Ext JS and Sencha Touch Applications Faster with Sencha Architect 3

Co-founder of Walking Tree, Speaker, Sencha Trainer, Author of Sencha Charts Essentials, Sencha Touch Cookbook, Sencha MVC Architecture, and ADempiere Cookbook.

Tagged with: , , , , ,
Posted in Sencha Architect, Sencha ExtJS, Sencha Touch
3 comments on “13 enhancements in Sencha Architect 3 that will boost your team’s productivity
  1. I am building my first projects completely with Sencha Architect 3 and I must say that Will de la Vega will not be completely satisfied. I wonder if this version will really boost the team’s productivity. I am not very happy with the fact that most of the work has to be done by clicking. The editor is not very strong and at times very slow. Debugging of source code is a real crime. And while debugging it in the browser and fix some errors with an external editor, you should be aware to modify these changes also again in the editor of Architect. The editor (and the limited possibilities of editing directly) are the real showstopper in making working with Sencha Architect fast. If you know how to make a good build from the command line and you have a good library of factory components, I really doubt if working with Architect is so much faster with this version.

    Sencha Architect 3 is not a product to build Ext JS or Touch applications with, without having knowledge of the frameworks and JavaScript. And I think it is quite expensive too.

    I have written a review on it (for I thought that many blogs in my opinion were far to optimistic). http://www.enovision.net/review-sencha-architect-3/ and here one about debugging with Sencha Architect: http://www.enovision.net/find-syntax-error-sencha-architect/.

    But it’s not all that bad, it’s only not that good either. I am a developer with Ext JS now for 5 years and I think that Sencha should do some things just much better.

  2. Does if finally allow for round-trip code WYSIWYG? Because that has been always the main flaw in Sencha Architect. If I am tied to do everything within a GUI again, I don´t think I am going to like this. especially when there are so many other new options in the market right now. However sounds interesting, I think I´ll take a look and if I am not frustrated I might recommend Sencha again.

    • Ajit Kumar says:

      No. It is still not prepared for this. It is primarily due to the metadata that Sencha Architect generates and uses to show the project, their files, and their content.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

We Have Moved Our Blog!

We have moved our blog to our company site. Check out https://walkingtree.tech/index.php/blog for all latest blogs.

Sencha Select Partner Sencha Training Partner
Xamarin Authorized Partner
Do More. With Sencha.

Recent Publication
%d bloggers like this: