Questions

A seemingly simple yet notoriously tricky CSS challenge

Most software out there is about creating, reading, updating, and deleting data.

One of the ways to create a design system is to use CVA. Try CVA to create a button component.

Forms can't get any simpler

Closures in JavaScript can sometimes lead to unexpected behaviors, especially in React components.

Cards are a popular design pattern in web development.

This hook can easily frustrate most developers out there. What about you?

State in React begins here

Buggy, buggy, buggy logic

Master React Modal Optimization with this coding question

Currying is a functional programming technique that can be applied in React to handle events more efficiently, especially when dealing with multiple similar inputs. However, it's important to note that this approach is not commonly used and should be adopted based on the team's consensus and coding standards.

Create a React component that accepts time calculations and converts minutes to hours when the result exceeds 60 minutes.

Refactor the code to use early returns instead of too many if-else statements.

A favorite interview question but here you deal with objects

Objects are everywhere in JavaScript. This question will test your understanding of objects.

The Array.at() method takes an integer value and returns the item at that index, allowing for positive and negative integers. Negative integers count back from the last item in the array.

The Array.filter() method creates a new array with all elements that pass the test implemented by the provided function. Your task is to implement a polyfill for Array.filter called arrayFilter.

The String.split() method divides a String into an ordered list of substrings, puts these substrings into an array, and returns the array. It uses a separator string to determine where each split should occur.

Though modern React applications are built using function components, there are still many class components in the wild. You might need to refactor a class component to a function component for various reasons.

Most common code smells are easy to spot. Long methods are one of them. Refactor it to make it more readable and maintainable.

Simplifying multiple conditional flows can significantly improve the readability and maintainability of your code.

Layouts are difficult. This question will give you good amount of practice and knowledge.

A custom hook to copy text to the clipboard. A standard requirement in many web applications.

This task involves identifying and resolving a bug caused by the absence of a cleanup function in a useEffect hook.

Custom hooks are a great way to reuse and abstract logic in React.

Using currying in the real world

DSA ain't just for backend devs! In this challenge, you'll implement a custom hook to manage history in React.