AMD in Javascript

AMD stands for Asynchronous Module Definition. In a nutshell, it’s a format or a specification for writing javascript.

So, what is a Javascript module?

Its a reusable code which exports specific objects, making them available for other modules through dependency references to be used their programs.

These modules can be loaded asynchronously, if desired.  That means, there’s  a huge improvement in website performance as the files are only loaded when they are needed.  Also, it provides developers with the flexibility to define order in which module dependencies have to be loaded and load multiple javascript files during runtime.

AMD implementation is used by jQuery, Dojo, Firebug etc. There are various javascipt module loaders like RequireJS,  Browserify,  Webpack, SystemJS


Bower Power

What is Bower?

A web site is made of lots of things — frameworks, libraries, assets, and utilities. But keeping track of all these libraries and making sure they’re up-to-date can be tricky. Bower manages all these things for you. So, we can call bower to be a package manager for the web.

What bower can do?

Bower can manage components that contain HTML, CSS, JavaScript, fonts or even image files. Bower does not  minify code or do anything else – it just installs the right versions of the packages you need and their dependencies.

Getting things done with bower

Installation : Bower is a command line utility, it can be installed easily using npm, the node package manager.

$ npm install -g bower

Searching packages :

$ bower search packagename 

Installing packages :

$ bower install packagename 

Listing packages :

$ bower list

Updating packages :

$ bower update packagename 

Uninstalling packages :

$ bower uninstall packagename 

We can save and install multiple packages using a single command by creating a bower.json file for your package with

$ bower init

Once we have got your bower.json file set up wecan simply execute the bower install command to install all of the packages we have specified in bower.json file.

And that’s the bower power!

Braille script

Braille is a writing system used by visually impaired and it is named after Louis Braille, the French man who invented it. The Braille system uses a set of raised bumps or dots that can be felt with a finger.

Braille writing system consists of raised dots arranged in “cells.” A cell is made up of six dots that fit under the fingertips, arranged in two columns of three dots each. Each cell represents a letter, a word, a combination of letters, a numeral or a punctuation mark.


What is a BLOb?

BLOb, Binary Large OBject : is a collection of binary data stored as a single entity in a database management system. Blobs are typically images, audio or other multimedia objects. Database support for blobs is not universal. Blobs were originally just big amorphous chunks of data invented by Jim Starkey at DEC(Digital Equipment Corporation)

The four BLOB types are

  • TINYBLOB : A BLOB column with a maximum length of 255 (28 – 1) bytes. Each TINYBLOB value is stored using a one-byte length prefix that indicates the number of bytes in the value
  • BLOB : A BLOB[(M)] column with a maximum length of 65,535 (216 – 1) bytes. Each BLOB value is stored using a two-byte length prefix that indicates the number of bytes in the value.
    An optional length M can be given for this type. I
  • MEDIUMBLOB : A BLOB column with a maximum length of 16,777,215 (224 – 1) bytes. Each MEDIUMBLOB value is stored using a three-byte length prefix that indicates the number of bytes in the value.
  • LONGBLOB : A BLOB column with a maximum length of 4,294,967,295 bytes or 4GB (232 – 1). Each LONGBLOB value is stored using a four-byte length prefix that indicates the number of bytes in the value.

Three.js for 3D graphics

Three.js is a JavaScript library used to create animated 3D computer graphics on a Web browser. Three.js uses WebGL also known as Web Graphics Library. Therefore, Three.js doesn’t have to rely on proprietary browser plugins. It runs in all browsers supported by WebGL. Three.js is mostly used in gaming applications and simulation authoring tools.

Three.js includes the following features:

  • Renderers: WebGL, <canvas>, <svg>, CSS3D, DOM, Software; effects: anaglyph, crosseyed, stereo and more
  • Scenes: add and remove objects at run-time, fog
  • Cameras: perspective and orthographic, controllers: trackball, FPS, path and more
  • Animation: morph and keyframe
  • Lights: ambient, direction, point, spot and hemisphere lights; shadows: cast and receive
  • Materials: Lambert, Phong and more – all with textures, smooth-shading and more
  • Shaders: access to full WebGL capabilities; lens flare, depth pass and extensive post-processing library
  • Objects: meshes, particles, sprites, lines, ribbons, bones and more – all with level of detail
  • Geometry: plane, cube, sphere, torus, 3D text and more; modifiers: lathe, extrude and tube
  • Loaders: binary, image, JSON and scene

When to use : JPEG, PNG, GIF

They say “A picture is worth thousand words”. Yes in this digital age, images fill up our cellphone gallery, mailboxes, take up computer memory space and revolve around us everyday, be it web, mobile messengers , magazines or newspapers. When working with digital image files there are certain file types to be used for each circumstance.

PNG, JPG, GIFJPG or JPEG(Joint Photographic Experts Group), pronounced as jay-peg has a 16-bit data format and can display millions of colours.

  • It uses a very complex compression algorithm to reduce file size. Called as Lossy compression for the lost data.
  • Used when a small file size is more important than maximum quality
  • Standard file format of most digital cameras
  • Compatible across multiple platforms and other programs(web browsers and image editors)
  • Best Uses: Still images only, real-world images like photos, complex colouring, shading of light and dark

GIF(Graphics Interchange Format), was created by CompuServe to transfer images across slow connections.

  • Uses 256 indexed colours. Also, uses dithering, a process where two pixel colours combine to make one to reduce the number of colours needed
  • Allows for single-bit transparency, one colour can be chosen to be transparent.
  • Can be animated, uses lossless compression – no data loss
  • Best Uses: Web graphics with fewer colours, small icons, animations, simple images

PNG(Portable Network Graphics), pronounced as ping or P-N-G. Lossless compression, so no data loss. There are two types in PNG, i.e. PNG-8 and PNG-24

  • PNG-8 uses 256 colours and 1-bit transparency, is very similar to GIF but file size is smaller than GIF files
  • PNG-24 uses 24-bit colours similar to JPEG, can include over 16 million colours, lossless compression means larger files than JPEG
  • PNG files allow transparency to be on a scale between opaque and completely transparent. These images can be put on any colour background and maintain original appearance.
  • Best Uses: Web images such as logos, which involves transparency and fading

And the code says “Debug Me”

This is a modified funny song, specially for computer science background nerd. (to be read/ sung with tone of Let it be by Beatles) The scenario is like this, your code is written and in is in last stages, like almost about to finish and you have started getting some unexpected list of errors.

When I find my code comes in lots of errors,
Google and Stackoverflow come to me,
Giving handy tips of wisdom
“Debug me”

As the deadline approaches,
And bugs are all that I can see,
Somewhere, someone whispers
“Debug me”

Debug me, Debug me,
Debug me, oh, Debug me.
Code may become dead and buried,
Debug me

I used to write a lot of code,
  It used to work flawlessly.
  But now it all says
“Debug me”

If you’ve just spent hours
coding initially,
Soon you will be glad to
Debug me

Debug me, Debug me,
Debug me, yeah, Debug me.
Use new test cases.
Debug me

Debug me, Debug me,
Debug me, oh, Debug me.
Reviewer won’t quite accept it.
Debug me.

Debug me, Debug me,
Debug me, yeah, Debug me.
And all the code says is
Just Debug me.