A Higher Order Components (HOC) is a function that accepts a Component as an argument and returns a Component.  It is an advanced technique to React for reusing component logic. HOCs are a pattern that emerges from React’s compositional nature. Examples of Higher-Order Components (HOCs) There are many, but some notable ones: The most common is probably Redux ’s […]

Read More →

Chrome Developer Tools are debugging & Web authoring tools built into Google Chrome. The Chrome Developer Tools helps web developers to access the internals of their web application and helps to speed up debugging and optimization. This article gives some tips on how to use Chrome Developer tools. Open Dev Tools Select the Chrome menu […]

Read More →

What is React Portal? React Portal provide the way to render children into a DOM node that exists outside the DOM hierarchy of the parent component.   Format ReactDOM.createPortal(child, container)   where the child is the Component which will be rendered at the place of the container which is dom node.   Implementation:   render() { […]

Read More →

What is code splitting in React js? Code Splitting in react js  simply spilt your bundle generated by Wepack or Browserify into multiple and load them dynamically.   Why splitting is important: We develop react app. Our code imports many third-party libraries. Bundle generated by web pack or Browserify also gets fatter and fatter.  This fat budle.js […]

Read More →

In the ReactJS, javascript error handling is not an easy job. There is not a consistent way to handle the error in ReactJs. Right now in React 15 or in the past the JavaScript errors inside the component corrupt the internal state and break the whole UI of the application, Means in React 15 or […]

Read More →

ECMAScript 8 or ECMAScript 2017 was officially released last year end of June by TC39 (what is TC39? Technical Committee 39 which is the official committee for the evolution of Javascript. This committee conducts meeting regularly and usually the members are browser vendors ). Now the standard is to publish new specifications once a year. […]

Read More →

The fragment is a first-class component to wrap your child components and HTML elements instead of using any HTML element. Normal way of wrapping child component in render method render(){ return( <div> <Header/> <h1> Without Fragment </h1> </div> ); }   For above example, if you will not wrap the child component using <div> tag […]

Read More →

The  React v16.0 release was a big one and among the changes are fragments, error boundaries, portals, support for custom DOM attributes, improved server-side-rendering and reduced file size. We will talk about the Portals here. What is React Portal? A way of rendering a child component outside the present Dom-Node-Hierarchy as opposed to the traditional […]

Read More →

What is Immutable Data? Simply data that can not be changed is immutable. In the example below, we have data array which contains no of hours one employee worked on some specific project. var hoursWorked = [8, 8, 8, 7, 7, 9, 6, 8, 8, 7]; console.log(hoursWorked); //op: [8, 8, 8, 7, 7, 9, 6, 8, 8, 7] […]

Read More →