5 Aug 2011 7:13 AM #1
[Project] ExtJs4 MVC Desktop with Zend Framework Backend
I'm releasing my first piece of code: An ExtJs4 MVC Desktop with Zend Framework Backend and AdminPanel
The development took several months and I'm somehow happy that Sencha didn't release a MVC style Desktop before I did
Some words about the development:
Started with ExtJs3.2 and at this point of time ExtJs and Zend Framework was completely new land for me. After a lot of setbacks I stopped the development and with ExtJs4.0.1 I started again to work on this code.
If you look at the sources (especially the ZF Backend) you will see my missing knowledge about the best technics and how to do stuff.
Because this is a hobby project I didn't work every day on this and spend here and there some hours. With ExtJs4 I had some very frustrating times and after I rethink the "goal" of this project, it got better. Today, every little step is a success and I do not see the complete project as a success, rather than every
bit of code that work or still work after refactoring is "mission accomplished".
About the project content:
After the release of 4.0.1 (I think) there was no MVC example that prove the MVC Framework ExtJs4 is usable for bigger projects.
The released Desktop Example is a lot better than the ExtJs3 version, but I missed the MVC part.
The complexity of this application was a key factor, why I restarted my old project again.
I've reached a little milestone and I thought 'release it', because of the following causes:
- I have to: I'm a GPL User
- I want to: Other should review the code and give me tipps how to improve it
- I should: Because it can help other users, that have problems to find an entry point or having concerns about ExtJs4
What does the project include and what I did:
Using the Non-MVC Desktop example and put it on top of my Zend Framework backend, I managed to convert the functionality from the Non-MVC example to an MVC example. Because the MVC Example does not have a real backend, there were many design decissions to make, how to couple frontend (ExtJs4) and the Backend(ZF), but still be open to other web elements.
Well, the open part is a bit missing or I did not test them, but I managed to setup up a Rights Management System (ACL) that can be used on pure Backend Projects (pure Zend Framework websites) and also be usable in the Webdesktop System with many virtual Modules as I call them (Applications in the Webdesktop).
To control the Access/Rightssystem I developed an Zend Framework driven Admin Website and an Admin Module in the Webdesktop.
Of course you are more interested in the frontend.
In my ExtJs4 implementation I tried to use as many new elements of the new version as possible.
- strict Ext.define / Ext.create / Ext.widget usage (I think I never used Ext.extend or var x = new XYZ)
- Class Configuration System (and using automatic Configproperties setters and getters)
- of course the MVC pattern and what I think that Sencha intent to use it
- all listeners in controllers (2-3 afterRender exceptions, completly without Ext.getCmp())
- views seperated from model / stores / controllers
- model definition with validations and convertions
- some data abstractions uses associations
- sorting and grouping stores
- grids with stores and request through proxies
- grids with roweditor + writer proxy
- forms that use data from records from grids store
- and much more
As I said before, this is only a small milestone. The last two weeks I did a complete code review and placed everywhere @TODO or FIXME tags. I counted more than 220 only in the Frontend part I'm tagging this release v0.1 (alpha).
The next steps:
- Register to github and share the complete code
- start fixing issue
- listening on feedback and new bugs, then try to fix them too
- Unit Testing (Really need help on this Topic, Zend Framework and ExtJs)
- Deploy process (create minified version, maybe with rewriting Sencha SDKs Tools to fit the needs)
- create some Webdesktop Modules
Here is the URL for an online demo version:
Important: In the Demo you have full rights. I didn't include any hacks to assure, that the admin kills himself in the ACL.
With the next release and the updated demo version, I will incude that. So please be aware what you are doing!
Example: Deactive the admin user, deny all access to admin controller for the admin role and so on will break down the whole demo for everyone!!! If you accidently did this or you discovered that someone did this, drop me a PM and I will reenable the system.
There are 2 Users: Admin and demo.users
Differences: the Admin can see and use the AdminModule, the DemoUser only the SettingsModule.
The full source code release (Front+Backend) should be on the weekend. I think I have time for this.
My wish and desires, beside the GPL License:
- If you find a bug, report it (forum or later github)
- If you know something about unit testing and you have some hours left: please explain it too me with examples
- If you know a better way to do something, my ears are open
So, a lot of text till now, but some criticle bugs right now:
- With IE7 the webdesktop is not loading, (IE9 works, I think. No change to test IE6/8)
- misspellings everywhere (english not my first language as you figured out with this text )
GitHub to download the sources:
2011/08/08: Added github
2011/08/09: Restricted the demo for above described reasons (full permissions isn't good for a demo )
Last edited by Nickname; 9 Aug 2011 at 10:06 AM. Reason: added github
5 Aug 2011 4:30 PM #2
- Join Date
- Mar 2007
- Gainesville, FL
- Vote Rating
Very well done sir!Mitchell Simoens @SenchaMitch
Sencha Inc, Senior Software Engineer
Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/
Need more help with your app? Hire Sencha Services email@example.com
Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!
When posting code, please use BBCode's CODE tags.
9 Aug 2011 7:54 AM #3
9 Aug 2011 7:55 AM #4
Demo page broken
This webpage has a redirect loop
The webpage at http://extjs.classphp.de/auth/login has resulted in too many redirects. Clearing your cookies for this site or allowing third-party cookies may fix the problem. If not, it is possibly a server configuration issue and not a problem with your computer.
Here are some suggestions:
9 Aug 2011 8:39 AM #5
Thanks for reporting.
default user was deleted and if there is no user to map the ACL rules... you experienced the results :| Adding to bug list...
Should work again (and I have to think of some protection for the demo)
14 Aug 2011 12:04 AM #6
I'm also working on a desktop (CodeIgniter in the backend) with the MVC pattern, at the moment I'm working on the ACL. You can see a demo here:
And the code here:
The code of the applications are loading when the user clicks in the main menu or in the shorcuts.
12 Oct 2011 11:02 PM #7
First of all thanks for the post as my situation is the same like yours...first project in zend as well as in ext js 4. So you can imagine my situation now a days.
I tried the link you have given for live demo. On that link i was able to login and access administration panel but when i clicked on web desktop i am getting the blank page.
Can any body tell me the reason why i am getting this issue?
waiting for your quick response.
when i tried this application in IE here are the screen shots of errors i got.
13 Oct 2011 11:24 PM #8
the problem could be caused by several problems.
First thing is, that I did not get it to work with IE6/IE7 (IE8 not tested).
When I tried to get it to work with IE7, I started to refactor the whole project and found several problems, which I could not resolve (extjs bugs!).
In this process, beside the IE* problem, I found a clean solution with ZendFramework for the complex ACL solution I build at that time.
But digging deeper into ZF and learning more about that framework, I discovered a lot, unfortunately drawbacks for this project.
Another thing is the evolution process of extjs4. For several weeks now, I stopped working with extjs4 and I am not writing in this forum anymore.
There are *so many* bugs and conceptional problems and I'm not even talking about performance. As a GPL user I cannot track fixed bugs in minor releases and Sencha does not tell, how a workaround looks like. So I have to live with those bugs. That means, that I cannot enhance and stabilize the project.
Long story short: This project won't be updated anymore.
I found my happiness with Symfony2 and currently I try to beat the learning curve ZF seems so overcomplexed (with all their view/action/form/xyz helpers), missing builtin Doctrine2 support and I could not get php 5.3 namespaces to work smoothly. ZF will fix this all in 2.x, I'm sure, but I think ZF does not fit my needs.
So, development started from zero based on Symfony2 and I will use ExtJs4.1 (if it will be released in some weeks) as new base for the frontend.
The source on github is not affected by this big refactoring I wanted to perform.
Perhaps you grab a copy of that, and try to run it locally.