TIL(Develop)/React3 [React] 페이지 로딩시에 단 한 번만 실행하기 (document.ready()같은 메서드) 원래는 습관적으로 이렇게 하고 있었는데 불필요하게 데이터를 매번 읽어와서 너무 비효율적이고 트래픽이 많아진 기분이 들어 더 찾아보았다useEffect(() => { handleGetConnection(useAuthStore.getState().currentCode); }, [rowData]); 빈 배열을 넣어주면 컴포넌트가 처음 마운트될 때 (페이지가 로드될때) 단 한 번만 실행되게 된다useEffect(() => { handleGetArsConnection(useAuthStore.getState().currentBotCode); }, []); 2024. 9. 27. [React] Destructuring assignment 어느날 갑자기 리액트를 하게 된 백엔드 개발자의 고군분투기...회사 : 풀스택 해 Java Kotlin 이제 다 필요없어... Destructuring assignment 정말 충격적으로 편리하다ES6 만세 감사합니다 그날도 힘겹게 리액트를 해내고 있던 백엔드 개발자 1은 신기한 코드를 마주하게 된다const Developer = ({ coffee, sweat, blood }: { coffee: string, sweat: number, blood: string }) => { console.log(coffee, sweat, blood);};interface Ingredient { coffee: string; sweat: string; blood: string;}const Developer = (in.. 2024. 9. 27. [React] React Hook 리액트 훅 어느날 갑자기 리액트를 하게 된 백엔드 개발자의 고군분투기...회사 : 풀스택 해 React Hook이란?리액트 훅(React Hooks)은 함수형 컴포넌트에서 상태(state)와 생명주기(lifecycle) 관련 기능을 사용할 수 있게 해주는 React의 기능이다.리액트 훅이 등장하기 전에는 클래스형 컴포넌트만 상태 관리와 생명주기 기능을 사용할 수 있었으나, 훅 덕분에 함수형 컴포넌트에서도 이러한 기능을 쉽게 사용할 수 있게 되었다**useState**상태를 함수형 컴포넌트에서 관리하기 위한 훅입니다.초기 상태를 인자로 받고, 배열을 반환하며, 배열의 첫 번째 요소는 현재 상태 값, 두 번째 요소는 그 상태 값을 업데이트하는 함수const [count, setCount] = useState(0);fu.. 2024. 9. 26. 이전 1 다음
