JavaScript

GoodBye XMLHttpRequest; AJAX with fetch API (with Demo)

AJAX is a crucial part of any Web App. The primary way to do AJAX is through XMLHttpRequest. JavaScript has new fetch API which will remove the need to use the weird XMLHttpRequest

JavaScript

Brief guide to Map, Reduce, ForEach and Filter for Arrays

Loops are the important construct of programming language. More powerful is the looping, more things you can achieve in less time. Let's see how to iterate data with Map, Reduce ForEach and Filter.

JavaScript

JavaScript Template Literals & Tagged Templates

String formation from variables in JavaScript had been pain all the time. Not anymore; JavaScript Template Literals will save a lot of your time. Let's see the working & benefits of JavaScript Template Literals.

Firebase

Upload Files to Firebase Storage with JavaScript

Firebase; being a robust Realtime Database solution; it provides Storage of files as well. Learn how to upload files to Firebase Storage with JavaScript in simple steps

JavaScript

Generate instant previews for image upload

Quick and Easy solution to generate preview of images upload in vanilla javascript in callback and Promise style.

Web

Accessible Rich Internet Applications-ARIA

Accessible Rich Internet Application (ARIA) is way to ensure that Web Apps and Content is accessible to users with disability in similar or approximately similar way as to users without disability.

CSS

CSS/CSS3 Flexbox Layout

A quick and basic guide to CSS3 Flexbox layout and the ways to achieve simplest layouts with Flexbox

node.js

Introducing get-it-ready

Quickly create your documentation ready REST APIs on HapiJS and Mongoose with get-it-ready.

hapijs

Plugin architecture in HapiJS

Plugin Architecture will help you in creating your apps as a dependency and keeps the things separated. They provide effective context with server parameter

hapijs

Introducing hapi-response-time

hapi-response-time plugin will help in measuring the time taken by any api endpoint to generate the response & can be handy while debugging.

hapijs

Intro to HapiJS [v16]

HapiJS or simply Hapi is a framework for NodeJS to create HTTP based applications; framework’s name explains its purpose in a much better way; H(TTP)-API

JavaScript

Front End Tip: Watch Data not DOM

It will always be good to keep data as a single source of truth and make the DOM a reflection of it. This is what all major libraries are doing as well.

Firebase

Firebase CRUD operations with JavaScript and jQuery

Learn how to do Read and Write Data operations on Firebase Realtime Database i.e. Firebase CRUD operations with JavaScript and jQuery.

Firebase

Firebase Manual User Registration in Web API

User registrations with SDKs have been good but what if you wanna add users manually? Today we are going to see firebase manual user registration in its web API and restricting pages on the basis of logged-in state.

Firebase

Custom Router for Firebase jQuery App

The Routing is showing different information in the single webpage with the help of URL or URL hash value. Let's build a a custom router with jQuery and integrate it in Firebase Project

git

Introducing list-repos for git repositories management

list-repos utility list the repository directories and their active branches to quickly decide on the target directory to work on

Firebase

Auth Schemes in Google Firebase

Google Firebase offers many Authentication providers and here we will discuss Register and Login with Google, Facebook, Twitter, GitHub & Anonymous Login

frontend

FrontEnd Development Workflow

The Development workflow is always evolving and in my opinion it should keep evolving as we as developer are constantly growing.

ReactJS

ToDo app with ReactJS

ToDo app with ReactJS and Bootstrap CSS will walk you through the multi-component app. This will also set up a basic understanding of how the components communicate with each other

ReactJS

Intro to ReactJS

React is a new JavaScript Library to efficiently write the User Interface. It is also considered V in MVC architecture

JavaScript

Checking overlap between elements

Use this snippet to find the visual overlap between any two given elements with the help of getBoundingClientRect method of HTMLElement

AngularJS

UI-Bootstrap: Bootstrap with AngularJS

UI-Bootstrap is AngularJS module to enable the use of Bootstrap in AngularJS. It provides directives for all Bootstrap plugins along with some extra plugins like datepicker, timepicker etc

navigation

Basic guide to create off-canvas navigation menu

Hello friends! Today I am here with a guide to build off-canvas navigation menus for your website.Off canvas menus are handy UI elements if navigation items are fixed in count. It can also be used in the other case of varying navigation items but from the User Experience perspective;

JavaScript

Resize Iframes seamlessly

An solution to resize iframes seamlessly in the page. The Iframes can be on same domain or cross domain.

CSS

Internet Explorer CSS Limits and Workarounds

Supporting IE is not easy and I got to know these limits in hard way. Here is some info on those limit & some workarounds for that