Make Transitions in React with Material UI
Reading Time: 3 minutes A transition is an animation usually used to move content in or out of view. Transitions help to make a UI expressive and easy to use.
How Does React updates DOM so Efficiently?
Reading Time: 3 minutes In the browser, DOM manipulation is expensive and time-consuming, both in mounting and unmounting. Part of what makes React very performant is its Reconciliation algorithm. In short, it watches closely for differences, only updates the DOM when necessary, and tries to update only the parts which need to be changed. In this blog, we will explore how DOM manipulation gets easier with the reconciliation algorithm Continue Reading
Which one is Better Ionic or React Native?
Reading Time: 6 minutes Introduction to Ionic React vs React Native in 2022 Back a few years ago, the cross-platform app development industry was dominated by hybrid frameworks like PhoneGap and Ionic. React Native entered the market to make it simpler to design native apps. To develop and maintain mobile apps for iOS and Android, separate specialist teams were needed. However, Ionic React and React Native take a different Continue Reading
Ionic 6 in React: Installation and Serving
Reading Time: 3 minutes Ionic framework in React is an open-source UI toolkit for building performant, high-quality mobile apps, desktop apps, and progressive web apps using web technologies such as HTML, CSS, and JavaScript. Ionic is a cross-platform framework as we can deploy across multiple platforms, such as Android, native iOS, Desktop, and the web as a progressive web app and all with one codebase. Thus, Ionic apps can Continue Reading
Complete React app setup with webpack, babel, and eslint
Reading Time: 8 minutes In this blog, we will see how to set up a React app from scratch using Typescript, Webpack, Babel, Eslint, and prettier. Although the setup given by create-react-app is great and optimized well, it’s good to know what is the job of each tool and how to configure them by yourself that way you can have full control and customize them according to your project Continue Reading
JavaScript Series, Let’s Deep Down To It, Part 1
Reading Time: 3 minutes In this blog we are going to learn what is JavaScript, why uses JavaScript. Now I am starting the JavaScript Series, one by one we are going to deep down to it and exploring every concept of it. What is JavaScript? JavaScript is a text-based programming language used both on the client-side and server-side that allows you to make web pages interactive. HTML and CSS Continue Reading
React Component Lifecycle
Reading Time: 5 minutes A react component has certain lifecycle methods in which we can insert our own code and execute it at a particular moment during the lifecycle of the component. A react component can go through different sets of lifecycle methods depending upon in which phase the component is. These Phases are Mounting, Updating, and Unmounting. Mounting Following is the order of execution for the methods, when Continue Reading
React Hooks: useState – Part 2
Reading Time: 3 minutes As we can discuss a lot about React Hooks in React Hooks: Introduction – Part 1. In this blog, we are going to discuss the useState hook in detail. As this hook let us use state without writing a class. This hook is the equivalent of this.state/this.setState for functional components. Declaring a state variable useState is a named export from react so to use it, Continue Reading
Channels in redux-saga
Reading Time: 3 minutes What are the channels? Are they useful to us in day to day programming? We’ll be going through this blog that channels are played really a major role in redux-saga. Channels: Channels are of 3 types which are used to perform 3 different things, here I will brief you about those channels here but will explain in detail a bit later. Action Channels: Action channel Continue Reading
Redux Saga Effects
Reading Time: 6 minutes Effects are the kind of utility that’s provided by the redux-saga package. when u invokes effects it returns object contains instructions which redux-saga interprets. The effects don’t have any special property outside the redux-saga application because it’s redux-saga that generates side effects like API call database or something else, The effect itself doesn’t actually do anything. If you don’t know how to create a Saga, Continue Reading
React Hooks: Introduction – Part 1
Reading Time: 3 minutes React hooks were introduced at React Conf October 2018 to introduce state management and side-effects in functional components. They have become a game-changer for a lot of developers. These hooks change the fundamental mindset because of switching from class-based components to functional components with hooks. In this blog post, we will get an overview of these hooks, with the look of how the same logic Continue Reading
Create your saga with redux-saga
Reading Time: 3 minutes After reading this blog, you will be able to understand the brief about what is redux-saga. Also you able to install, configure, and create the basic saga in your application. So, before we get any deeper, it’s important to note, that the actual term “saga”. A saga in general programming series of reversible transactions, the saga is designed to replace single huge, locking transactions. eg: Continue Reading
Progressive Web App Testing with Cypress.io
Reading Time: 4 minutes A few days back during a client presentation, we were discussing different tools that can help us to perform end to end testing of a web app developed on some emerging technologies like Ionic, React, Angular and Vue. I am a super fan of selenium for testing different web apps and also have used Protractor for testing some of the angular based applications but this Continue Reading