Tweet AlgochurnFrontendchurnCompaniesBlog
Login
Blog
Login

Medium

30 minutes

Transfer List

Given a list of checkbox items, transfer checked items from one container to the other.

FacebookGoogleNetflix
#Javascript

28 likes

Easy

45 minutes

Insert Text In Document

Given a textarea and a document box, Insert the text in the document in such a way that it HIGHLIGHTS the text content which is most recently added to...

NetflixMorgan StanleyAirBnBCred
#React#Javascript#setInterval

63 likes

Easy

45 minutes

Select All Checkboxes

Given a `Select All` checkbox - toggle the children's checkboxes in such a way that when the `select all` button is clicked, all the boxes are checked...

DirectiAdobeCiscoMicrosoftSalesforceHotstar
#Frontend#React#Javascript#Objects

50 likes

Easy

20 minutes

Implement Currying

Create a function `sum` that implements currying. Currying is a transformation of functions that translates a function from being callable as f(x, y, ...

GoogleAmazonMicrosoftSpotify
#Recursion#Objects#Functions

34 likes

Easy

10 minutes

Guess The Output II

Given an object with functions first() and second() - Guess the output of the given snippet that contains two function calls, one is an arrow function...

AppleOlaMorgan StanleyAirBnBDelhivery
#Frontend#Javascript#Objects#Guess The Output#Functions

34 likes

Easy

10 minutes

Guess The Output I

Given a set of instructions in javascript, guess the output of the given code snippet. It will have promises, setTimeout(), setInterval(), and other a...

FacebookHotstarAirBnBPostman
#Javascript#Guess The Output

27 likes

Easy

30 minutes

useOutsideClick Custom Hook

useOutsideClick custom hook can be used to determine if a click event was triggered outside of the target element's boundary. Create a function called...

IntelSAP LabsZomatoHotstarAirBnBPostman
#React#Hooks#Event Listeners#Custom Hooks

32 likes

Easy

30 minutes

Typewriter Effect

A Typewriter Effect is something where a piece of text constructs itself with some milliseconds in delay. You will see the text getting generated from...

FacebookDirectiInformaticaJP Morgan
#React#setInterval#Hooks

17 likes

Hard

90 minutes

Command Palette

Create a Command Palette that opens up with Keyboard events like Command + K. In this problem, The command palette will have navigation links to which...

YoutubeHotstarMakeMyTripAirBnB
#Frontend#React#Hooks#React Router#Event Listeners

1 like

Easy

40 minutes

Link Previewer

Create a Link Previewer component in React that takes in children prop, that, when hovered over, displays the link that was provided to the component ...

PaypalUberHotstar
#Frontend#React#Hooks

8 likes

Easy

40 minutes

Form Validation

Create a Form Component in React that renders out a list of input fields and validates them before finally submitting the form. Create the form from s...

SpotifyVMWarePayTMNetflix
#Arrays#Frontend#React#Javascript#Objects#Hooks

17 likes

Easy

20 minutes

Multiple Filters

Given a list of products and a list of filters, create a multi-filters buttons bar with a list of filters. If any of the filter is clicked, the list o...

VMWareUberOla
#Arrays#React

20 likes

Medium

60 minutes

Lightbox Gallary

Create a minimal Lightbox Gallery. A lightbox gallery is an image gallery with many images lined up as tiles. Once a tile is clicked, a full-screen im...

SAP LabsNetflixHotstar
#Frontend#React

4 likes

Easy

45 minutes

Full Screen Modal

A modal is an overlay screen that appears when the user performs some action on the website. For example, You must be familiar with a window popping o...

AdobeZomatoPayTM
#React

2 likes

Medium

60 minutes

Infinite Autoplay Slider

As seen on the TailwindCSS website, create a horizontal grid of moving cards that loop infinitely. When hovered over, the cards slow down and are clic...

Paypal
#React

2 likes

Easy

20 minutes

useKeyPress Custom Hook

Keypress events are triggered whenever a user hits any of the keys on the keyboard and some action happens on the web application. Create a custom hoo...

Salesforce
#React

6 likes

Easy

30 minutes

Local Storage Custom Hook

Implement a custom hook to get and set values from and to Local Storage. A custom hook is a way (or rather a mechanism) to reuse stateful logic. State...

Flipkart
#React#Hooks

8 likes

Medium

35 minutes

Toasts And Notifications

Toasts are the small little notification messages that popup on front-end applications to notify the user of some current actions that have happened. ...

Amazon
#React

3 likes

Hard

45 minutes

Countdown Timer

A countdown timer has hours, minutes, and seconds that count down to 0 when started. In this problem, you are required to create a Countdown component...

Facebook
#React

5 likes

Easy

60 minutes

Job Feed

Create a Job Feed page where the latest job postings are fetched from the Hackernews API. On clicking the job posting, the user should be able to land...

Amazon
#React

15 likes

Easy

20 minutes

Memoization

Memoization is a way for a function to remember or cache the results. Given an expensive function that takes a long time to compute for the same resul...

Amazon
#Javascript

10 likes

Easy

25 minutes

Flatten A Nested Object

Flatten a nested object that contains arrays and objects as children. The task is to make the object flat, i.e. there should be no nested children lef...

YoutubeHackerrank
#Javascript

10 likes

Medium

60 minutes

Polyfills

A polyfill is a code snippet (in terms of javascript web architecture) used for modern world functionalities on older browsers that do not implement i...

FacebookAmazon
#Frontend#Javascript

5 likes

Medium

60 minutes

Folder Structure

Given a data object resembling a folder structure, create a folder structure UI resembling that of VS code with appropriate functionalities.

GoogleAmazon
#Frontend#React

9 likes

Medium

60 minutes

Feedback Stars

Create a feedback rating component that takes in a number of stars and outputs the corresponding star SVGs on the output window. When the user clicks ...

Amazon
#Frontend#React

7 likes

Easy

60 minutes

Countries List with Debounce

Debouncing is a method of preventing a function from being invoked too often, and instead of waiting a certain amount of time until it was last called...

FacebookGoogleAmazon
#Frontend#React

12 likes

Pages

HomeAlgochurnFrontendChurnPlaygroundBlogsAbout

Algochurn

Binary Search TreeThree Numbers SumPalindrome CheckNth FibonacciMaximum Subset SumInvert Binary Tree

Frontend Churn

Countdown TimerFeedback StarsFolder StructureImplement PolyfillsImplement Multiple FiltersImplement Debouncing In React

Friends

DiscordTwitterPlaceholderTechTailwind Master KitGitHub

Links

LoginPrivacyTermsCompaniesTagsCategories