Uber

Interactive grid where users toggle node colors. Upon activating all nodes, the system automatically reverts them sequentially to their initial state.

Node Unwinder

Build a dynamic interface where clicking on a canvas places circles that change color when they overlap.

Overlapping Circles

Create a reusable progress bar component that visually represents a percentage value with customizable max value.

Progress Bar I

Add smooth CSS transitions and animations to the progress bar for a polished filling effect.

Progress Bar II

Enhance the progress bar with proper ARIA attributes and accessibility roles for screen reader support.

Progress Bar III

Component that tracks elapsed time with precision, providing start/stop/reset functionality and lap recording.

Stopwatch

Build a Traffic Light with Pure JavaScript: Red, Yellow, Green, and Beyond! 🚦

Traffic Light

polyfill function that replicates the behavior of the built-in Function.prototype.apply() method.

Polyfill: apply()

Transforms each element in an array using an asynchronous mapping function.

asyncMap

polyfill function that replicates the behavior of the built-in Function.prototype.bind() method.

Polyfill: bind( )

Create a JavaScript function that wraps the native fetch() API with caching capabilities.

fetch with cache & expiry

polyfill function that replicates the behavior of the built-in Function.prototype.call() method.

Polyfill: call( )

Currying is a technique of translating a function that takes multiple arguments into a sequence of functions.

multiAdd(1,2)(3)(4,5,6)()

Debouncing enhances performance by delaying function execution until a certain period of inactivity, preventing unnecessary calls.

Debounce

Implement a fetch function with timeout functionality to handle network requests that take too long.

API: fetch with timeout

Measure the performance impact of memoization using console.time and console.timeEnd.

Memoize II

The memoize function takes a function and returns its memoized variant, optimizing repeated calls by storing previous results.

Memoize

Min Height of DOM Tree

Start, pause, reset, and get the current value of the counter.

Throttle Array

Throttling optimizes performance by limiting function execution to a specified rate, preventing excessive calls over short intervals.

Throttle

Code Splitting

How to improve website performance?

Virtual DOM in React

What is a closure in JavaScript?

A conversational guide to understanding thunks in JavaScript—what they are, why they have a weird name, and how they help manage async operations.

Uber

✨ Unlock the Uber Track