I just finished up a blog post with some tips for Sencha Touch beginners. You can check out the whole thing here if you like (it's too long to post here directly), but here's a very quick summary:
1. Understand the MVC structure and how views interact with controllers
2. Don't put everything in one controller
3. Skip the Sencha Touch native packager, go straight for PhoneGap
4. Have a good testing and debugging setup
5. Keep performance in mind
6. Use SASS and Compass
7. Connect with other Sencha Touch developers
I thought it'd be cool if we could get a bit of a discussion going here - what are your tips for Sencha Touch beginners?
- Don't prematurely optimize. Sencha Touch adds a crap-load of dom hierarchy, but don't waste your time recycling list item elements with custom listitem components etc. - just wait for Sencha's solution to layout woes.
- When you encounter faults in the framework (e.g., persisting associated records in formpanels), come up with a general solution - take the time - rather than charging through and creating spaghetti code.
- Match your sass file structure to your js file structure.
- As you develop, you should be creating a healthy library of "Ext.[whatever]ux" code, saving yourself some time over the long-run.
- Don't overnest. Don't overnest. Don't overnest. You have no idea how much dom hierarchy is created...
- Don't use images - use font icons for resolution independence: ionicons.com and icomoon.com
- Design for your smallest form factor first, then design for larger screens. Not the opposite way around - you don't want to try to scale down a desktop app to the phone!
- Don't be afraid to extend the default classes (e.g., Ext.data.Model, etc.) with your own classes and then extend from those classes. I haven't written a proxy config in years because I have a consistent backend REST api and a custom base class for all models. There are other benefits too.