Build a component that displays a loading message for 3 seconds before showing the content.

Easy

Problem Statement

Sample Output

Initially: Loading...
 After 3 seconds: Content loaded!

Limits

Time: 2s · Memory: 256 MB

Code Editor

00:00

Try your code in this preview. Submit marks it done.

import React, { useState, useEffect } from "react";
 
 const Loader = () => {
  const [isLoading, setIsLoading] = useState(true);
 
  useEffect(() => {
  // Set a timeout to change loading state
  }, []);
 
  return <div>{isLoading ? "Loading..." : "Content loaded!"}</div>;
 };
 
 export default Loader;

Open Sandbox

Programming Exercises

Build a component that displays a loading message for 3 seconds before showing the content.

Problem Statement

Sample Output

Limits

Hint 1