GraphQL was publicly released in 2015 and since then it has been a most-talked-about subject across the tech community. It was introduced in ReactJs Conf 2015 where Daniel Schafer and Jing Chen explained how Facebook is using GraphQL for data fetching in some of its frontend applications. The idea of declaratively specifying the data requirements and sending as much payload as required over the wires looked interesting and people started experimenting with this new methodology of communicating with the server. GraphQL is a specification that explains how to build a strong type system, validate and execute queries.

Some of the big companies like Twitter, GitHub, Shopify, and many more started using GraphQL in production and their experiences with GraphQL are worth reading! Treebo started using GraphQL in mid-2018 while we were building a property management system for hotel chains. We’re now extensively using GraphQL in two of our prime products (Property management system, Discounts & Pricing Configuration Dashboard). Lately, we’ve been trying to make a multi-tenant property management system and there were quite some challenges that we faced along the way. In this article, I’ll first explain a bit about the property management system — what is it and how are we using GraphQL as an aggregate layer to build a smooth experience from booking to checkout. I’ll then cover the most interesting part — how we built a multi-tenant property management system. …

Learn what Heaps are and what sort of problems they help solve

Most of the programming languages support some specific data types, for example, int, string, boolean, etc. We can define our custom data type for storing groups of data and this data type can also have functions/operations. …

Learn how to use the new Intl object to format data into a specific locale

The Intl object is available in the global scope and is used for formatting strings, numbers, and date and time in the locale-specific format. It does the work of internationalizing information displayed to the user.

A quick tip before we start: Use Bit to share and collaborate on your JS utility functions with your team or with the entire open-source community. Make your projects truly modular by versioning and collaborating on single components separately — with absolutely zero overhead.

Internationalization is the process of designing a software application so that it can be adapted to various languages and regions without engineering changes. …

In this tutorial, I’ll first help you understand why Facebook felt the need to build a library called React. I’ll cover all the basic concepts that you’d need to create your first React app. This tutorial aims to explain React by clearly explaining its fundamentals like the use of JSX and ES6, building stateful & stateless components, React Elements, virtual DOM and the diffing algorithm.

The web has evolved from just being a bunch of static HTML pages to reliable, interactive and performant applications. With the advent of AJAX, we can asynchronously load the entire application in parts.

Whenever there is a change in any part of the application due to real-time updates or user input, that part only is loaded asynchronously to reflect the updated state. This means that only the respective Document Object Model (DOM) container should be updated to reflect the changes to the client. …

In this tutorial, we’re going to build up the fundamentals of Progressive Web Applications (PWAs). I’ll help you understand the pain points of the traditional web and the need for something better to combat native applications. We’ll dive deeper into the components that make up a PWA — Service Workers, IndexedDB, manifest.json & Web Push Notifications. And the most interesting bit — we’ll build a PWA from scratch.

How I Got the Idea to Write This Tutorial

I was having dinner with my entire family, and a notification for a new text message popped up on my mobile phone. …

This article will help you understand the internals of JavaScript — even the weird parts. Every line of code that you write in JavaScript will make complete sense once you know how it has been interpreted by the underlying engine. You’ll learn multiple ways of downloading scripts based on the use case, and how the parser generates an Abstract Syntax Tree and its heuristics while parsing the code. Let’s dive deep into the internals of JavaScript engines — starting from downloading scripts.

You can read more about it here.

If you’re interested in learning about the internals of the JavaScript engine, you should definitely read this article. …

In this article, I’ll explain the underlying technologies used for building a progressive web application. We’ll understand the pain points of users while browsing through old websites that lack minimal user experience. Why are we building applications on web even when native applications are doing their job well enough?

To get a thorough understanding of PWAs, please head over to this link on Smashing Magazine —

Your knowledge of JavaScript can be pretty well judged by your understanding of this. The fact that people find it difficult to comprehend is, because of its use in multiple and varied scenarios.

Let's get them right once and for all.

If I were to talk about this in the literal sense, it simply means — this very thing in front of me. …

First things first — In case you’re wondering what Berries are, Berries are small fruits that can provide HP and status condition restoration, stat enhancement and damage negation when eaten by Pokemon. And if you’re wondering what’s this has to do with Service Workers in any possible case? Then here’s the cool thing — We’ll be building a Pokemon Web App to demonstrate the working of Service Workers. If you want to get an Overview of what Service Workers are — please read my blog on Service Worker Fundamentals.

We’ll be using express-generator to create an application skeleton. For restful APIs, we would be using PokeApi — It provides an extensive list of APIs detailing everything from Pokemon to Berry Flavours. We would be using two simple APIs for this project — one to get a list of Berries and the other one will evaluate the power of each of the Berries based on many parameters. The main purpose of this project is to leverage the power of Service Workers using its Offline-first feature. Along the way, we’ll see how to cache resources and API responses so that the App is able to deliver data seamlessly even with no internet connection. …

On my train journey way back home, I was amazed over the number of apps I have in my phone and that, I’ve different apps to serve my disparate demands. Living in an internet age and I, being a Web Developer, who is highly obsessed with the word ‘Web’ in my title, felt kind of disappointed and immediately switched back to my browser to navigate to the website, to read the blog that I was peacefully reading on the native app before a weird kind of feeling popped in. To my surprise, it’s been 50 seconds and all I can see is the loading icon, slowly some content started appearing on the page. …


Ankita Masand

Senior Frontend Engineer at Treebo | Freelance Writer

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store