ReactJs Tutorial - 10 - useRef explained in Tamil - 2023 #reactjstutorial #tamil

The useRef Hook allows you to persist values between renders.

If we tried to count how many times our application renders using the useState Hook, we would be caught in an infinite loop since this Hook itself causes a re-render.

To avoid this, we can use the useRef Hook.

useRef() only returns one item. It returns an Object called current.

When we initialize useRef we set the initial value: useRef(0).

In general, we want to let React handle all DOM manipulation.

But there are some instances where useRef can be used without causing issues.

In React, we can add a ref attribute to an element to access it directly in the DOM.

The useRef Hook can also be used to keep track of previous state values.

This is because we are able to persist useRef values between renders.

This time we use a combination of useState, useEffect, and useRef to keep track of the previous state.

In the useEffect, we are updating the useRef current value each time the inputValue is updated by entering text into the input field.

React - useRef explained in Tamil in this video - 2023:

00:00 - Frontend Koder Intro
00:10 - useRef Explanation
01:45 - useRef Coding
02:16 - useRef with Input
04:00 - useRef with previous State
07:20 - useRef with Dom element
09:22 - Frontend Koder Outro