diff --git a/curriculum/challenges/english/25-front-end-development/quiz-react-state-and-hooks/66f1a417757b6ca4eecd89d6.md b/curriculum/challenges/english/25-front-end-development/quiz-react-state-and-hooks/66f1a417757b6ca4eecd89d6.md
index 5798c888457..677b5b4c983 100644
--- a/curriculum/challenges/english/25-front-end-development/quiz-react-state-and-hooks/66f1a417757b6ca4eecd89d6.md
+++ b/curriculum/challenges/english/25-front-end-development/quiz-react-state-and-hooks/66f1a417757b6ca4eecd89d6.md
@@ -17,439 +17,475 @@ Answer all of the questions below correctly to pass the quiz.
#### --text--
-Placeholder question
+Which line of code correctly handles a click event?
#### --distractors--
-Placeholder distractor 1
+```jsx
+
+```
---
-Placeholder distractor 2
+```jsx
+
+```
---
-Placeholder distractor 3
+```jsx
+
+```
#### --answer--
-Placeholder answer
+```jsx
+
+```
### --question--
#### --text--
-Placeholder question
+What is a React Synthetic Event?
#### --distractors--
-Placeholder distractor 1
+Allows direct access to and manipulation of the DOM.
---
-Placeholder distractor 2
+Creates a JSX element under the hood.
---
-Placeholder distractor 3
+Alters the bubbling phase of event propagation to be more user friendly.
#### --answer--
-Placeholder answer
+A wrapper around native events to deal with browser inconsistencies.
### --question--
#### --text--
-Placeholder question
+Which of the following is true about React's state?
#### --distractors--
-Placeholder distractor 1
+The URI is a function of state.
---
-Placeholder distractor 2
+State is always an abstraction of the UI.
---
-Placeholder distractor 3
+State always updates synchronously to avoid errors.
#### --answer--
-Placeholder answer
+The UI is a function of state.
### --question--
#### --text--
-Placeholder question
+What are the three major stages in React's rendering?
#### --distractors--
-Placeholder distractor 1
+Handshake, loading and hydration.
---
-Placeholder distractor 2
+Fetching, decoding and execution.
---
-Placeholder distractor 3
+Mounting, updating and unmounting.
#### --answer--
-Placeholder answer
+Triggering, rendering and committing.
### --question--
#### --text--
-Placeholder question
+What are the two most important rules of React hooks?
#### --distractors--
-Placeholder distractor 1
+Hooks should be used sparingly, prefer built in over custom.
---
-Placeholder distractor 2
+Functions should always be pure, and return an array.
---
-Placeholder distractor 3
+Execute in helper functions, and after a callback.
#### --answer--
-Placeholder answer
+Call at the top level of, and only inside, a React function.
### --question--
#### --text--
-Placeholder question
+Why do React hooks use the prefix `use`?
#### --distractors--
-Placeholder distractor 1
+No particular reason at all.
---
-Placeholder distractor 2
+To abstract repetitive logic.
---
-Placeholder distractor 3
+It returns used state variables.
#### --answer--
-Placeholder answer
+Easy identification and linting.
### --question--
#### --text--
-Placeholder question
+Given the following code:
+
+```jsx
+const [certificates, setCertificates] = useState([]);
+```
+
+Which is the most reliable way to update array state using the `useState` hook?
#### --distractors--
-Placeholder distractor 1
+```jsx
+setCertificates(previousItems => ...previousItems, "Front End");
+```
---
-Placeholder distractor 2
+```jsx
+setCertificates("Front End");
+```
---
-Placeholder distractor 3
+```jsx
+setCertificates().append("Front End");
+```
#### --answer--
-Placeholder answer
+```jsx
+setCertificates(previousItems => [...previousItems, "Front End"]);
+```
### --question--
#### --text--
-Placeholder question
+What is wrong with this function?
+
+```jsx
+function updateSpaceship() {
+ setSpaceship(previousState => ({
+ name: "Discovery"
+ }));
+}
+```
#### --distractors--
-Placeholder distractor 1
+Updating a `useState` variable is not allowed inside a nested function.
---
-Placeholder distractor 2
+`previousState` needs to be surrounded by parenthesis.
---
-Placeholder distractor 3
+Arrow functions should not be used inside a state setter function.
#### --answer--
-Placeholder answer
+`previousState` must be spread before `name` to ensure any other properties are not overwritten.
### --question--
#### --text--
-Placeholder question
+What is a key benefit of using the `useContext` hook?
#### --distractors--
-Placeholder distractor 1
+Data is stored externally.
---
-Placeholder distractor 2
+Allow direct access to the global `window` object.
---
-Placeholder distractor 3
+Avoid overusing local state in components.
#### --answer--
-Placeholder answer
+Avoid prop drilling in deeply nested components.
### --question--
#### --text--
-Placeholder question
+Which of the following statements is correct?
#### --distractors--
-Placeholder distractor 1
+`ref.current` is immutable.
---
-Placeholder distractor 2
+`ref.current` should be mutated during rendering.
---
-Placeholder distractor 3
+`ref.current` only accepts a DOM element.
#### --answer--
-Placeholder answer
+`ref.current` is just a plain JavaScript object.
### --question--
#### --text--
-Placeholder question
+What happens when the returned value of a `useRef` hook is updated?
#### --distractors--
-Placeholder distractor 1
+A re-render of the component is triggered.
---
-Placeholder distractor 2
+A reference to the DOM node is saved in memory.
---
-Placeholder distractor 3
+An associated click handler will be triggered.
#### --answer--
-Placeholder answer
+A re-render is not triggered.
### --question--
#### --text--
-Placeholder question
+How many times will this code print to the console?
+
+```jsx
+useEffect(() => {
+ console.log("Nice work!!");
+}, []);
+```
#### --distractors--
-Placeholder distractor 1
+Three times.
---
-Placeholder distractor 2
+Twice.
---
-Placeholder distractor 3
+None as the dependency array is empty.
#### --answer--
-Placeholder answer
+Only once on initial render.
### --question--
#### --text--
-Placeholder question
+What are React custom hooks typically used for?
#### --distractors--
-Placeholder distractor 1
+Executing an app's most complex functionality.
---
-Placeholder distractor 2
+They are not typically used, built-in hooks are preferred.
---
-Placeholder distractor 3
+They replace life cycle methods from previous versions of React.
#### --answer--
-Placeholder answer
+Reusing stateful logic across components.
### --question--
#### --text--
-Placeholder question
+When should you consider using the `useReducer` hook to manage state?
#### --distractors--
-Placeholder distractor 1
+When state is shared across many components.
---
-Placeholder distractor 2
+When speed and efficiency are critical.
---
-Placeholder distractor 3
+To improve code readability.
#### --answer--
-Placeholder answer
+When a component's state is complex or tightly coupled.
### --question--
#### --text--
-Placeholder question
+What is the difference between controlled and uncontrolled forms?
#### --distractors--
-Placeholder distractor 1
+Controlled uses external API's, uncontrolled does not.
---
-Placeholder distractor 2
+Controlled is where React handles form submission, uncontrolled is where JavaScript handles it.
---
-Placeholder distractor 3
+Controlled is where user inputs are sanitized automatically, uncontrolled if where they are not.
#### --answer--
-Placeholder answer
+Controlled is where component behaviors are driven by props, uncontrolled is where component behaviors are driven by local state.
### --question--
#### --text--
-Placeholder question
+Inside a functional component, which of the following hooks should you use to fetch data?
#### --distractors--
-Placeholder distractor 1
+`useReducer`
---
-Placeholder distractor 2
+`useState`
---
-Placeholder distractor 3
+`useDebounce`
#### --answer--
-Placeholder answer
+`useEffect`
### --question--
#### --text--
-Placeholder question
+What level does the `memo` function work in React?
#### --distractors--
-Placeholder distractor 1
+App
---
-Placeholder distractor 2
+Attribute
---
-Placeholder distractor 3
+Element
#### --answer--
-Placeholder answer
+Functional component
### --question--
#### --text--
-Placeholder question
+If you have a complex function inside a component, which hook can you use to memoize its result?
#### --distractors--
-Placeholder distractor 1
+`useEfficiency`
---
-Placeholder distractor 2
+`useCallback`
---
-Placeholder distractor 3
+`usePerformance`
#### --answer--
-Placeholder answer
+`useMemo`
### --question--
#### --text--
-Placeholder question
+What is the `useCallback` hook?
#### --distractors--
-Placeholder distractor 1
+A hook that allows you to define a callback function.
---
-Placeholder distractor 2
+A custom hook not managed by React.
---
-Placeholder distractor 3
+A hook that checks an app's performance in development only.
#### --answer--
-Placeholder answer
+A hook that ensures a function isn't re-created each time a component re-renders.
### --question--
#### --text--
-Placeholder question
+Which of the following statements is true about routing in React?
#### --distractors--
-Placeholder distractor 1
+React includes its own routing functionality accessible through the React class.
---
-Placeholder distractor 2
+Routing is managed by advanced server components.
---
-Placeholder distractor 3
+Single-page applications don't actually use a single page for routing.
#### --answer--
-Placeholder answer
+The `react-router-dom` library is a popular choice to handle routing in React apps.