공부블로그

이벤트( Event ): 사용자가 웹 브라우저에서 DOM요소들과 상호작용하는 것 예를 들어 HTML에서 DOM요소에 이벤트를 설정하는 방법을 살펴보자. //누르면 alert함수를 사용해서 executed문구의 메시지 박스를 띄움 Click me //이 문구의 버튼을 HTML에서는 이벤트를 실행하면 " " 사이에 있는 자바스크립트를 실행하도록 작성한다. 4. 1 ) 리액트의 이벤트 시스템 Say. js import React, { useState } from "react"; const Say = () => { const [message, setMessage] = useState(""); //useState의 인자에는 상태의 초기값을 넣어줌 const onClickEnter = () => setMessage..

리액트를 사용하여 애플리케이션의 인터페이스를 설계할 때, 사용자가 볼 수 있는 요소는 여러가지 '컴포넌트'로 구성되어 있다. 컴포넌트의 기능은 단순한 템플릿 이상이다. 데이터가 주어졌을 때 그에 맞추어 UI를 만들어 주기도 하고, 라이프사이클 API를 이용하여 컴포넌트가 화면에서 나타날 때, 사라질 때, 변화가 일어날 때 주어진 작업들을 처리할 수 있으며, 임의 메서드를 만들어 특별한 기능을 붙여줄 수도 있다. 이번 장에서는 새로운 컴포넌트를 만들고 사용하는 방법, 컴포넌트의 속성 값을 지닌 props와 상태 값을 지닌 state를 사용하는 방법을 알아보자. 3. 1) 클래스형 컴포넌트 - 2장에서 보았던 App컴포넌트는 함수형 컴포넌트이다. import React from 'react'; import ..