Vanilla js로 반응성 구현하는 패턴

✅ 반응성 (Reactivity): 시스템이 데이터의 변화에 반응하는 방식 리액트와 같은 프레임워크를 사용하면 데이터의 변화에 따라 UI를 업데이트 하는 등의 동작을 관리하는 것이 익숙합니다. 같은 기능을 순수 자바스크립트로 구현한다면 어떻게 이와 유사하게 선언적인 프로그래밍을 할 수 있을까요? 반응형 패턴을 통해 바닐라 자바스크립트로 반응성을 구현하는 방식에 대해 작성한 원문을 번역한 글입니다. ✅ 바닐라 자바스크립트로 반응성을 구현하는 패턴 1️⃣ PubSub 패턴 : publish()로 이벤트 발행 + subscribe()해 이벤트를 구독 ▪️ CustomEvent, window.dispatchEvent 사용가능 2️⃣ Observer 패턴: 특정 주체를 구독 > 주체가 notify메서드를 실행하면, 주체를 구독한 모든 것에게 알림 ▪️ PubSub 패턴과의 차이점: 주체가 옵저버에 대해 알고 있으며 이를 제거할 수 있음 3️⃣ Proxy를 활용한 반응형 객체 프로퍼티 4️⃣ 반응형 시스템: 옵저버블, Signals 등 5️⃣ UI 반응형 렌더링 7️⃣ 그 외 다양한 방법들 https://ktseo41.github.io/blog/log/patterns-for-reactivity-with-modern-vanilla-javascript.html