본문 바로가기
반응형

Framework43

useEffect() useEffect() side effect를 수행하기 위한 Hook 리액트의 side effect는 효과, 영향을 말한다. 예를 들면 서버에서 데이터를 받아오거나 수동으로 DOM을 변경하는 작업들을 말한다. 이러한 작업이 effect라 불리는 이유는 다른 컴포넌트에 영향을 미칠 수 있으며, 렌더링 중에는 작업이 완료될 수 없기 때문이다. 즉 렌더링이 끝난 이후에 실행되어야 하는 작업들이다. 이러한 작업이 side로 실행된다는 의미에서 side effect라 불린다. // import logo from './logo.svg'; import './App.css'; import { useEffect, useState } from 'react'; function App() { const [count, setCo.. 2022. 9. 29.
class 컴포넌트에서 function 컴포넌트로 컴포넌트 자체를 바꾸기 class 컴포넌트 extends Component ~ 지우기 export default class App extends Component { ~ 🔽 export default function App() { ~ render함수 없이 바로 return() class 컴포넌트는 render()안에 return() 함수형 컴포넌트는 render()없이 바로 return() render() { return ( ...내용 ) } 🔽 return ( ...내용 ) [state바꾸기] useState Hook을 이용해서 표현하기 react에서 useState를 가져와서 사용한다. const [todoData, setTododata] = useState([]) useState의 인수 todoDa.. 2022. 9. 26.
React 기초 지식 Node.js( javascript runtime), npm(node package manager) 설치 IDE(Integrated Development Environment)로 vscode 설치 [React CDN 사용] DOM Container(Root DOM Node) 추가하기 리액트 사용해보기 [create-react-app 사용] Node.js v14.0.0 이상 npm v6.14.0 이상 npx : create-react-app npx create-react-app my-app으로 설치 # 경로 변경 ( change directory) $ cd my-app # 애플리케이션 실행 $ npm start - 로컬 환경 실행 [JSX] A syntax extension to JavaScript 자바스.. 2022. 9. 5.
728x90
반응형