질문 내용을 입력해 주세요.

버튼 클릭시 handleClearClick 함수가 실행되어 alert 가 떠야하는데

제 코드상으론 그냥 홈페이지 렌더링 될때 alert 뜨고, 버튼 누르면 아무동작하지않네요

이런 오류는 왜 발생하는건가요?

풀코드 첨부합니다

코드는 여기 코드블록에 입력해 주세요.

import logo from './logo.svg';
import './App.css';
import HandIcon from './HandIcon';
import HandButton from './HandButton';
import {useState} from 'react';
function App() {
    var [Hand, setHand] = useState(0);
    var [otherHand, setotherHand] = useState(2);
    // var [Hand,setHand] = useState(2);
    function generateRandomHand() { // setotherHand(1);
        otherHand = Math.ceil(Math.random() * 3);
    }
    // 내가 누른 Hand 값 저장하는 함수
    function hand(n) {
        alert('Hand 변경!');
        Hand = n;
    }
    // //이 함수를 누르면 위에서 결정된 두값이 들어가고 재렌더링
    // function handleButtonClick(){
    // setHand(Hand);
    // setotherHand(generateRandomHand())
    // }
    // 둘이 비교해서 결과 출력하는 함수
    function getResult(hand, otherHand) {
        if (hand > otherHand) 
            return '너님의 승리';
        
        if (hand < otherHand) 
            return '너님의 패배';
        
        return '비김여';
    }
    // //Hand,otherHand 초기화 함수
    function handleClearClick() {
        // setHand('0');
        // setotherHand('0');
        alert('처음으로');
    }
    function test() {
        alert('it is ok');
    }
    return (<div className="App">
        <header className="App-header">
            <h1 id="title">
                가위바위보 해드립니다 ㅎㅎ
            </h1>
            PC  &nbsp;
            <HandButton value={otherHand}
                onClick={0}/>
            &nbsp; VS &nbsp;
            <button onClick={
                hand(1)
            }>
                click me
            </button>
            {/* 너님 <HandButton value={hand(1)} onClick={generateRandomHand()}/>*/}
            <h2> {
                getResult(Hand, otherHand)
            } </h2>
            <h3>
                hand is '{Hand}' otherHand is '{otherHand}'</h3>
            <br></br>
            <HandButton value={0}
                onClick={Hand}/>
            <HandButton value={1}
                onClick={Hand}/>
            <HandButton value={2}
                onClick={Hand}/>
            <button onClick={
                handleClearClick()
            }>처음으로</button>
            <img src={logo}
                className="App-logo"
                alt="logo"/>
            <p>
                Edit
                <code>src/App.js</code>
                and save to reload.
            </p>
            <a className="App-link" href="https://reactjs.org" target="_blank" rel="noopener noreferrer">
                Learn React
            </a>
        </header>
    </div>);
}
export default App;