html, javascript ? Reactjs ??? ???? ?? ?? ??? ??? ??????

????:
1) React ??? ????.
2) ?? ???? "Loading"? ???? ???.
3) ?? ???? ?? 1??? ?????(1) ???? ?? ?????.
?:
?? ????. -1?- ?? ?.. -1?- ?? ?... -1?- ?? ?

????:

??? ??? ?????. ?? ?? ??(??, ?? ?)? ?????. React ??? ????

?? ?? ??:

1) "Loading"? ???? ??? ????? ?????.

const Loading = () => {
  const loadingText = "Loading";

  return (
    <div>
      <h2>{loadingText}</h2>
    </div>
  );
};

export default Loading;

??:

1) ?? ??? ????? ??? ?????. ??? useState? ???? ?? ??? ?????.

const [dots, setDots] = useState(1);

???? ??? ? ?? ?????

{".".repeat(dots)}

2) ???? ??? ???? ?????. window.setInterval? ? ??? ??? ? ????. ??? ?? ??? ?? ???.

window.setInterval(() => {
      // Logic to increment dots
    }, 1000);

3) ?? ??? ? ? ?? ???? useEffect ??? ????.

useEffect(() => {
    window.setInterval(() => {
      // Logic to increment dots
    }, 1000);
  }, []);

???? ??? '?? ?'? ?????.
?? ??? window.setInterval ?? ?? ??? ??? ??? ???.

??? ??? ???:

setDots((dots + 1) % 4);

??? ?????. ?????
??? ?????. "?? ?."-1s-"?? ?..". ??? ?? ????.

??: useEffect? ?? fn? ?? ?? ??(1)?? ??????. dots ??? ????? useEffect? ?? fn ??? ??? ?? ????.

Catch-1: useEffect? ??? ??? ?? ???? ?? ??? ????. ???? ?? ??? ????? ??? window.setInterval? ???? ?????. (?? window.setTimeout? ??? ? ????. ??? ? ?????)

Catch-2: Loading ?? ??? ?? ??? useEffect ? window.setInterval? ????? ???. ??? useEffect?? ?? ?? ???? useEffect? ?? ???? ???.

?? ??? ???? ?? ???? ?? ??? ???.

??? ???

useEffect? ?? ?? ?? ??(?: effectDots)? ?????. window.setInterval? ?? ??? effectDot? ????? ?? ?? ??? ?? ??? ?????.
(??? ???? setInterval -> ?? ??? ?? ???? ?? ??? ?? ?? -> setInterval? ???? ????. )

?? ?? effectDots? ???? useEffect ? window.setInterval? ?? ?? ??? ???????.

  useEffect(() => {
    let effectDots = 1;
    window.setInterval(() => {
      // increment, modulo 4
      // set the Loading component's state
      setDots(effectDots++ % 4);
    }, 1000);
  }, []);

? ??? ?? ?? ?? ??? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!