Learn and Teach Coding

Learn and Teach Coding

Practical coding examples and tutorials for React, Next.js, JavaScript, TypeScript, and .NET.

Featured Examples

.NETIntermediate

.NET Repository Pattern

Implement the repository pattern with Entity Framework Core.

View example
NBeginner

Next.js API Route CRUD

Create a full CRUD API using Next.js API Routes and Prisma.

View example
JSIntermediate

Debounced Search in JavaScript

Implement a debounced search input with vanilla JavaScript.

View example
Beginner

React Login Form Validation

Build a login form with validation using React Hook Form and Zod.

View example

Try an Example

Every example is a real, working component. Press start.

00:00:00.00
View source & explanation

React Stopwatch Example

export default function Stopwatch() {
  const [ms, setMs] = useState(0);
  const [running, setRunning] = useState(false);
  const startedAt = useRef(0);

  useEffect(() => {
    if (!running) return;
    // Anchor to a fixed origin so pausing/resuming stays accurate.
    startedAt.current = performance.now() - ms;
    let frame = 0;
    const tick = () => {
      setMs(performance.now() - startedAt.current);
      frame = requestAnimationFrame(tick);
    };
    frame = requestAnimationFrame(tick);
    return () => cancelAnimationFrame(frame);
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [running]);