Search for a command to run...
Hello there! I'm Ajinkya Chanshetty.
I have 8+ Years of experience in software development with Web UI technologies. My tech stack includes Front end technologies: HTML5, CSS3, Bootstrap, SCSS, JavaScript, ES6, TypeScript UI Frameworks: Angular V10,12,14 and ReactJS, Redux, NgRx, NextJS Server-side Programming languages: JAVA, NodeJS Database: MongoDB, MySQL Also have Strong Problem-Solving Skills, and knowledge of Data Structures, and Algorithms
No comments yet. Be the first to comment.
You might have noticed the different shades of the moon. There's that one bright full moon that comes once every month, and then, little by little, it starts fading every day. It happens all the time,
Sometimes, out of nowhere, nostalgia hits you. You could be sitting in your room, walking alone on a quiet evening, or listening to an old song, and suddenly the memories of your school days come rush
We’ve all had moments where we lose our cool. You’re mad, your heart’s pounding, and suddenly you say, “You never listen!” or “Why do you always screw up?” It feels like a relief for a second, like letting out a big breath. But then you see their fac...
Life has a funny way of teaching us things, especially through the people we meet and the friendships we make. One big lesson it teaches is about karma—what goes around, comes around. Your actions, your thoughts, everything comes back to you somehow....
This morning, I went to the bank. I had a small task to complete, and the staff asked me to sit for a while. As I sat there, I pulled out my phone and started scrolling aimlessly. I was only focused on my work at the bank—nothing more. I remembered h...
React has introduced a lot of hooks and 'useEffect' is one of the important ones as far as the rendering and updation of the component are concerned.
The name 'useEffect' originated from its ability to deal with the side effects of the functionalities that happen outside of the react scope. It means, once you fetch some data from an API it can either return some 500 status code or the data.
Secondly, when some component receives the props that cause the state change and also the rerender of the component takes place. Then 'useEffect' gets called in this scenario as well.
useEffect(()=>{
// getData
axios.get("https://api.github.com/users").then(res=>{
console.log("Response", res)
})
}, [])
It has two parameters,
A callback function that can be used to perform some action
An array to pass the name of the dependent state or parameter
This 'useEffect' hook gets called on every state change and if we don't pass the second parameter as an array, it will go into an infinite loop and can cause a stack overflow.
If we want to restrict the hook to be called only at once during the first render then a blank array should be passed.
The render can be made dependent on some state value change by passing the same state in the array as a dependency.
Also, If some action is to be performed after the removal of the DOM, like eliminating some subscriptions or removing some event listeners then a return call back can also be used in the same hook.
useEffect(()=>{
// getData
window.addEventListener("scroll", callFunction)
}),
return()=>{
window.removeEventListener("scroll", callFunction)
}
}, [])
Conclusion: The 'useEffect' hook can be used to perform the features as componentDidMount and componentDidUpdate and componentWillUnmount all together in the functional component.