Have you ever heard of the term ‘Reducers’ or ‘Reducer’ when working with React and Redux? If you’ve worked with React, you might have used state management libraries such as Redux, which employs reducers. In Redux, the reducer is one of the three main components, alongside the store and actions…

What are WebSockets? WebSockets enable real-time, bidirectional (full-duplex) communication between clients and the server over a single, long-lived TCP connection. What does it mean by ”real-time, bidirectional( full-duplex ) communication”? This means data can be transmitted in both ways on a transmission medium between the transmitter and the receiver at the same time. …

In this post, I am going to show you how to integrate OpenStreetMap with React Typescript. If you have never worked with OpenStreetMaps ( OSM ), you can read this post on OSM and React, and then come back here to develop this demo application. …

Jest is a popular open-source JavaScript testing framework maintained by Facebook. It is primarily used for testing JavaScript applications, including client-side (frontend) and server-side (backend) code. Jest is particularly known for its ease of use, powerful features, and comprehensive testing capabilities. You can do the following kinds of tests with…

What is GraphQL query language? GraphQL query language is a specific syntax and set of rules to query data from a GraphQL API. It provides a structured and efficient way to request and retrieve the desired data from the server. The GraphQL query language allows clients to specify the exact data they need, making it…

In this post, I am going to help you understand the fundamental concepts of React Context. We will discuss the main components that you need to create and use React Context. …

The useRef hook is a handy tool in React that lets you create references to elements or values within functional components. It allows you to access and modify DOM elements directly, store mutable values, or preserve data between renders without causing re-renders. It’s like having a special pointer that you…

If you have some experience working with GraphQL servers and GraphQL query language, you must have used GraphQL playgrounds on localhost or online. On these playgrounds, you can test your GraphQL queries and mutations against the GraphQL server to fetch data and make changes. You can also use variables to…

Introduction to GraphQL GraphQL is a query language that makes it easy for software developers to request data from a server. It was developed by Facebook and is now used by many large companies around the world. In simple terms, GraphQL allows developers to specify exactly what data they need, and the…