scrimba
Meta scrims
React Advanced
Lab Solution: Create your own custom hook
Go Pro!Bootcamp

Bootcamp

Study group

Collaborate with peers in your dedicated #study-group channel.

Code reviews

Submit projects for review using the /review command in your #code-reviews channel

Lab Solution: Create your own custom hook
AboutCommentsNotes
Lab Solution: Create your own custom hook
Expand for more info
src
App.js
run
preview
console
import { useState, useEffect, useRef } from "react";

export default function App() {
const [day, setDay] = useState("Monday");
const prevDay = usePrevious(day);

const getNextDay = () => {
if (day === "Monday") {
setDay("Tuesday")
} else if (day === "Tuesday") {
setDay("Wednesday")
} else if (day === "Wednesday") {
setDay("Thursday")
} else if (day === "Thursday") {
setDay("Friday")
} else if (day === "Friday") {
setDay("Monday")
}
}

return (
<div style={{padding: "0 20px"}}>
<h1>
Today is: {day}<br />
{
prevDay && (
<span>Previous work day was: {prevDay}</span>
)
}
</h1>
<button onClick={getNextDay}>
Get next day
</button>
</div>
);
}

function usePrevious(val) {
}

Console
/public/index.html
-3:07