Click to Edit input창을 클릭하면 수정이 가능하고 다른 곳을 클릭하면 수정한 내용이 반영되는 컴포넌트 의사코드 span을 클릭하면 input으로 전환, input을 벗어나면 span으로 전환 true/false 관리할 useState 생성 onClick, onBlur 이벤트가 발생했을 때 boolean값 변경하는 함수 실행 onBlur 이벤트 발생시 input에 입력한 값을 업데이트해 span에 전달 코드 기억할 것 focus 사용자가 폼 요소를 클릭하거나 [tab]키를 눌러 요소로 이동하면 해당 요소가 포커스(focus) 주로 데이터 입력 준비를 의미, 포커싱이 이루어지는 순간 초기화 코드 실행 가능 autofocus : 페이지가 로드된 후 자동으로 해당 요소 포커싱 blur 요소가 포커스를 잃는 순간 주로 데이터 입력이 완료되었음을 의미, 데이터 체크 및 데이터 저장 서버 요청 등을 실행