06 - What are React Hooks - An Introduction to React Hooks - Functional Components

06 - What are React Hooks - An Introduction to React Hooks - Functional Components - ReactJS

Рет қаралды 16,776

Күн бұрын

So what are React Hooks? Let's learn its fundamentals so that you can understand the hooks like useState, useEffect, useContext and many others with ease.
Here is a short fundamental video tutorial to build the mindset in understanding React Hooks the best way!
All set? Let's go then...
Timecodes
0:00 - Introduction
01:04 - Fundamental of React Hooks
07:50 - React Hooks vs General JavaScript Utility Functions
08:36 - Our Plans for React Hooks
09:04 - React Functional Component Lifecycles
11:16 - Wrapping UP & What's Next?
Important Links mentioned in the video:
- Please Reach out on Twitter: / tapasadhikary
- Showwcase ReactJS Community: www.showwcase.com/community/r...
- Pure Functions & Side Effects: • What are Pure Function...
Other Links:
- Blog: blog.greenroots.info/
- LinkedIn: / tapasadhi. .
- GitHub: github.com/atapas
You can support my work by following me on the above platforms and/or sponsoring me using any of these links.
- blog.greenroots.info/sponsor
- buymeacoffee.com/greenroots
- paypal.me/greenrootsinfo
Many Thanks 🙏

Пікірлер: 85

@aswinisandilmedisetti597 Жыл бұрын

React Hooks are basically functions which are used to handle the state and other side effects of the functional components in the React applications. They can be reused in other functional components reducing the complexity of logic and improving the code readability.Thank you for such an amazing playlist on react.

@tapasadhikary Жыл бұрын

Right

@ayeshanaveed3071 Жыл бұрын

As per my understanding, React Hooks are just Javascript functions or separate functional components that are stateful so they handle all the data management and are reusable. So we use these hooks inside our stateless components or other components to make those "other components" as simple and minimal as possible and to avoid side effects because all the side effects are happening inside the hooks

@tapasadhikary Жыл бұрын

Cool

@Ayo-tb1wr Ай бұрын

My definition of a hook: It is a function that possesses Reacts natural features that allow us to manage states how they change and ensure effective/efficient reusability.

@tapasadhikary Ай бұрын

Great

@stevenfleming9345 11 ай бұрын

The way you explain complex things in simple words is just tremendous. Thank you sir!!

@tapasadhikary 11 ай бұрын

Welcome Steven, means a lot 👍

@user-yk3yt4vk9j 5 ай бұрын

React hooks are simple plain functions that can be stateful and can manage the side effects! Thank you sir. You are an amazing teacher. I hate youtube for not showing your channel before. Lots of love from Pakistan😍

@tapasadhikary 5 ай бұрын

Thank You!

@shrilakshmishastry6338 2 жыл бұрын

Tapas, your explanation makes the concepts more clear and helps to understand the topics in better way. Thank you so much 🙏

@tapasadhikary 2 жыл бұрын

Thanks a lot and welcome 🤗

@ItsKrishnaPanthi 2 ай бұрын

Hooks are plain old JavaScript function that we can use to separate out the reusable part from a functional component so that the component is stateless as much as possible and behaves like pure function. Hooks can be statefull and can manage side effects plus it has some special capabilities in context with react.

@suma0009 2 жыл бұрын

So good, looking forward to learning more. Thanks!

@tapasadhikary 2 жыл бұрын

Thank you 👍

@anandgarikapati3769 2 жыл бұрын

React T-shirt is Crazy😀. Looking for more videos like this. great content.thank you

@tapasadhikary 2 жыл бұрын

Haha 😂 Thanks. Sure more videos in the way

@sivaprasad4858 Жыл бұрын

Thank you sir, for your efforts to share the content and concepts in a simple understandable manner. React hooks are the js functions that handle the stateful-ness behavior of react components, which are supposed be to maintained as pure functional components. In addition to that hooks also has the capability of getting interacted with react during component lifecycle methods.

@tapasadhikary Жыл бұрын

Thanks! You are right.

@sublimeelectrons8699 10 ай бұрын

@tapas sir. Thank you so much. Very well explained again. You demystified React Hooks for me. Just letting you know that like your JavaScript series I am gonna finish this React Series. And I will be looking forward for your NextJs series by mid September.

@tapasadhikary 10 ай бұрын

Sure... It's amazing to see you finishing all of them and finding value. Let the world know that these videos exist... Not many are still aware of these. 😀

@vaibhavmatere18 2 жыл бұрын

So much value inside!

@tapasadhikary 2 жыл бұрын

Thank you, Vaibhav ❤️

@SurendraSingh-tf7tk 2 жыл бұрын

crystal clear as always :)

@tapasadhikary 2 жыл бұрын

Thank you 😊

@letshope5646 7 ай бұрын

Hooks are the simple javascript functions( react features ) , which can be used for maintaing the components as pure functions as much as possible. That hooks can be reusable and easily maintainable.

@tapasadhikary 7 ай бұрын

Right 👌

@adamcederlund7945 Жыл бұрын

Great explanation! Thank you!

@tapasadhikary Жыл бұрын

You are welcome, Adam

@aravindasokan4392 Жыл бұрын

after looking into Javascript fundaments playlist, i am here into React, great stuffs, thanks a lot!

@tapasadhikary Жыл бұрын

I appreciate you took time to let me know. Happy to help 💙

@lscodeschool957 Жыл бұрын

Great explanation, really appreciate.

@tapasadhikary Жыл бұрын

Thanks a lot ✌️

@nikhilm5651 2 жыл бұрын

Good one got a lot of clarity

@tapasadhikary 2 жыл бұрын

Thanks a lot, Nikhil 💙

@cbabin 2 жыл бұрын

Your are amazing at explaining concepts. I doubt if there is any one who doesn't get the concept clear watching your videos or reading your blogs. Great job 👍

@tapasadhikary 2 жыл бұрын

Thanks a lot, Babin. That made my day 😍

@user-hi3gg7ny9k 4 ай бұрын

my understanding about react hooks : they are normal functions that can be separated from a stateless component so that it can be a reusable component.apart from this they have stateful logic and sideeffects that is it can change the component state.

@greatmomentoflife Жыл бұрын

Bhalo tapos da ...nice explained

@tapasadhikary Жыл бұрын

Dhonyobad Alok 👍

@toshirohitsugaya1465 2 жыл бұрын

Really improving video quality. Looking forward for useState() ❤️❤️

@tapasadhikary 2 жыл бұрын

🧡🧡

@Sama-mn3hh 8 ай бұрын

YOU ARE THE BEST TEACHER!!!!

@tapasadhikary 8 ай бұрын

Aww ☺️ thank you 🤩

@farhadjaman5580 4 ай бұрын

Awesome video sir

@tapasadhikary 4 ай бұрын

Thanks a lot, Farhad

@willianandrade1357 2 жыл бұрын

A react hook is a simple function that has access to deep react features (state, side effects, etc), which I can add to my components to separate concerns and maintain pure stateless components. This was my understanding, please correct me if I got something wrong!

@tapasadhikary 2 жыл бұрын

Perfect 👌

@cristianarmbruster2071 Жыл бұрын

great explanation. keep it up

@tapasadhikary Жыл бұрын

Thank you 👍

@TheCodingCollege8462 Ай бұрын

react hooks are functions which manages the state and siideeffect of a project

@charlesopuoro5295 Жыл бұрын

Sure thing!!! You imparted knowledge. React Hooks are essentially functions for managing states.

@tapasadhikary Жыл бұрын

Indeed ✌️

@pronitnag7476 12 күн бұрын

Great shirt ,sir

@tapasadhikary 12 күн бұрын

Haha thanks 🤩

@nikhilmohanty8474 9 ай бұрын

Super explanation

@tapasadhikary 9 ай бұрын

Thanks, Nikhil 💛

@SunEveParmagamHonours 2 жыл бұрын

Nice explanation.

@tapasadhikary 2 жыл бұрын

Thank you 💙

@sashirkl 6 ай бұрын

Great. I liked it. But need more lengthy videos may be some industrygrade projects

@tapasadhikary 6 ай бұрын

Thanks! 👍

@NirmalaSunuwar-ky8ce 10 ай бұрын

React hooks are simple js function which are responsible for managing state and side effect, and saperating out the logic part, out of of our main components.

@tapasadhikary 10 ай бұрын

That's right.

@faheemsiddiqui2680 Жыл бұрын

After watching this video, in short, Hooks are javascript functions which have access to additional capabality of react like managing, updating the 'document' separable from of our component to achieve statelessness as much as possible.

@tapasadhikary Жыл бұрын

Right

@takshpatel8109 7 ай бұрын

good explanation

@tapasadhikary 7 ай бұрын

Thanks man ❤️

@vijaybenz9741 6 ай бұрын

Hook is like a seperate entity inside a component that is not static which has a dynamic attitude

@tapasadhikary 6 ай бұрын

🙌

@pernellstyles4894 Жыл бұрын

my understanding after the first watch is that react hooks are just functions that uses other functions that are as pure as possible and manipulate or manages the side effects of functions or components.

@tapasadhikary Жыл бұрын

That's right and also reusable

@gandharvaravi4371 2 жыл бұрын

If i have understood correct - Hooks help to make the Function Components as pure function and Hooks will take care side effets.

@tapasadhikary 2 жыл бұрын

Yes as mush as possible. Also readability is a big bonus.

@amritpaudel8204 Жыл бұрын

I am expecting a video on how to apply and a roadmap for remote jobs at the end of this React course

@tapasadhikary Жыл бұрын

This may help in the mean time www.freecodecamp.org/news/react-fundamentals-for-beginners/

@lindatochukwu3081 6 ай бұрын

Based on your article, React components re-render automatically, but if you don't want all the components to re-render, React Hooks are used, so React Hooks are functions that stop some part of the react-component from re-rendering. kindly peruse if I'm right or wrong

@tapasadhikary 6 ай бұрын

Also the reusability of the logic you want to share across components ✌️

@lindatochukwu3081 6 ай бұрын

@@tapasadhikary thank you sir 😇

@DebdeepSen Жыл бұрын

is the concept similar to inheritance in oops

@badenallen5249 2 жыл бұрын

React components should be pure functions, meaning they should give predictable returns and should not modify any variables that exist outside the function itself. However in order for an application to do anything it is necessary to modify such outside variables all the time. Hooks enable us to isolate the parts of a function which are considered impure, such as altering these outside (state) variables, in a consistent and reusable way, leaving our components pure, sleek and readable.

@tapasadhikary 2 жыл бұрын

Right 💙

@rakaa31 2 жыл бұрын

quality content! but upload more videos frequently otherwise its breaking the flow! anyway looking forward to another hooks

@tapasadhikary 2 жыл бұрын

Yep another hook on the way

@jlvbcoop 2 жыл бұрын

Hooks are not pure functions and have the ability to handle states and side effects. This way functional components can remain pure functions and Hooks can be reused from any functional component. This is what I have understood.

@tapasadhikary 2 жыл бұрын

Good