Hot on the heels of the Dojo 1.7.1 release, we are excited to officially publish SitePen’s 1.7-specific updates to not one, not two but ALL 55 Dojo 1.6 tutorials. As you can guess, this was no small feat given that Dojo 1.7 is loaded with significant changes that encompass best practices on the road to 2.0. We’ve revamped the full Dojo 1.6 tutorial series to cover, not only how to do the things you already knew, but to prepare your team and your web app for what’s to come.

Oh and of course, the tutorials are rewritten to take full advantage of the new Dojo loader’s support for AMD, and they lay a groundwork for preparing your application to be lighter and more modular than ever!

So raise your glass and toast with us to the completion and release of the Dojo 1.7 Tutorials and to the best JavaScript toolkit available for scalable web apps!

We stand ready to bring your code current to the latest release or kick off your project right out of the gate with Dojo 1.7! In addition to our dedication to Dojo documentation and tutorials we offer a comprehensive set of services to make your project a success!

Dojo Workshops – Learn Dojo 1.7 from the experts. We’ve posted a nationwide, 2012 workshop schedule that will exceed the expectations of developers and engineering budgets alike! If these dates and locations don’t work for you and your team, reach out to us about our private Dojo workshops.

Dojo Support – SitePen offers 5 different plans, all of which are provided to you by Dojo experts who will provide your team with the knowledge and experience necessary to support your web development efforts. Get pro-active and purchase a plan that will support your team with Dojo 1.0 through 1.7 and eliminate potential schedule-busting roadblocks on your path to success!

Development – Upgrading to Dojo 1.7 will improve your web application. If you know this to be true but don’t have the resources to make it happen, engage our development team to work for you and let us do what we do best – Make you look good. Contact us for a custom quote for your Dojo 1.7 upgrade.

Related posts:

1. The Year of Dojo is Here!
2. Dojo 0.9 Update
3. Everyone can “Ask the Experts”

SitePen offers beginner, intermediate, and advanced Dojo Toolkit workshops to make your development team as skilled and efficient as possible when creating dynamic, responsive web applications. Sign up today!

Most 2012 trend lists include 12 trends. (Get it?  12 in ’12.  Of course you do.).  Because we are not fond of adding unnecessary or filler content (read code), Dylan has come up with 11 trends for 2012.

1.  Mobile

Mobile will gain even more momentum in 2012.  There’s no doubt we will see many new APIs, development tools and capabilities in place to both build and install most any app as a web app rather than using native technology.

2.  AMD

Following on the increasing emergence of microtoolkits in 2010 and 2011, 2012 will be the year everything becomes an AMD module, making it easier for Dojo, jQuery, MooTools and other toolkits to play nicely together.

3.  Builders & Loaders

With so many modules, performance, loading and building will need to be optimized.  Use of package management will become increasingly important.

4… Check out the rest of Dylan’s 11 Trends for 2012! And don’t forget that SitePen’s got your back when it comes to implementing efficient and scalable solutions.  Contact us today!

Related posts:

1. We’ve (unofficially) declared 2012 as the Year of Dojo!
2. The Year of Dojo is Here!
3. SitePen at BlackBerry DevCon Americas 2011

SitePen offers beginner, intermediate, and advanced Dojo Toolkit workshops to make your development team as skilled and efficient as possible when creating dynamic, responsive web applications. Sign up today!

Dojo has long provided support for declaring widgets and specifying other information directly in HTML. This support makes it extremely quick and easy to get an application started. You can start instantiating widgets by adding attributes to HTML elements before even writing any code. This is not only a very convenient tool, but using a declarative approach to binding widgets to elements can be viewed as cleaner and more organized than using the imperative mechanics of JavaScript. Widgets declared in markup have an encapsulated construction, avoiding instantiation that requires spanning and synchronizing HTML and code manually.

However, the use of Dojo’s declarative tools has been avoided by some because it uses custom attributes that are outside the HTML specification. While this approach works in every browser on the market and is implicitly allowed, it does not validate against the HTML4 validators. Now, the new HTML5 specification provides a namespace for custom attributes. The data-* attributes are available for libraries and authors to use for their own purposes and extensions while still having validating markup. The HTML5 specification further recommends that library use a sub-namespace for their custom attributes to avoid conflicts with other code. All of the Dojo custom attributes begin with data-dojo-. Let’s look at the new Dojo attributes.

The data-dojo-config attribute replaces the djConfig attribute on the dojo.js script element to allow for declaration of Dojo’s configuration properties. Here we can specify settings like parseOnLoad, and isDebug. For example, we can load dojo.js with configuration information:

<script src="dojo.js" data-dojo-config="parseOnLoad: true, isDebug: true"></script>

The new data-dojo-type attribute replaces the dojoType attribute to specify the widget class to instantiate a target element. We can add the data-dojo-type to an HTML tag and the Dojo parser will create a widget on that element. This works in conjunction with the new data-dojo-props which replaces the attribute-to-property mapping previously used by the Dojo parser. We can also use the new data-dojo-id to create a new globally rooted variable to reference the new widget. For example, to declare a widget:

	<div data-dojo-type="dijit.Dialog" data-dojo-props='title:"My Dialog",
		onFocus:function(){ /* a focus event handler */ }'
		data-dojo-id="myDialog">
	</div>

This will create a new dijit.Dialog widget, with the title property and onFocus handler set. It will make the widget available from the myDialog global variable. Remember to have parseOnLoad set to true or explicitly execute dojo.parser() (from dojo/parser) after the page is loaded to ensure the widget gets instantiated.

Within widget templates, we can also use the new data-dojo-attach-event and data-dojo-attach-point as replacement for dojoAttachEvent and dojoAttachPoint to register attach points and attach event handlers. And finally, we can also use a data-dojo-event to define the event to register for <script type="dojo/method"> scripts.

Even when leveraging the new HTML5-valid custom attributes, there are still pros and cons to declaring widgets within HTML instead of with JavaScript. Declaring JavaScript components from within HTML introduces semantic impurity since the HTML is no longer purely semantic markup, but includes tight coupling to particular visual components. The declarative approach also incurs extra CPU cycles because dojo.parse() must traverse the DOM tree to find elements with Dojo custom attributes. Programmatic instantiation avoids unnecessary cycles and preserves semantic purity of HTML. However, markup-based widget declaration still has a powerful advantage by allowing us to define and create a widget in a single place, facilitating rapid application development and progressive enhancement with minimal effort.

Dojo still provides backward compatibility with the old custom attributes, but the new data-dojo-* attributes leverage the new HTML5 specification to provide fast and efficient declaration of widgets and configuration with clean and validating syntax.

Related posts:

1. HTML Widget Prototyping with the Dojo Toolkit
2. Dojo Charting: Event Support Has Landed!
3. Dijit: Prepackaged

SitePen offers beginner, intermediate, and advanced Dojo Toolkit workshops to make your development team as skilled and efficient as possible when creating dynamic, responsive web applications. Sign up today!

Welcome to 2012 – The Year of Dojo!  We are expecting an amazing year! Make SitePen your one stop shop for all of your web application needs; Dojo workshops, JavaScript support and web app development.  Together, with SitePen, you will meet your 2012 goals!  When you’re happy, so are we.

Learn Dojo - We are dedicated to providing you with the highest quality Dojo Toolkit workshops in the industry.  Whether you want to learn the basics of Dojo or sharpen your Dojo skills, we have a workshop just for you.  All of our Dojo Workshops are taught by our Dojo experts.  We promise you won’t be subjected to listening to some trainer who can’t live without his slides.  Wondering if our Dojo Workshops will cover Dojo 1.7?  The answer is yes!

Ready to learn Dojo?  Check out our full list of 2012 workshop dates and locations.  Sign up for any of our 2012 Dojo Workshops by January 31, 2012 with promo code IHEARTDOJO and get 10% off!

Here to help - Did you know we also have support plans to fit every size and every need?  No matter which support plan you choose, our expert engineers will help you by answering questions, resolving bugs, and solving problems. We offer no-hassle ways to get in touch with your SitePen Support team, which means no waiting on hold, or having to explain your issue over and over again until you get to the right person.  With us, you always have access to the right people. If your project runs in to a critical issue, our expert SitePen engineers will jump in to help you quickly get back on track. Oh, and yes, all of our support plans include support for dGrid and Dojo 1.7! Having a SitePen Support plan is preparing for possibilities.  Even football teams have backup quarterbacks.

From 2 support hours to 200 support hours, SitePen has a support plan to fit your needs.  Take a look!

Perfect match of design and development - We are your one stop shop for your next project, including mobile web applications! Our expert team will take your web application from concept to launch.  We’ve mastered the front end and are here to help you build powerful, simple, and usable web apps, every single time.

Whether you need a traditional web application, mobile web application or installable mobile web app store application, SitePen can help!

Still not sure how we can help you?  Contact us today! (You can even call us if you want.)  Celebrate 2012 – The Year of Dojo!

Related posts:

1. Eleven Trends for 2012: The Year of Dojo
2. We’ve (unofficially) declared 2012 as the Year of Dojo!
3. Dojo 1.7 Tutorial Update

SitePen offers beginner, intermediate, and advanced Dojo Toolkit workshops to make your development team as skilled and efficient as possible when creating dynamic, responsive web applications. Sign up today!

Dojo 1.7 introduces a new JSON module available at dojo/json. This differs from the legacy dojo.fromJson and dojo.toJson in that it is based on the new native JSON API in the JavaScript language (introduced in EcmaScript 5). It also delegates to the native JSON parser and serializer when they are available, providing the fastest possible execution for any given browser.

Using the new API is very easy, and should be familiar if you have used json.org’s library or the browser native library. We get the JSON object from the “dojo/json” module and then can use the parse and stringify methods. For example, to parse JSON:

define(["dojo/json"], function(JSON){
  var jsonStr = '{"name": "value"}';
  var object = JSON.parse(jsonStr);
  object.name -> "value";
});

Again, note that this will use the native parsing facilities of the browser/platform if they are available, otherwise they will use the library implementation.

To reverse the process and serialize an object to JSON:

define(["dojo/json"], function(JSON){
  var object = {"name": "value"};
  var jsonStr = JSON.stringify(object);
  jsonStr -> '{"name": "value"}'
});

The new JSON module now properly serializes dates. While previously, dojo.fromJson incorrectly serialized dates as “{}”, serialization now conforms to native date serialization. Dates are serialized to the standard ISO format in UTC.

JSON.stringify({now:new Date()}) -> "{"now":"2011-06-13T19:02:19.650Z"}"

The new JSON module uses has() branching to determine whether or not to use the native JSON capability or not. This is not only a solid feature-detection based approach, but it means when you leverage browser-specific builds, the module is only a few bytes for modern browsers, particularly valuable for mobile applications.

The legacy dojo.fromJson and dojo.toJson will still be available in Dojo base, but it is recommended that you use parse and stringify functions from dojo/json now for better performance and standards conformance.

Related posts:

1. How Do You Serialize Dates from Forms to JSON with Dojo?
2. JSON Referencing in Dojo
3. JSON Schema in Dojo

SitePen offers beginner, intermediate, and advanced Dojo Toolkit workshops to make your development team as skilled and efficient as possible when creating dynamic, responsive web applications. Sign up today!

If you’ve been reading about Dojo 1.7, the first thing you’re probably wondering is, what is this AMD thing that everyone is talking about? Check out Dylan’s post at the Dojo Toolkit blog to “Learn more about AMD!“.

In addition to the useful links Dylan provides, you can also learn more about AMD at a SitePen Dojo Workshop.  AMD + Dojo 1.7= Awesomeness.

Related posts:

1. Dojo Public Workshops
2. SitePen at BlackBerry DevCon Americas 2011
3. SitePen. Dojo Skills. Seattle.

SitePen offers beginner, intermediate, and advanced Dojo Toolkit workshops to make your development team as skilled and efficient as possible when creating dynamic, responsive web applications. Sign up today!