React에서 배열에 반응형으로 추가하기

배열에 요소를 반응형으로 추가하는 것을 작업해 봅시다. 예를 들어 목록 ul으로 출력되는 배열이 있다고 가정해 보겠습니다:

jsxfunction App() {
  const [notes, setNotes] = useState([1, 2, 3, 4, 5]);
  
  const result = notes.map((note, index) => {
    return <li key={index}>{note}</li>;
  });
  
  return <div>
    <ul>
      {result}
    </ul>
  </div>;
}

Задание 1

버튼을 만들어 클릭 시 배열 끝에 새 요소를 추가하여, ul 태그 끝에 새로운 li가 추가되도록 하세요.

Задание 2

입력 필드와 버튼을 만드세요. 버튼을 클릭하면 입력 필드의 텍스트가 ul 태그의 끝에 새로운 li 태그로 추가되도록 하세요.