<Zipcode placeholder="07250" readOnly />
readonly = 읽기 전용 수정 불가
disabled = 비활성화
컴포넌트: 다른 곳에서 import해 재사용 (margin 보다 padding사용)
리액트 쓰는 이유
1. 쓰는 사용자가 많다
2. 리액트 React.js, React-Native 앱(크로스플랫폼), React+Eletron pc앱
All In One
React의 핵심
Component
UI 또는 기능을 부품화 해서 재사용 가능하게 하는 것
import 원본이 있는 것( 원본이 통제 = 원본 바뀌면 모두 바뀜) 내용은 바꿀 수 있음
즉, UI의 재사용
모두 컴포넌트가 될 수 있다, 페이지도 하나의 큰 컴포넌트
만들어본 function -> 컴포넌트 ( 페이지 컴포넌트 ) -> 함수형 컴포넌트
component 만드는 방법
클래스형, 함수형
함수형 쓰는 이유: 코드 길이가 짧다.( 화살표 함수 표현 )
처음에는 클래스를 썼는데 hooks을 쓰며 함수 컴포넌트를 쓰게 되었다. (use~~)
Hooks? use로 시작하는 애들 -> useState, useEffect, ...
useState? -> State 만들어 주는애
state -> component 전용 변수
const[ state, setState ] = useState("철수")
state = 변수명
setState = 변수바꾸기(함수)
useState = 변수만들기
"철수" = 초기값
const[ count, setCount ] = useState(0)
console.log(count) <- 사용법
setCount(1) <- 바꾸는법
State 이해하면 documnet.getEle~ 안씀 ( let을 사용하는 것 보다 훨씬 편함 )
API 함수 DB 엑셀
입력값을 state에 담아야함
이벤트 핸들러 함수
onChange
12.1.0 17.0.2
제대로 못함