Build your frontend skills.

Implement arrayMap to recreate the core behavior of Array.prototype.map using a loop. Work with a standalone function that receives the array as its first argument.

Implement arrayFilter to recreate the core behavior of Array.prototype.filter using a loop. Work with a standalone function that receives the array as its first argument.

Implement arrayReduce to recreate the core behavior of Array.prototype.reduce using a loop. Work with a standalone function that receives the array as its first argument.

Implement a real React hook that manages boolean state and exposes convenient methods to enable, disable, toggle, or directly update it. Use the JavaScript or TypeScript variant and keep the interface identical. Call this hook inside a React component. The supplied tests render React components and inspect the hook again after updates.

Implement a React hook that behaves like useState but exposes a default value whenever its raw state is null or undefined. Other falsy values, including false, 0, and an empty string, remain unchanged. The default is derived during rendering. The returned setter still manages the underlying raw state.

Implement promiseReject(reason), a standalone version of Promise.reject for the standard native Promise constructor. Always return a fresh Promise rejected with the exact reason supplied. A Promise or thenable passed as the reason must remain the rejection reason; do not adopt it.

Implement invertObject(object), a utility that swaps an object's keys and values. Each input value becomes an output key, and its original key becomes the output value. For example, { first: "red", second: "green" } becomes { red: "first", green: "second" }. This is a shallow transformation: the input contains only string or number values.

Implement a real React hook that manages numeric counter state and exposes convenient methods to increment, decrement, reset, and directly update it. Each hook instance owns its state. This first counter challenge focuses on correct state behavior; useCounter II extends the same interface with memoization.

Implement an optimized version of the useCounter React hook. Keep its existing counter API and state behavior while preserving utility method identities and avoiding a new result object when the count has not changed. Use the JavaScript or TypeScript variant. The supplied tests render real React components and verify both state updates and reference identity across ordinary rerenders.

Implement cancellableInterval(callback, delay, ...args), a function that behaves like setInterval but returns a cancel function instead of exposing the timer handle. Repeatedly call the callback with the supplied arguments after each delay. Calling the returned function stops future invocations of that interval. Native timer APIs are allowed.