분류 전체보기110 [React] useEffect useEffect import { useEffect } from 'react'; function MyComponent() { useEffect(() => { // Code here will run after *every* render }); return ; } 구성 요소가 렌더링될 때마다 React는 화면을 업데이트 한 다음 내부의 코드를 실행한다. React에서 렌더링은 JSX의 순수한 계산이어야 하며, DOM 수정과 같은 부작용을 포함해선 안된다. 렌더링 중에 DOM 노드로 작업을 시도하기 떄문에 아래의 코드는 문제가된다. * JSX 순수한 계산 : https://react.dev/learn/keeping-components-pure : 순수 함수는 계산만 수행하며 그 이상은 수행하지 않는다. 구성 .. 2023. 9. 21. [React] useRef 😀 useRef import { useRef } from 'react'; const ref = useRef(0); { current: 0 // The value you passed to useRef } ex) ref.current 1. useState는 상태의 값이 변경 시, 재렌더링을 하지만, useRef는 상태가 변경되어도, 렌더링 되지 않으며, 화면이 렌더링이 될때 useRef의 상태의 값이 변경된다. (useRef의 값이 변경되어도, 렌더링을 트리거하지않는다) ex1) 버튼 클릭 시, useState의 상태값인 count의 숫자가 + 1 씩 올라간이후, count 텍스트가 변경된다. const [count, setCount] = useState(0); {count} setCount(count + .. 2023. 9. 20. [React] Vite React Project Setting Vite - 프랑스어로 빠른 이라는 뜻을 가짐. - 웹 프로젝트에 더 빠르고 효율적인 개발환경을 제공하는 것을 목표로 하는 빌드 도구 설치 $ npm create vite@latest my-proejct 실행 $ npm install $ npm run dev 2023. 9. 20. [NestJS] custom-providers https://docs.nestjs.com/fundamentals/custom-providers Documentation | NestJS - A progressive Node.js framework Nest is a framework for building efficient, scalable Node.js server-side applications. It uses progressive JavaScript, is built with TypeScript and combines elements of OOP (Object Oriented Programming), FP (Functional Programming), and FRP (Functional Rea docs.nestjs.com 😀 custom-provi.. 2023. 9. 11. 이전 1 ··· 21 22 23 24 25 26 27 28 다음