Widgets and IDEs

IDEs are tools that help developers to write code. When discussing which IDE is best amongst die-hard devs, it should always include “what it is best for” as well, or you will find yourself enveloped in a blazing bias flavour flamewar before you can grab a hose.

All tools are useful and serve a particular purpose, and depending on what your pragmat-o-meter reads, you will probably also have a preference which will incline you towards one tool and not the other and will make your choice invulnerable in a flavour argument. Here is my preference of IDEs as far as only Widget development goes.

Its a wise choice when choosing an IDE to include as much introspective, autocompletion, compile-as-you-code and code highlighting capabilities as possible to make you productive, especially if it feels painful if you are used to developing at the speed of Mendix. So looking at the top contenders out there, I discovered the following 2.

Eclipse

First I used Eclipse, or rather Aptanana in my case. Many of you do and probably will end up using a version of Eclipse since you might already use it for coding JavaActions. Its free, community driven and supports many plugins to help you develop your javascript. Its a very competent IDE, however support for Dojo specific introspection and code completion is lacking. This is the framework Mendix uses for its widgets.

Webstorm

“Inadequate IDEs lead to fear and frustration. Fear and frustration leads to anger; Anger leads to the Dark Side.”

My colleague, who I shall refer to as Yoda, ended up introducing me to light side of the force; Jetbrains‘ Webstorm IDE. I owe him many thanks as this turned out to be the best choice for what I needed (and more).

Jetbrains has the ability to load external Javascript libraries to provide you with code introspection and documentation. Mendix uses version 1.6 of Dojo, so thats really nice since the latest libraries differ slightly in their APIs and code support might fumble you in unexpected places. Registering this cpability was really easy.

Webstorm checks your code for syntax errors, gives you warnings for when you do stupid things and understands the way Dojo constructs its widget scaffolding. But the 1 thing I love doing with Webstorm is the ability to refactor my code, very much like Eclipse does, though better when it comes to Javascript development. I will cover a range of refactoring tips once we get a real project going.

Also, when coding widgets you might end up doing some CSS for styling your widget, which is no problem for Jetbrains’ IDE.

The down-side is you have to purchase a license, but I don’t see this as a problem, as Jetbrains is a closed-community and is championed by developers with a clear roadmap, which lends it a more focused application and direction and gives you the value for your money. Its built by developers for developers and I’ll uncover some of its secrets in future posts.

I would also like to hear your comments on which IDE you prefer and why?

Posted with Blogsy

Where the Widgets’ Things Are

Widgets can be wild if you have never encountered them in their “native” habitat before, but once you’ve learned the knack of assembling them, it becomes quite fun. All you need is a little guidance.

“Where to begin” is a good question to ask yourself before you start. For which the answer you don’t have to pay the steep schooling fees of “learning by your own experience” for, as learning from others’ experience is far more profitable.

In my experience, it was overwhelming in the beginning. You don’t know quite where to focus your attention first to get the most out of it. If you are like me, you’ll be slightly more inclined to be pragmatic and want to learn by examples rather than first following the formal theory. If however you want to get your toes wet real quick, get some direction or you will most likely write dirty code that you will throw away the moment you are done with it. So lets see what we need for our adventurous embarkation.

You need some basic Javascript experience or have at least 1 language under your programming belt. Thats pretty much what is required for a start. That and obviously an idea; it helps if you know what your widget will do, otherwise you’ll just be pecking about senselessly amongst the sea of information.

Now that you have some Javascript savvy and you know what you’d like to craft, you are now going to want the following documentation open for reference:

• Version 1.6 of the Dojo documentation. I strongly recommend you master or bend your brain around dojo.hitch and dojo.partial. This is critical for meaningful event handling and callbacks. dojo.query and all the other basics are required, but demands less ramping up. There are some functional aspects to the toolkit which you might want to understand. So take your time on this bit
• Then you might find the Mendix client-side API vital to your expedition
• Mendix’ Widget XML reference guide for practical examples and how-to documentation
• The Widget XSD is the schema that Mendix uses to validate what you put into a widget’s declaration
• Lastly some example XML schema. Is invaluable to start from some other example.

These are the basic references we’ll need before we touch a bit of code or sort out our tools.

Stay tuned for our next episode on widget development for Mendix.