Hybrid View

  1. #1
    Sencha User rbraddy's Avatar
    Join Date
    Jul 2009
    Location
    Houston, TX
    Posts
    144
    Vote Rating
    7
    rbraddy is on a distinguished road

      5  

    Default Success with Sencha Architect

    Success with Sencha Architect


    After struggling initially to develop my ExtJS 4.1 app using Sencha Architect, I thought I would share my experiences after about 30 days of consistent usage.

    First, it took me about two weeks to truly get past the initial learning curve on ExtJS 4 MVC, so I would add that learning both Sencha Architect and MVC at the same time compounds the learning; however, the patient and responsive support I received from the SA architect and forum members during that critical first two weeks enabled me to keep making forward progress, not get discouraged, and finally reach a tipping point of productivity at about the 10 day point. Many thanks to all who assisted me.

    Second, I have found that Sencha Architect 2.1 is actually very stable and productive. One of the most important lesson learned for me was understanding how References and ComponentQuery works in 4.1. This really is one of the keys to harnessing the power of SA controllers.

    Additionally, I may have taken a slightly different approach to my application architecture than most. Instead of creating one big, monolithic ExtJS application, I chose to break my application into smaller, standalone "applets" (that's what I call them). Each applet is a standalone SA project and distinct ExtJS application. It can run standalone or be integrated into my overall application navigation framework.

    I believe that this modular approach is perfect for Sencha Architect, as each application and project is smaller and focused as a result. Admittedly, I'm not thrilled with how I had to integrate the various applets into the application framework (using iframes), but it works and for the most part works extremely well.

    My application is implemented as a top level framework with a typical east/west border layout, where the east panel contains a tree control (as shown below). The tree control is used to navigate to various functions. When the user clicks on an item in the tree, it opens an "iframe tab" in the west panel, which loads the applet (SA-generated application).

    app-framework.jpg


    For anyone interested, I started with this iframe application framework, which works like a charm.

    I'm sure the iframe/applet architecture isn't for everyone or every situation, but it's worked out great for building a modular, large application using ExtJS and Sencha Architect. In some ways, it's very similar to how the ExtJS Documentation application is structured (using iframes).

    In any event, there's a lot to like about Sencha Architect, especially for visually prototyping and designing the UI prior to coding it. Now that I'm over the learning curve, I honestly don't want to develop rich Internet apps any other way.

    My productivity continues to increase each week, and the ability to quickly clone an entire app (or applet, in my case) and then visually modify it to create the next applet is a real time saver. And since I don't have a huge, monolithic app to deal with, debugging and development is faster and easier using SA with lots of smaller applets.

    Many thanks to the Sencha Architect team for hanging tough through many iterations of this technology, from the early Designer phase and SA 1 to SA 2.1, and for the support here on the Sencha forums.

    Sencha Architect 2.1 is a real winner! I'm very glad I made it past the initial learning curve and didn't give up early on. The initial investment of time learning to use SA and MVC effectively was definitely worth it.

    Rick

  2. #2
    Sencha - Architect Dev Team aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,363
    Vote Rating
    128
    aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold

      0  

    Default


    Rick -

    Thanks for sharing your experience. We have new stuff in the pipeline that will continue to help you.
    Aaron Conran
    @aconran
    Sencha Architect Development Team

  3. #3
    Sencha - Architect Dev Team Phil.Strong's Avatar
    Join Date
    Mar 2007
    Location
    Olney, MD
    Posts
    1,925
    Vote Rating
    63
    Phil.Strong is just really nice Phil.Strong is just really nice Phil.Strong is just really nice Phil.Strong is just really nice

      1  

    Default


    Multi project support: yes please!

    /blushing

    One of the most important lesson learned for me was understanding how References and ComponentQuery works in 4.1. This really is one of the keys to harnessing the power of SA controllers.
    Can't really take credit for the controllers as they belong to the framework however we certainly do encourage their use. We need a bad ass component query guide that's for sure
    Phil Strong
    @philstrong
    #SenchaArchitect
    Sencha Architect Development Team

  4. #4
    Sencha User
    Join Date
    Oct 2012
    Posts
    6
    Vote Rating
    0
    kenzominang is on a distinguished road

      0  

    Default m...

    m...


    I have try SA for 2 week and it's really hard to learn.
    If I buy a SA, is there any step by step tutorial to built an application in the software bundle? Because, I think a complete tutorial is very helping a potential user to buy, especially a video tutorial....

  5. #5
    Sencha - Architect Dev Team Phil.Strong's Avatar
    Join Date
    Mar 2007
    Location
    Olney, MD
    Posts
    1,925
    Vote Rating
    63
    Phil.Strong is just really nice Phil.Strong is just really nice Phil.Strong is just really nice Phil.Strong is just really nice

      0  
    Phil Strong
    @philstrong
    #SenchaArchitect
    Sencha Architect Development Team

  6. #6
    Sencha User
    Join Date
    Oct 2012
    Posts
    6
    Vote Rating
    0
    kenzominang is on a distinguished road

      0  

    Default Thank...

    Thank...


    Thank Phil.Strong...
    I won't give up. If this make my work easier, I will buy one...

  7. #7
    Sencha User
    Join Date
    Nov 2012
    Location
    Mauritius
    Posts
    43
    Vote Rating
    3
    Shabneez is on a distinguished road

      1  

    Default


    Quote Originally Posted by rbraddy View Post

    Additionally, I may have taken a slightly different approach to my application architecture than most. Instead of creating one big, monolithic ExtJS application, I chose to break my application into smaller, standalone "applets" (that's what I call them). Each applet is a standalone SA project and distinct ExtJS application. It can run standalone or be integrated into my overall application navigation framework.

    I believe that this modular approach is perfect for Sencha Architect, as each application and project is smaller and focused as a result. Admittedly, I'm not thrilled with how I had to integrate the various applets into the application framework (using iframes), but it works and for the most part works extremely well.
    If I understand well, all the views etc which you used in your application, they are each an application on their own,right? Is there any other way of integrating all of them without using iframes? I don't seem to truly understand this...

  8. #8
    Sencha User rbraddy's Avatar
    Join Date
    Jul 2009
    Location
    Houston, TX
    Posts
    144
    Vote Rating
    7
    rbraddy is on a distinguished road

      1  

    Default


    Quote Originally Posted by Shabneez View Post
    If I understand well, all the views etc which you used in your application, they are each an application on their own,right? Is there any other way of integrating all of them without using iframes? I don't seem to truly understand this...
    Sencha Architect produces an ExtJS application, which has multiple views, controllers, stores, etc. When building a very large application (e.g., dozens to hundreds of views), by default SA assumes you will place everything in one corresponding large application (or a separate web page per application).

    What I have done is to create an "application framework", which in my case uses a border layout at the topmost level, as shown here in the SoftNAS(tm) administrator's reference guide. The admin menu panel on the left side (west region) is used to navigate the available "applets". Each applet appears in a separate IFRAME on the right side (east region), in its own tab. Here is an example of how it appears when several applets have been launched:

    drex_configuring_volumes_1_custom_4.jpg


    It turns out, this approach has the added benefit that you can display any HTML page within the framework, so it supports both SA-generated applets, as well as any other web page (e.g., documentation pages, non-SA applications, PHP pages, etc.

    This is very similar to how the Sencha Documentation system works.

    If you've ever tried developing, debugging and maintaining a huge, monolithic ExtJS application, then you will have a great appreciation for a more modular, focused approach.

  9. #9
    Sencha Premium Member
    Join Date
    Jan 2008
    Location
    San Francisco Bay, CA
    Posts
    41
    Vote Rating
    1
    rgralhoz is on a distinguished road

      0  

    Default


    Quote Originally Posted by rbraddy View Post
    Each applet appears in a separate IFRAME on the right side (east region), in its own tab. (...)

    If you've ever tried developing, debugging and maintaining a huge, monolithic ExtJS application, then you will have a great appreciation for a more modular, focused approach.
    Rick (@rbraddy), thanks for sharing your approach.

    Maybe other developers could share other alternatives of developing huge and complex applications / platforms through SA, w/o having an IFRAME for each app/page.

  10. #10
    Sencha User
    Join Date
    Jul 2012
    Posts
    7
    Vote Rating
    0
    mhayden is on a distinguished road

      0  

    Default


    rbraddy said,
    "If you've ever tried developing, debugging and maintaining a huge, monolithic ExtJS application, then you will have a great appreciation for a more modular, focused approach."

    I agree with you completely. I wrote a library to support a configuration driven Modular MVC Design pattern using ExtJs4.2.2, although I didn't have to use any IFrames, I agree with your approach. I spoke with one of the developers of Sencha's Architect IDE and he stated that their team is inevitably going to start supporting a modular design pattern. What ExtJs is currently "enforcing" as a design pattern is creating a nightmare for development by causing a waste of money.

    That being said, ExtJs is still the best choice for Large Web Application development.