View Full Version : SenchaFiddle - Sencha Touch IDE

8 Dec 2011, 9:33 AM
I have made my little contribution toward Sencha Touch believing this is the great thing for developing mobile applications. I realized folks really need such a thing because they like to share their examples on the go. Go ahead and give SenchaFiddle.com (http://senchafiddle.com) a try and comment here to tell me how do you feel about this.

If you would like to know on what other features I am working on for this fiddle, you can put your email in the comments so I may share the doc with you.

9 Dec 2011, 1:06 AM
Thank you, what a great idea. I did try jsfiddle before but it was annoying to use and not setup for MVC. Will there be an option for sencha touch 1 & 2?

Well done and I look forward to using it!


9 Dec 2011, 1:09 AM
Hey yeah, I have a full list of features I am going to get done with this. I can share the google doc with you if you can get me your gmail address.

9 Dec 2011, 11:56 PM

great idea ! You should keep on going developing this kind of IDE.

I'm curious to see whats come next.

It would be fine if the app would run inside an iPhone or iPad frame.
It would give the user a better feeling ;-)



10 Dec 2011, 1:43 AM
I wrote this for those who are interested to know what I plan to make it for. http://umairashraf.me/2011/12/sencha-fiddle-sencha-touch-ide-is-live/

11 Dec 2011, 1:35 PM
Awesome thanks for this Umair! =)

My #1 feature request is CoffeeScript support, http://jashkenas.github.com/coffee-script/

S (http://jashkenas.github.com/coffee-script/)hould be simple to add, I'd be happy to do it if your sharing the codez. Is this open source ? If not pls consider releasing it as such, development would progress far more quickly. I doubt it would hurt any possible commercial aspect for such an app if there is even any ?


11 Dec 2011, 4:16 PM
I had made it open source from start because I thought things will work great this way. But then I am in love with it and wants to develop every feature myself unless I am tired. I got too much energy these days. Once I'll be tired, I will update github with latest source code. There is a github for this but outdated.

For CoffeeScript, it looks good to me and I am going to include this in my list of features. Right now the most important thing is to create node.js utility for it to decrease server load and increase building and running performance. Once done, think CoffeeScript would be added too.

I have UIs for smartphone apps ready and need to work on the API. I got much time so everything's possible.

12 Dec 2011, 1:13 AM
If this was released as app for iPhone/ iPad I would buy it - if the app let me write apps offline on my iPad when on the bus to work :-)

Keep up the good work!

12 Dec 2011, 6:55 AM
I must test this on iPad before to comment on this but I have got the UI done for the iPod, iPhone, Android, Blackberry apps and will release soon.

12 Dec 2011, 12:26 PM
Thats great, thanks Umair!

Do you have a download link for the sources ? Is it on github ? I did a bit of a search but couldn't find it.

13 Dec 2011, 7:13 AM
Actually there is github but the source is way too outdated. I plan to share source once I would be stuck with other things.

14 Dec 2011, 11:19 PM
Guys like the page so you be informed about when it goes to github or the other news https://www.facebook.com/pages/Sencha-Fiddle/198459190241995

19 Dec 2011, 10:39 AM
Awesome work Umair! I'm using Sencha Fiddle to help my high school students play around with Sencha Touch, it's so nice to be able to get them started right away without spending 2 weeks on plumbing.

One thing that would be really helpful for you to add is this CSS rule to the preview HTML page:
img { -webkit-user-drag: none; }

This prevents images on the page from getting "picked up" when you drag them with the mouse pointer, so when you drag-scroll with mouse pointer it behaves the same way as touching does on mobile even when there are images on the page. I wish the standard Sencha Touch CSS included this but I guess they won't because it's only useful for debugging in the browser.

For example, this sample I made of a carousel full of images is pretty much unusable in the desktop browser without that CSS since you have to drag over an image: http://senchafiddle.com/#MSeG0

19 Dec 2011, 10:46 AM
On second thought, it would be even cooler to have a CSS tab you can add your own custom rules to

I would be happy to try contributing some code after you update GitHub with the current version

19 Dec 2011, 11:19 AM
you're Chris right?

Well you're right SCSS support is what I am starving to build right now. I was working on user based authentication so user may save their fiddles forever and make them private or public. I had to dig into OAuth for proper API. I was doing this for few days.

I was finding as how can I efficiently and effectively compile all those SCSS files to CSS with Compass as user presses Run and show the results very quickly. I read about node.js (as it runs on the client) would be used to compile SCSS to CSS at client side to keep the server healthy. I need to dig deeper into node.js before to say anything. Right now compiling SCSS to CSS is costly in terms or resources it's going to consume. You have suggestion for me here?

For now I am going to quickly add a support for simple CSS so you can add any sort of CSS right into the preview.

19 Dec 2011, 12:12 PM
And here you go with basic CSS support http://senchafiddle.com (http://senchafiddle.com/) sorry no SCSS yet but would do it soon.

27 Dec 2011, 4:40 AM
This is in Chrome now :)


31 Dec 2011, 5:41 AM
It goes to github! I will continuously update github now.