728x90 반응형 react4 react로 GA(google Analytics) mobile tracker 만들기 import { useEffect, useRef, useState } from "react"; import { useTracker } from "./util/Tracker"; export const Mobile = () => { const tracker = useTracker(); const [foldState, setFoldState] = useState(false); const ref = useRef(null); const [isTracked, setIsTracked] = useState(false); useEffect(() => { const observer = new IntersectionObserver( (entries) => { entries.forEach((entry) => { // 요소가 .. 2024. 1. 30. react 라이브러리 styled components css문법 그대로 style을 작성하게 해주는 녀석 https://styled-components.com/ const Button = styled.button` background: transparent; border-radius: 3px; border: 2px solid #BF4F74; color: #BF4F74; margin: 0.5em 1em; padding: 0.25em 1em; ${props => props.$primary && css` background: #BF4F74; color: white; `} `; const Container = styled.div` text-align: center; ` render( Normal Button Primary Button ); 2023. 7. 13. reacthook useCallback 1. useCallback useCallback: useCallback hook은 콜백 함수를 memoize하여 새로운 함수 인스턴스를 생성하는 것을 최적화합니다. 의존성 배열에 기반하여 새로운 콜백 함수 인스턴스를 생성하고, 의존성이 변경되지 않으면 이전에 생성된 콜백 함수 인스턴스를 재사용합니다. 이를 통해 자식 컴포넌트에 전달되는 콜백 함수들이 불필요한 재렌더링을 방지할 수 있습니다. import { useCallback, useState } from 'react'; function Counter() { const [count, setCount] = useState(0); const increment = useCallback(() => { setCount(prevCount => prevCount +.. 2023. 6. 29. react, typescript 유용한사이트 타입스크립트 : https://driip.me/b812974b-3974-46e3-829e-1476b9b30c94 TypeScript 타입 정의 읽기 — 몇 가지만 알면 쉬워요 아마 조금 더 쉬워질걸요? driip.me 리액트 : https://react.gg/visualized 2023. 4. 11. 이전 1 다음 728x90 반응형