클릭하면 동작하는 UI 만드는법 숙제관련 질문

클릭하면 동작하는 UI 만드는법 수업 듣다가 질문드립니다 

모달창이 클릭에 따라 열리고 닫히는 숙제 구현중에 아래와 같이 시도했지만 실패하였습ㄴ니다.

 컨포넌트는 저위치에서 사용못하는건지 아니면 다른게 문제인건지 모르겠습니다 

function App() {

let[modal,modal변경]=useState(false);

function 상태변경(){
    modal변경(!con);
    var con=[...modal]; 
    con===true
    ? <Modal></Modal>
    : null  
  }

 return (

<div className="App">

<button onClick={상태변경}>버튼3</button>

    </div>
  );
}

function Modal(){ // compoenet 문장
return(
  <div className="modal">
        <h2>제목</h2>
        <p>날짜</p>
        <p>상세내용</p>
      </div>
)
}