freeCodeCamp / CurriculumExpansion

Creative Commons Attribution Share Alike 4.0 International
313 stars 105 forks source link

chore: add workshop for teaching useEffect hook in frontend cert #550

Open jdwilkin4 opened 1 week ago

jdwilkin4 commented 1 week ago

We need a workshop to teach working with the useEffect hook. This should be a short workshop.

You can see the lecture videos on the sheet to get a sense of what was taught immediately before this.

Here are some suggested project ideas from ChatGPT:

Live Search Feature

Objective: Implement a live search feature where search results update in real-time as the user types. Use of useEffect: To debounce the search input and perform API requests only after the user has stopped typing for a specified duration. Learning Outcome: Understand how to debounce inputs and manage asynchronous operations within effects.

Dynamic Page Title

Objective: Create a component that updates the document title based on its content. Use of useEffect: To change the document title whenever the component mounts or its content changes. Learning Outcome: Manipulate browser APIs and handle side effects related to DOM updates.

We will supply the css for them. The steps will only focus on the JSX and the useEffect hook.

Acceptance criteria

jdwilkin4 commented 1 week ago

marking this as blocked for now until we know what the final editor implementation will look like for the react and typescript projects. Oliver will let us know when that is