또라에몽의 개발 주머니

DOM에 ref 걸어놓고 감지되는 것을 감지해서 css를 activate 시키는 기능을 추가 시켜야했다 브라우저 감지 인터페이스는 JS에 여러가지가 있는데 IntersectionObserver : 루트 영역(뷰포트) 와 대상 객체의 겹침을 인지 MutationObserver : 객체 속성 변경을 감지 PerformanceObserver : 프로세스 성능 모니터링 ReportingObserver : 웹 사이트 표준, 정책 준수 현황 감시 ResizeObserver : 객체의 너비, 높이의 변화 감지 오늘은 MutationObserver를 정리해보려고 한다. https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver MutationObserver -..

회사 업무로 ref를 쓰다가 다른 컴포넌트(자식)내에서 ref를 써야하는 상황이 생겼다 하지만 되지 않았다! 그래서 다시 처음부터 Ref를 공부하게 되었다. https://www.daleseo.com/react-forward-ref/ https://www.daleseo.com/react-forward-ref 이 분들의 블로그를 차근차근 따라서 해봤다 이렇게 같은 컴포넌트 내에서 ref를 props로 넘겼을 경우에는 focus가 잘 작동하였다! 하지만 이렇게 자식 컴포넌트로 따로 만들어서 ref를 props로 내리니까 foucus가 되지 않았다 친절하게 이렇게 warning도 내준다 왜 안될까? 정답은 document에 있었다 함수 컴포넌트는 인스턴스가 없기 떄문에 함수 컴포넌트에는 ref attribut..

회사에서 회사 홈페이지와 인스타그램 연동 업무를 주셔서 처음으로 도전하게 되었다! 기존 포스팅을 열심히 봤는데 서버를 구동해야한다는 말도 있고 라이브러리를 써도 된다고 하고,, 아주 복잡해~~~ 2시간 삽질 끝에 드디어 해냈다!!! 내가 해냄!!!!! 일단 인스타그램 api 를 사용하기 위해서는 1. 인스타그램이 프로페셔널 계정으로 전환되어야한다. 2. 적용할 사이트가 HTTPS 사이트여야한다 1. 페이스북(META) 개발자 페이지에 접속 후 로그인 > 내 앱 > 앱만들기 https://developers.facebook.com/?locale=ko_KR Facebook for Developers Messenger를 사용한 로그인 연결 정식 출시 이제 타겟 고객을 위해 더욱 심층적인 고객 관리를 지원하고 ..