ReactJS Course [12] - Custom Hooks Tutorial

React Beginner to Advanced Course 2022! In this course I will be going over everything you need to know to go from a complete beginner in react, to being able to create big projects on your own.

Social
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬

EP 12 - Timestamps

00:00 | Intro
01:07 | What is a Hook?
05:45 | Creating a Custom Hook
12:57 | Hooks to abstract logic
20:18 | Hooks Exercise
20:59 | Solution to Exercise

Tags:
- ReactJS Tutorial
- ReactJS Course
- React Course

#reactjs #course

[murshidameen]

tbh this is the best react tutorial playlist in yt rn, ill recommend to evryone

[shivamsharma]

Hey Pedro i love the way you are teaching things, as a beginner getting to cool stuff in a way which is very clear and easy to grab. Keep up the good work.

[ishimweisaac]

Good to see you back Pedro. I've been checking my notifications everyday.

[LucasInojosaMendesdaSilva]

it's very difficult to find such a good explanation of hooks. thanks

[DriveandThrive]

You are making learning react a pleasant experience. Appreciate your content

[olenayevtushok]

I watched so many videos about custom hooks and only this video helped me understand them a little bit. I succeed with the exercise! Thank you Pedro!

[stn]

Thanks bro, you came back and posted videos!

[richardleungwoogabriel]

Thank you alot Pedro!! keep it up!! love what you are doing! leanring so much!

[uafkhurram]

really i like the way you teach. i have learnt many from you. thank you buddy <3

[azaz]

this is amazing I am just in 10:06 but I can't finish the video before writing a comment thanks a lot😀

[dzulfiqarzaky]

Hi Pedro, i watched a lot of your tutorial and it really helped me a lot! Thank you for all the content you give us all!!
By the way i watched your tutorial about useContext hooks before this, and its seem so similar to me.
Did the custom hooks can be used similar to useContext as a global state?

[kk]

Thank you so much for very clear explanation Pedro!

[WillSmith-qtme]

Very good React course, the highest class.

[rodellibed]

Next tutorial bro node Js after your all react js tutorial is done . Thank you and Godbless

[poojakamble]

excercise:
import { useState } from "react";

export const useCounter = () => {
const [state, setState] =useState(0);

const incrementCounter=()=>{
setState(state + 1)
}
const decrementCounter=()=>{
setState(state-1)
}
const resetCounter=()=>{
setState(0)
}

return [state, incrementCounter, decrementCounter, resetCounter]
}

import React from 'react'
import { useCounter } from './useCounter'
const Counter = () => {
//values coming from custom hook- useCounter hook
const [state, incrementCounter, decrementCounter, resetCounter] = useCounter()
return (
<div>
<h1>{state}</h1>
<button
<button
<button

</div>
)
}

export default Counter

please let me know in case of any implementation mistake done

[Kal-El-gmpc]

I have a question. When exporting as an array and you import where you need it, does the order you follow to import matter, cause for example, if we write the const for your 2nd example as an array, will i need to also follow the order it was exported as ? Cause i wonder how react will know if i alter the names

[sonamohialdin]

Awesome tutorial very useful thank you

[eromoseleogbeide]

hey pedro i wanted to ask inthe example you used the useQuery hook without the queryClient and queryClient provider but when i tried using it i had problems i dont know if you can clearify on that

[MasteryOfGameDev]

a little question for the exercise: Can you explain me why you used inside the increase setCount((prev)=>(prev+1)) and not setCount(count+1) ? ty a lot

[alexdefaro]

Hi Pedro... Could you make a video on best libraries to format inputs for ReactJS. Thing like Date/Time Pickers, Money and etc. Thanks