JavaScript for Line of Business Applications

There seems to be a community forming behind Aurelia, so I figured I'd give it a try and build something of manageable complexity. I landed on a treeview component since it requires me to touch upon several of the different binding types in addition to recursive templates. The treeview supports recursive rendering of a few U.S. states with cities and boroughs. There is also support for expand/collapse of nodes with children.

Aurelia is a modern framework, with support for ES6 out of the box, which requires some setup to get transpiling and the rest of the development environment up and running. In order to simplify the process I recommend downloading the provided skeleton project and use it as a baseline. Aurelia is still a new framework, but the documentation on their website is already impressive and answered most of my questions.

Durandal is a lightweight JavaScript framework designed to make building Single Page Applications (SPAs) simple and elegant. It has strong support for MVC, MVP and MVVM so that no matter what type of front end architecture you prefer, Durandal can handle the task.

With RequireJS as its base and a thin layer of conventions, Durandal can provide amazing productivity while helping you to maintain SOLID coding practices. Pair that with out-of-the-box support for rich UI composition, modal dialogs, eventing/messaging, widgets, transitions, routing and more....and there's no doubt you'll be able to build whatever apps you can imagine.

The web is changing. JavaScript frameworks like Durandal are rising and more and more applications are created this way, offering excellent user experiences. But, is the web ready for this movement? Let's just say that it's a "work in progress".

There are a lot of things we have to be aware of when developing a dynamic JavaScript application and one of the most important things is SEO. When we develop a Durandal application and make it available to the world, one of the first things we would like to see is the application being indexed by google. But without any configuration, the only thing we will see indexed is the root page of our site. What's the problem? I created one of my best web applications, the users love it, it's quick and optimized...but nobody can enjoy it because google can't see it.

What googlebot can see is our index page and nothing more, and the reason is because our content is generated dynamically and the web hasn't traditionally worked this way. We may think "times are changing" and Google should be aware about this...and of course it is. But to take advantage of it we have to make some changes in our application first.

In this hands-on lab you will learn how to build a simple multiple view Single Page Application (SPA).

You will start by building a simple html page and add jQuery, RequireJS to make it dynamic. Then you will add Durandal and Knockout to extend the single html page into a SPA that has a shell and two additional views and a navigation menu to navigate between the two.

 this hands-on lab, you will learn:

I’m going to do a longer series here about how to create a dynamic menu bar system with Durandal, Knockout, and Twitter Bootstrap.  This menu bar is going to emulate the traditional desktop application menu bar you find in apps (like the File, Edit, or View menus, for example).  The special thing here is that it will be 100% dynamic.  This will allow interesting scenarios such as dynamically altering the application menu when the application is in a different mode or allow something like plug-ins to alter the menu structure adding new commands.

Durandal stitches together Knockout, Sammy, and RequireJS to make it easier to use these technologies together.

In this blog entry, I want to provide a brief walkthrough of using Durandal to create a simple Single Page App. I am going to demonstrate how you can create a simple Movies App which contains (virtual) pages for viewing a list of movies, adding new movies, and viewing movie details. The goal of this blog entry is to give you a sense of what it is like to build apps with Durandal.

Aurelia employs several strategies when observing object properties. The best strategy is chosen depending on the features of the browser and the type of object/property being observed. Here's a run-down of the techniques used, in order of priority.

Single-Page Applications (SPAs) are Rich, Responsive Web apps that load a single HTML page and dynamically update that page as the user interacts with the app.

This code sample gives the demo application for creating Single Page Application using Hot Towel SPA Template (Knockout, Durandal, Breeze).

This application will be useful for understanding the basics of Single Page Application in some extend. If you follow and create the application your own, it will give great experience on SPA. 

This code sample describes step by step creation of My Contact project using MVC 4 - Hot Towel Single Page Application Template.

I am explaining the step by step creation of My Contact project using MVC 4 Hot Towel SPA and I have written inline comment in the source code for better understanding the code. In this web page I am concentrating on steps for creating this application. 

Here’s the deal, I like DurandalJS. Though, I’m not going to lie, I really like AngularJS as well. These two technologies compete in many respects as they both seem to tackle the same problem. What problems are these frameworks trying to tackle? I have made a diagram of what I see to be the core developments in client side technologies, and after you view this, I will talk about where I see Angular and Durandal fitting in (note that there are a myriad of other useful frameworks that do storage, pub/sub eventing, animation, data-binding, AMD pattern ala requireJS, and a slew of other things, but this represents what I believe is the focus on today’s client-side development).

Odds are you have been asked recently: “How does KnockoutJS compare to AngularJS?” There seems to be a lot of attempts to compare these two awesome libraries. We can certainly compare them, but will this really get you where you want to go?

If you hear this question, ask “why” the person is asking it. If s/he wants a JavaScript/HTML based presentation framework then suggest that you compare Durandal to Angular. Why? Because Knockout is at heart a data-binding library, while Angular and Durandal are presentation frameworks. This is a hugely important concept to grasp, so let’s break down what’s at the heart of these questions and how Knockout, Durandal and Angular approach them. But let’s be clear: Knockout rocks. Durandal rocks. Angular rocks.