There are often cross cutting concerns in your app, such as logging, security checkpoints and or maybe business validations.

This is a very simple approach of implementing method interceptors in pure javascript.

The crux: This decorates all the methods for the given object with before and after interceptions.

intercept: function(o) {
 for (let p in o) {
 if (typeof o[p] === 'function') {
 let c = o[p];
 o[p] = function() {
 MIFactory.beforeExecution(o,...

Read complete blog post

Server side rendering need lots of configuration to get up and running if you choose to use boilerplate which is filled with package that you may not need, well next.js is developed to solve this problem and it makes server-side rendering in React a breeze

What you will learn in this article

  • Get up and running with Next.js
  • Add Client-side transitions between routes
  • How to do handle Ajax in Next.JS
  • create reusable component for rendering Layouts

To get started with you need two things Nodejs...

Read complete blog post

As an Ember developer, discovering Yarn package manager by Facebook was the best that could happen to me. Whenever one of my fellow developers encountered “Broccoli Plugin failed…” I used to say ‘rm -rf node_modules’, that’s what my seniors told me and I continued the tradition.

That was very frustrating and as a beginner, I use to blame it all on Ember as I didn’t understand much of what was happening. As time passed I realized npm was the culprit. But a few months back I discovered this...

Read complete blog post

Introduction

  • Image Cache is JS library used to provide a nice interface for locally storing images for offline apps using PhoneGap/Cordova.
  • This library is especially useful for mobile web applications using Phonegap/Cordova where image becomes stale (invalid) after normal offline navigation. therefore in this case we can not relied upon Normal Cache.
  • So by using image cache we can store images in the cache and replace the stale version of normal cache with fresh version of image cache.
  • This...

Read complete blog post

Cordova File Transfer plugin allows you to transfer / upload photos from mobile to server. You generally need a file with path for transferring / uploading files via File Transfer plugin.

More information on how to use Cordova File transfer plugin can be found here.

This plugin won't help much when we have a Base64 image (usually a drawing or signature drawn on canvas). To upload such images we can do:

  1. take your base64.
  2. write it to a file.
  3. then just use file transfer plugin to upload it to...

Read complete blog post

Recently we developed one feature where we wanted to present a new tab view for an existing smaller form interface whereby users can use the full screen of the new window to move around and use the feature with ease. While we were developing the feature, we came across few challenges and thereby few learnings which we thought would be good to share -

1. Caching existing values.

We have around 8-9 forms from where we can use this feature but each of them have different implementation based on...

Read complete blog post

Ruby Comments

There are basically two types of comments in Ruby. And they work in the same way as follows:

The block comment

The comment block is created with the =begin and =end delimiters.

def welcome
 =begin
 This will print the welcome message.
 You can also add your custom message.
 =end
 puts "Welcome to ruby comments learning :)"
end

The line comment

This is the simple comment where you place an octothorpe(#) as the first non-whitespace...

Read complete blog post

If you have used interpreted languages like Ruby, Python or JavaScript, then you know that semicolon ; is an optional delimiter to terminate the code instructions in these languages.

But for now, let us focus on JavaScript.


JavaScript, the language has this feature called Automatic Semicolon Insertion, often referred to as ASI.

Automatic Semicolon Insertion what it sounds like: If you don’t add a semicolon at the end of a line, the interpreter will add one for you while parsing your code.

...

Read complete blog post

You might have seen similar code in javascript. I wanted to understand how it is working. As it does not look like a ternary expression.

return {
 "false": React.DOM.a({
 href: "javascript:void(0)",
 onClick: this.linkClicked
 }, "Click Me Now"),
 "true": React.DOM.span({}, "You have clicked")
}[this.state.clicked];

While discussing with team we found that, it is nothing, but a SWITCH CASE

click her to see shorthand for js

So when we execute above...

Read complete blog post

Yesterday I was working on one of our portal (It's in Ruby on Rails and we have used quite alot jquery as well). Was integrating a nice Photo Gallery plugin on one of the page. Applcation is having many pages. Every page has some different behaviour and we have different jquery calls for that as per need.

For a performant application, we always want to avoid any unwanted calls to different methdods/functions. In my case, as I mentioned earlier I wanted to show Photo Gallery on a page and...

Read complete blog post

Easy way to create a numeric input, which accepts only numbers (i.e. 0-9 and no other characters).

app/components/numeric-input.js

import Ember from 'ember';

export default Ember.TextField.extend({
 tagName: "input",
 type: "number",
 attributeBindings: [ "name", "type", "value", "maxlength", "id" ],
 keyDown: function(e) {
 var key = e.charCode || e.keyCode || 0;
 // allow enter, backspace, tab, delete, numbers, keypad numbers, home,...

Read complete blog post

For displaying flash messages and other informative messages, we generally use Internationalization (I18n) in rails.

Sometimes we also need to write similar messages again in javascript/coffeescripts which can be difficult to manage if these message changes. And also it doesnt follow the concept of DRY.

To follow DRY, we need to make rails locales available in javascript.

One way to do it is to declare a global variable and have all locales saved to it as Javascript Object.

This is what we...

Read complete blog post

Why we need YAML parser.

As long as we are working in rails we will hardly face a situation, where we have to parse the YAML files in javascript.However when we are planning to work on node.js OR tideSDK where javascript is the heart of everything, then in that case we need something to parse the configs and then writing to configs if necessary.

There are many parser available to read the YAML. But there are very few which does the reverse good. I found just two plugins like that. One plugin...

Read complete blog post