What Is ExtJS ExtJS 4+ Extensions Examples Tutorials


fiddle.sencha.com for ExtJS & Touch

Sencha folks have been working on an awesome new tool. It's called fiddle.sencha.com:



If you're familiar with jsfiddle.net, it's essentially the same concept, but targeted at ExtJS and Sencha Touch, with some tasty features thrown in, i.e. performance analysis:



Even though it's in beta, I've been using it for sometime now without much issue. Fiddle away!

VN:F [1.9.22_1171]
Rating: 9.8/10 (5 votes cast)
Tagged as: , No Comments

ExtJS 4.2 & Architect 2.2 – Plugins

I've been liking Sencha's Architect IDE more and more as it's been maturing over time. In my last post I wrote about making custom plugins in ExtJS 4, but how do you go about using them through Architect?

First step would be to ensure the we have the plugin code; I accomplished this by adding a JS Resource:


Next step should be easy enough; I figured adding a custom "plugins" property with a value of "["ux.fadeinplugin"]" on a given Panel would do the trick:

Add Plugin

...however, while this does work when tested in browser, this causes Architect's canvas to go blank, essentially rendering it useless. Upon further research, there are known bugs surrounding this, but no fix yet.

Read on for a workaround in Architect...

VN:F [1.9.22_1171]
Rating: 8.0/10 (5 votes cast)

ExtJS4+ “IntelliSense” in Eclipse :)

On Tuesday Sencha announced "Complete" and "Complete: Team" bundles, where of particular interest to me was the Eclipse "IntelliSense" Plugin (see Sencha's excellent video).

I tried it for myself - it's a pretty standard Eclipse plugin install:

There's an Eclipse tutorial for how to setup a project; it took me about 5 minutes. I got stuck in a few spots, but figured it out. I plugged in a basic Fieldset extension and look at the depth of auto-complete - it recognizes ExtJS object hierarchy in great depth:

There's also Eclipse help covering the great range of features. Overall, I was very impressed.

I use Notepad++, but this just might sway me to use Eclipse. Although, the $995 for the cheapest bundle option, is rather stingy. I really wish Sencha would offer this as a stand-alone product.

VN:F [1.9.22_1171]
Rating: 7.4/10 (7 votes cast)

Sencha SDK 2.0.0 Beta 3 :(

Last I worked with Sencha SDK it was still version 1.2.3 beta. I had many difficulties with it and decided it certainly wasn't ready, even for manual builds of my ASP.NET/ExtJS projects. Well, version 2.0.0 beta 3 has been out for a while now and I decided to give it a try.

The Good

I am now able to reference local .html files in the command line parameters. In last version I was only able to point it to an HTTP URL, which didn't work for my Windows-authenticated websites.

The Bad

  1. I am unable to reference a local Default.aspx file - I get an error saying "URI incorrect" or something of the sort
  2. When I made a basic .html page with references to my JavaScript code, in a project that uses ExtJS 4.1 auto-loader without issue, all I got were the following vague errors in the console, when trying to build:
ReferenceError: Can't find variable: Ext

  C:\Program Files (x86)\SenchaSDKTools-2.0.0-beta3\compat\scripts\phantomjs-jsb.js:299

The Verdict

Sencha says it's beta, so I would be very cautious about building any production code base with it. Even if you can get it to build, I'd run a full test pass on the resulting code.

VN:F [1.9.22_1171]
Rating: 7.1/10 (9 votes cast)
Tagged as: , 3 Comments

ExtJS4 Clean Custom Builds (3)

See Previous Example First!

Takeaway from this post: Sencha SDK Tools 1.2.3 are still beta and I don't advise using them in production. This is a follow up post to my previous examples - I spent some time the other day trying to set up a 1-click build process for ExtJS, and failed!

Custom Build File Size

First, let's talk about the incorrect file size shown on this screenshot in my previous 2 posts:

In the "Custom Build" example, the custom-built app-all.js is shown as being 120KB in size.  In reality, the file is about 400KB in size on the disk.  I don't understand why that is - compression? If that was the case, wouldn't the 1MB ext-all.js in the "Full Framework" example be something closer to 200KB? After some Googling I couldn't figure out how to tell if a file was compressed. Any advice here is welcome as I'm a bit lost.

VN:F [1.9.22_1171]
Rating: 10.0/10 (2 votes cast)
Page 2 of 3123