The back-end isn’t all of it and the front-end shows it’s power clearly. The back-end functionalities slowly move to the front-end these days and it will not be that far in time to have majority of what it was back-end code to come to the front-end without breaking the security notions.

From e-mail sending. to models and controllers, the web is moving totally to the JS/AJAX/HTML5 side (which is a very nice thing to hear, as some new frameworks let you build full blown web applications in minutes via the front-end). Let’s see our options in detail today. I am going to write an xbox huge article about it.

1 – Video.JS

This is the video script that i use on my video sharing platform. This video player falls back to flash player when HTML5 video play back is lacking, is easily customizable (themes, features), you can enable the auto-play option (like on YouTube). This is a very cool plug-in to use and i throughoughly recommend it.

2 – Uploadify.JS

This is a cool script that let’s you have multi-uploads with files with ajax responses. You will be able to upload multiple files, show the uploading progress, and have the users be able to cancel mid-upload. I see it as a disadvantage the fact that it uses Flash for uploadify.swf file, but nonetheless, it is a great addition to your website. I use this as my default video uploading script.

3 – Backbone.JS

Instead of employing something like a PHP framework for a simple website with just public data (like a list of products, some categories of them, latest songs etc). You don’t need any back-end for that. Just create some Backbone.JS models and you are ready to roll. With it’s built-in model system, you can insert, get data, modify it, or delete it via the client-side securely and easily. It just requires a little bit of JavaScript language (Mozilla has a great documentation on it, go check it out).

This one will speed up your development time + will give you an easy way to modify already created data.

4 – Angular.JS

Have you ever played with one of these templating languages in, say PHP, or ASP? The ones with the curly brackets, and all that cool stuff? I did it on Laravel, where in order to print a variable, you just had to write:

{{$variable}}

Then you were good to go. You were also able to get parent views, insert child views, get data from the database easily.

Now you can do all this via HTML. No joke. Our good old HTML (well, you still have to learn some new things).

What was really cool, in one of the videos created by the Angular.js developers, that you could do updates on models, and have these models viewed real time on the view part. Say you updated the “title” column, you would see the update live character by character, making editing information feeling like editing it in a text editor without having to save anything or wait at all. Simply amazing stuff.

5 – Kendo UI

Kendo UI is actually a very nice Model-View-Controller Framework in JavaScript that has a cool set of  HTML5 compliant widgets, that you will be able to bind your controllers from the back-end to communicate via AJAX (the coolest thing you can do for your website is to enable the loading of partial content, for example loading new messages on top of old messages for an user without him having to do anything manually, as in Facebook notifications).

With this framework, you are able to write mobile interfaces for your mobile users, allowing your users to be able to see your website while walking down the store in his pijamas and flip-flops. It has three components, one for mobile phones, one for the plain web, and one application interface. I ‘ve seen many frameworks like this, but this one simply tops them all with it’s partial content loading capabilities out of the box and widget richness.

7 – Twitter Bootstrap Java Script Plugins

There’s a beautiful set of javascript plugins for Twitter Bootstrap that make your Web UI richer, and that is implemented inside the framework known as Twitter Bootstrap. You have modals, accordions, tabs, and all the widgets needed, plus some simple JavaScript additions that will help you with your websites responsiveness, widget colors, certain features like parallax etc.

I myself used the Modals for my Video Uploading, Content Editing, and Deletion confirmation instead of creating different pages for every CRUD method and i am very satisfied to be able to do everything on the same page. It is really frustrating to switch pages back and forth, and refresh the page to see new comment. A combination of Twitter Bootstrap JS Plugins and partial content loading as i stated above will do wonders in your web application and will attract more visitors to your website (especially if your computers have a clear lack of partial content loading / ajax request usage for CRUD methods).

Another thing i liked at Twitter Bootstrap is that they have these cool little badges that you can implement within your message updating system (like in facebook, where it shows the number of pages). You also have pagination, breadcrums, beautiful alert windows, and some other things that without, you may not be able to give your website the feel that it is complete and able to compete with other websites that are in the same niche as you. You don’t want to give your competitors and edge by lacking UX, do you? 🙂

We’ll meet with other articles!