기록하는 개발자

useInput - input 내용과 그에 따른 이벤트를 useState hooks를 통해 관리할 수 있다. import React, { useState } from "react"; import ReactDOM from "react-dom"; import "./styles.css"; const useInput = (initialValue, validator) => { const [value, setValue] = useState(initialValue); const onChange = (event) => { const { target: { value } } = event; // 위와 동일 : const { value } = event.target; let ..

https://ko.reactjs.org/docs/hooks-intro.html Hook의 개요 – React A JavaScript library for building user interfaces ko.reactjs.org Hooks 는 리액트 v16.8 에 새로 도입된 기능으로서, 함수형 컴포넌트에서도 상태 관리를 할 수 있는 useState, 그리고 랜더링 직후 작업을 설정하는 useEffect 등의 기능 등을 제공하여 기존의 함수형 컴포넌트에서는 할 수 없었던 다양한 작업을 할 수 있게 해준다. → class를 사용하지 않고도 함수형 프로그래밍을 가능하게 해준다. - this 등과 같은 문장 규칙과 render 등을 고려해야한다. exp..

component : html을 return하는 함수 react는 component를 사용하여 html처럼 작성하려는 경우에 필요하며, js와 html간의 조합을 jsx 라고 부른다. import React from "react"; import AppNamefrom "./AppName"; function App(){ return ( Hello! ); } export default App; 1. component를 작성할 때마다 React를 import해줘야한다. 그렇지 않으면 react는 jsx가 있는 component의 사용을 이해하지 못한다. → import React from "react"; 2. component 이름은 대문자로 시작해야한다. → appName(x) AppName(o) 3. ind..