Sunday, August 10, 2014

AngularJS–Part 16 - Forms

This post will discuss about data entry in an Angular application and analyze what Angular has to offer us in this regard.

Read More

AngularJS–Part 15 - End to end tests and mocking

This post will show how we solve the problem when we need to write an E2E test that involves connecting to and getting some data from an external service provider that is either not under our control or that we explicitly do not want to include in our tests.

Read More

Angular JS–Part 14 - End to end tests

Automated end to end tests are an important part of the continuous integration and continuous delivery cycle. Without automated end to end tests delivering a new release of an application becomes burdensome. Manual regression testing can take weeks depending how complex the application is. That implicates that code freeze has to happen a long time before the product is ready to be deployed or ready to ship. Not only does this slow down the development or improvement of the application, no, it is also very expensive.

Read More

Angular JS–Part 13 - Services

This post discuss about services and how they are constructed and tested.

Read More

AngularJS–Part 12 - Multi language support

Our application is a product used by many global companies and thus we support multiple languages like English, French, Spanish, German and more. The question is now, how does AngularJS help us to provide our product in all the necessary languages?

Read More

AngularJS–Part 11 - Promises

Using callback functions to achieve asynchrony in code becomes just way too complicated when you have to compose multiple asynchronous calls and make decisions depending upon the outcome of this composition. While handling the normal case is still somewhat feasible it starts to become very ugly when you have to provide rock solid exception handling.

Comes the Promise to the rescue!

Read More

AngluarJS–Part 10 - Intermezzo

This post shows how a simple REST API can be implemented.

Read More

AngularJS–Part 9 - Values and constants

Sometimes we need some data that is globally available but at the same time we do not want to pollute the global (window) namespace with the definition for this data. Angular provides us the value and constant services which can do exactly this. Values and constants declared in this way can be injected into any controller or service like any other dependency (e.g. $scope, $http, etc.).

Read More

AngularJS–Part 8 - More choice when testing

While digging a bit deeper into the world of testing in and around Angular I was made aware of testem, another awesome framework agnostic test runner. This test runner is extremely simple to setup and we are up and running in no time.

Read More

AngularJS–Part 7 - Getting ready to test

Test driven development (TDD) is very important when developing a web application with a rich client since JavaScript is a dynamic language and thus there is no compiler making sure that our code behaves like expected. Tests are our only safety net. Writing tests in JavaScript and running them in a browser is not trivial. Lately the situation has improved quite a bit. Still, to get up and running for the first time is a non trivial task.

Read More

AngularJS–Part 6 - Templates

In Angular when we talk of a template we really mean the view with the HTML enriched by the various Angular directives and the markup used for data binding (the expressions in double curly braces {{ }}). We can of course go a step further and not only regard a whole HTML document as a template but also any HTML fragment, often called partials.

Read More

AngularJS–Part 5 - pushing data to the server

This post discuss some specifics of the architecture of our enterprise application and what that means for the design of our Web client.

Read More

AngularJS–Part 4 - Accessing server side resources

AngularJS offers different built-in ways of communicating with a server. The service we want to discuss here is the so called $http service. It provides us an easy and elegant way to communicate via HTTP protocol with a web server. We get the $http service in a controller via dependency injection.

Read More

AngularJS–Part 3 - Inheritance

This post discuss the aspects of controller inheritance.

Read More

AngularJS–Part 2 - The controller

AngularJS strongly encourages us to separate concerns and put all logic/code into controllers and keep the view (the html page or html fragment) free from any JavaScript.

Read More

AngularJS Part 1 - Introduction

This is an introduction to AngularJS and is mainly meant as a reference for the development team.

Read More

An In-Depth Introduction To Ember.js

With the release of Ember.js 1.0, it’s just about time to consider giving it a try. This article aims to introduce Ember.js to newcomers who want to learn about this framework.

Read More

A Guide to Building Your First Ember.js App

We’ll build a simple Ember application to catalog your music collection. You’ll be introduced to the framework’s main building blocks and get a glimpse into its design principles.

Read More

Backbone.js Wine Cellar Tutorial — Part 3: Deep Linking and Application States

In Part 3, you add complete support for history management and deep linking.

Read More

Backbone.js Wine Cellar Tutorial — Part 2: CRUD

In Part 2, you add the code to add, update and delete wines. You leverage Backbone’s powerful REST integration.

Read More

Backbone.js Wine Cellar Tutorial — Part 1: Getting Started

In this three-part tutorial, you’ll create a Wine Cellar application. You can browse through a list of wines, as well as add, update, and delete wines.

In Part 1 (this post), you define the basic infrastructure. You create a “read-only” version of the application: you’ll be able to retrieve a list of wine and get the details of each wine.

Read More

Backbone.js for Absolute Beginners - Getting Started (Part 4: Routers)

You could build web application without using the routers. However, if you want to make reference to certain ‘state’ or location of the web application, you need a reference (link/URL) to it. This is where routers come to rescue.

Read More

Backbone.js for Absolute Beginners - Getting Started (Part 3: CRUD)

There are a couple of features that we could improve. Let’s implement the CRUD (Create-Read-Update-Delete) for the item list.

Read More

Backbone.js for Absolute Beginners - Getting Started (Part 2: Models, Collections and Views)

After completing this example app, you will have experience and basic understanding of all the modules of Backbone!

Read More

Backbone.js for Absolute Beginners - Getting Started (Part 1: Intro)

Backbone.js is a JavaScript framework, among many others, that is gaining special attention in the web development community because it’s ease of use and the structure that it provides to JavaScript applications.

Read More

Creating a simple YUI Application Framework and Node app

In this tutorial we are now going to implement a web app end to end using YUI and hosted in Node.  It isn’t actually going to do anything much, but it will illustrate everything you need to create a client and server in JavaScript using YUI App and Node.

Read More

MenuNav Node - YUI Plugin

The MenuNav Node Plugin makes it easy to transform existing list-based markup into traditional, drop down navigational menus that are both accessible and easy to customize, and only require a small set of dependencies.

Read More

Saturday, August 9, 2014

An Introduction to YUI

With jQuery dominating the JavaScript framework landscape, many newcomers aren't exposed to other JavaScript frameworks. The truth is that there are a plethora of excellent JavaScript frameworks available, like MooTools, Prototype, Ext JS, and...YUI! While not as well known as some of the other libraries, YUI provides a wealth of tools for the web developer.

Read More

ZebraTables

Long tables can be almost impossible to read. ZebraTables is an easy to implement MooTools class that provides alternate-row-coloring support, hover highlighting, and click coloring.

Read More   |   Demo

Quickboxes

Don't make your website visitors click a bunch of checkboxes. Quickboxes allows you to check multiple checkboxes in one mouse click and drag. I always recommend having a "check all" checkbox/link but many times your user will want to check a small range of checkboxes.

Read More   |   Demo

Milkbox

No photo-featuring website is complete without a good lightbox script. Milkbox is an all-encompassing lightbox script that's easy to implement and adds a classy animated element to your website. Use Milkbox for flash video, photos, and XML galleries.

Read More   |   Demo

Monday, August 4, 2014

AngularJS - The Customer Manager Application

The author discusses about the different features offered by AngularJS and how they could be used together to build a full-featured app.

Read More  |  Download

AngularJS - Demo App

The article discuss about the fundamental ideas behind AngularJS, and then focus on the specifics of the demo application that go along with this article.

Read More  |  Download

Your First AngularJS App

A Step-by-Step Guide to Your First AngularJS App

Read More  |  Download

Saturday, August 2, 2014

MooScroll

MooScroll is a MooTools 1.2 class that allows you to customize how the scrollbar looks on scrollable divs.

Read More  |  Demo

SmoothScroll

SmoothScroll allows you to smoothly take a user to a specific portion of a page. By default, the browser “jerks” you up or down in the page when you click on an anchor — SmoothScroll lets you define the duration that it should take for a link to be scrolled down to.

Read More  |  Demo

Moousture - A mouse gesture library

A mouse gesture library written soley in javascript with power and flexiblity to mould itself for you. Implemented on Mootools following the Object Oriented standards. Library is aimed to set out a future framework for mouse guesters for any browser including modern mobile devices.

Read More  |  Demo

AutoGrow

AutoGrow Textarea is a mooTools plug-in I developed that expands a textarea as the user types in text.

Read More  |  Demo

HTML5 Inline Edit with PHP, MYSQL & jQuery Ajax

Now a days, We are always looking for easiest way for people to interact with our Web Applications. I am going to tell you about In-Place Editing or Inline Editing. Popular websites like facebook wants their user to edit their profile information without having to navigate to different form.
HTML5′s new attribute called contenteditable , It takes care of inline editing automatically. We should write little jQuery code to send the data back to the server, so we can save it. Biggest advantage is we don’t need to create and toggle hidden forms.


jQuery Ajax Upload Previewer

Dynamic show preview of the selected image before upload it, by jQuery.

Read More  |  Demo

jQuery Cascading Dropdown Plugin

A simple and lighweight jQuery plugin for cascading dropdown.Dropdowns with dependencies will react based on the rules given, and fetch its own list from the server via Ajax.You can provide an array of strings or objects, or a function as the dropdown data source.

Read More  |  Demo

Add edit delete Rows dynamically using jQuery & PHP

Plugin to dynamically add rows to table using javascript remove rows number of times without refreshing a page even once and thats also with cool javascript animation.

This scripts turns table into editable grid, You can add new row, edit existing row, delete row also you can edit a single cell and all this happens with ajax so not even single page refresh required. This is configurable script so you can easily attach it to your existing page.

Droptabs : jQuery Plugin for Bootstrap Tabs

Jquery plugin for hiding Bootstrap tabs inside a dropdown, when viewport is too small.

Read More  |  Demo

CodeTabs - Touch Responsive Tabs

Codetabs is a great plug-in tabs when integrated gestrue swipe, move between slides really easy on desktop and mobile. No need to switch troublesome dropdown menu as the other plugin on the mobile. Same time create thousands of beautiful effects with built-in over 250 ‘out-in’ effects and ‘one’. Also, codetabs built-in responsive features, vertical tabs, flat and clean theme, powerfull API, 40+ templates html, 14+ positions, 100+ options, more and more.

Read More  |  Demo

Hash Tabs : URL-sensitive and hash-friendly tab plugin for jQuery

The ultimate jQuery tab plugin forhash-sensitive,WAI-ARIA-complianttabs.
Features:
  • Hash-friendly URLs, so your states are saved. Try refreshing!
  • Compatible with IE8 and up
  • Customizable and configurable. Use custom selectors for your tabs. Default uses nav and section elements
  • noscript-friendly. Works very will in non-javascript browsers. When tabs can’t be loaded, content feels like normal, as hashes are supported natively by the browser.
  • Customizable SASS styles.

Read More  |  Demo  |  Download