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 to Implement Styling in Next.js
Reading Time: 5 minutes Styling is the most important aspect when you are developing any application. You might have the best functioning application but if your UI is not that great it is difficult to maintain active users. Styling is essential to build any web application. So, In this blog, we will be discussing how we can implement styling in Next.js and will see how we can implement global Continue Reading
How To Render Charts In React: using react-chartjs-2 and Chart.js
Reading Time: 3 minutes React is a well-liked JavaScript package that gives programmers more effective and orderly ways to create user interfaces. There are many third-party libraries to pick from when it comes to data visualization in React. React-chartjs-2, which is based on Chart.js, is one of the most widely used libraries for rendering charts in React. In this blog post, we’ll look at how to render charts in Continue Reading
Best Practices and Tools For Testing React Applications
Reading Time: 3 minutes One of the most widely used front-end libraries today is react, and for a good reason. It has emerged as a top option for web developers worldwide thanks to its modular design, reusable components, and quick rendering capabilities. However, developers must ensure that their React applications are adequate. Tested to ward off any potential defects or problems because great power comes with great responsibility. We Continue Reading
How to implement Routing in Next.js
Reading Time: 4 minutes Introduction Next.js is a react framework that comes with all the features that you need for production. It uses a file-based routing system that enables routing in your application. When a file is added to the pages folder in a project, it automatically becomes available as a route. In this blog, we will be looking at how routing works in next.js, nested routes, dynamic routes, Continue Reading
Why do we need useMemo and useCallback?
Reading Time: 3 minutes Understanding the Terms: useMemo vs useCallback useMemo useMemo is very similar to useCallback. It accepts a function and a list of dependencies. But the difference between useMemo and useCallback is that useMemo returns the memo-ized value returned by the passed function. It only recalculates the value when one of the dependencies changes. It’s very useful if you want to avoid expensive calculations on every render Continue Reading
Web Accessibility in React
Reading Time: 3 minutes What is Web Accessibility? Web Accessibility, also known as A11y ( Cause there are 11 letters between “a” and “y” ), is the idea that a website should be usable by people irrespective of their physical disability or internet bandwidth speed, or socio-economic shortcoming. So making our compatibility with keyboard support and screen readers makes it possible for users with visual or motor disabilities to Continue Reading
How to Get started with Next.Js
Reading Time: 5 minutes In this Blog, we will be discussing what and why of Next.Js along with the creation of a Next.Js app. We will also be learning the usage of different files and folders that create-next-app provides us at the time of app creation. So, stick to this blog to gain a conceptual understanding of Next.Js. What is Next js? According to the Documentation, Next Js is Continue Reading
Creating HTTP Client service for React-Redux app
Reading Time: 4 minutes Unlike Angular, React does not have a standard library for making HTTP requests, and also there is no standard way of organizing all the HTTP call functions. So in this blog, I will share a way of creating an HTTP client service using the good old “fetch()” API method for a Standard React-Redux web app. This is what I have used and it worked great Continue Reading
Fundamentals of Event Management in React
Reading Time: 5 minutes Introduction Events are some type of interaction between the user and the app, the user performs some action resulting in some reaction from the app. Any time a user clicks, drag-and-drop, fills in the input field or hovers over an element an event occurs. We as a Developer defines the function to respond to the event that occurred. These functions are event handlers and they Continue Reading
Best way to manage state in React using Context, useReducer, and Custom hook.
Reading Time: 6 minutes Introduction When it comes to state management in a React app the name “Redux” is the go-to solution in almost all projects. But always managing the state with Redux can be overkill sometimes causing complex and additional code to the code bundle. React already comes with pretty simple and powerful tools that can help us manage complex states. Using the combination of Context, useReducer, and 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
React JS : Components
Reading Time: 6 minutes React js is a JavaScript library for building user interfaces. Now we will study about components of react js. Components Components let you split the UI into independent, reusable pieces, and think about each piece in isolation. This page provides an introduction to the idea of components Conceptually, components are like JavaScript functions. They accept arbitrary inputs (called “props”) and return React js elements describing Continue Reading