728x90
반응형

이벤트 2

React의 SyntheticEvent: 네이티브 이벤트와의 차이점부터 완벽 활용까지 🚀

React의 SyntheticEvent란 무엇일까?🚁React를 사용하다 보면 이벤트 객체가 SyntheticEvent라는 것을 알게 될 텐데요.“왜 React는 네이티브 DOM 이벤트를 그대로 사용하지 않고, SyntheticEvent라는 걸 따로 만들었을까?”이 글에서 React의 SyntheticEvent를 깊이 파헤치고, 네이티브 이벤트와의 차이점, 그리고 실무에서 마주칠 수 있는 상황까지 모두 다뤄보겠습니다.SyntheticEvent란? 🤔SyntheticEvent는 React에서 DOM 이벤트를 감싸서 제공하는 래퍼 객체입니다.React는 브라우저 간의 일관성을 보장하고, 성능 최적화를 위해 이 SyntheticEvent를 사용합니다.  한마디로: SyntheticEvent는 네이티브 DO..

Front-end/React 2024.11.28

이벤트 핸들링: 알아두면 일당백! 🎯

이벤트 핸들링, 무엇이고, 어떻게 사용할까? 🎯이벤트 핸들링은 웹 개발에서 빠질 수 없는 기본 중의 기본!버튼 클릭, 키보드 입력, 마우스 움직임 같은 사용자와 웹 애플리케이션 간의 상호작용을 처리하는 게 바로 이벤트 핸들링입니다.오늘은 DOM 이벤트와 React 이벤트 시스템의 차이점, 주의해야 할 점, 실무에서 유용한 팁까지 전부 싹~ 정리해볼게요.이벤트란 무엇인가요? 🧐이벤트는 “사용자와 브라우저 간의 대화”라고 할 수 있어요.예를 들어 사용자가 버튼을 클릭하면, 브라우저는 “지금 클릭했어!“라는 신호(이벤트)를 알려주는 거죠.이벤트 처리 흐름이벤트 발생: 사용자가 버튼을 클릭하거나 키보드를 누름이벤트 전달: 브라우저가 해당 이벤트를 DOM(Document Object Model) 요소에 전달이..

Front-end/React 2024.11.27
728x90
반응형