Author: Editorial Team
-
Redux store example
1. Introduction In this tutorial, we’ll create a simple application and will use Redux to update the state. 2. Design the Redux Store The application we are going to create is an application to manage tasks. The state of the application maintains the tasks. We maintain an array to store our tasks. Our array of…
-
Redux – An Introduction
1. Introduction According to the documentation of Redux: Redux is a JS library for predictable and maintainable global state management. Redux can be used with commonly used libraries like React, Angular, Vue.js. It helps manage the state of your application in a predictable way. Redux is very small in size (2kB, including dependencies). Redux Toolkit…
-
Pure Components in React
1. Introduction React takes advantages of purity of components. A component in React should be written as Pure component. In this short tutorial, we’ll discuss what is a pure component with an example. Before discussing pure component, let us discuss a pure function. 2. What is a pure function? A pure function is a concept…
-
Rendering lists in React
1. Introduction You will often want to show multiple similar components from a collection of data. You can use JavaScript array methods combined with filter() and map() to filter and transform array data to components. 2. Rendering data from arrays Suppose you have a list of fruits. This is a simple example of list of…
-
Conditional rendering in React
1. Introduction You will often need to display different things on the screen based on some condition. In React, you can conditionally render JSX using JavaScript like syntax like if statements, ?: operators and &&. In React, control flow is handled by JavaScript. 2. Example In this example, you can observe that a different JSX…
-
Breadth First Search Algorithm
1. Introduction Breadth First Search (BFS) is a graph traversal algorithm. Breadth First Search starts at the root vertex and explores all nodes at a particular level before moving on to the nodes at the next level. Breadth First Search requires extra data structure, usually the queue, to keep track of the child nodes that…
-
Adjacency matrix and adjacency list implementation
1. Introduction In this tutorial, we’ll see the implementation of adjacency list and adjacency matrix representation of graph. 2. Adjacency Matrix Implementation Consider the following two dimensional array representing an adjacency matrix representing a graph. The program finds all the edges in the graph. Output 3. Adjacency list representation For the Adjacency List Representation, we’ll…
-
Introduction to Graph
1. Introduction In this short tutorial, we’ll discuss Graph. We’ll discuss the terms related to graphs. Graphs are studied in Graph Theory. 2. What is Graph Theory? Graph theory is a branch of mathematics that studies the properties and applications of graphs, which are structures made up of vertices (nodes) connected by edges (links). It…
-
React useId hook
1. Introduction useId is a React Hook for generating unique IDs that can be passed to accessibility attributes. useId() does not take any parameter and returns a unique ID string associated with this particular useId call in this particular component. Let us understand the usage of useId with the help of an example. HTML accessibility…
-
React useEffect Hook
1. Introduction useEffect is a React Hook which allows you to synchronize your component with an external system. Here, external system means any piece of code that’s not controlled by React, such as: 2. Signature useEffect has two parameters, setup and dependencies and returns undefined. React calls setup and cleanup code multiple times based on…