JS 2

React.js - 이벤트 처리하기, State로 상태관리하기, State와 Props, State로 사용자 입력 관리하기 1

이벤트 처리하기// Button.jsxconst Button = ({ text, color, children }) => { // 이벤트 객체 const onClickButton = () => { console.log(text); }; return ( {text} - {color.toUpperCase()} {children} );};Button.defaultProps = { color: "black",};export default Button;  버튼을 클릭하거나 마우스를 갖다대는 등의 이벤트를 처리하는 '이벤트 핸들링'을 배웠다.  button 태그 내부에 이벤트 이름을 입력하고, 화살표 함수 ()=>{} 를 중괄호 안에 넣어주는 방법이 있다. 만약 내부 ..

React.js - 소개, App 생성, App 구동

- React.js는 어떤 기술이며 왜 활용되나요?  리액트는 자바스크립트 라이브러리이다. 브라우저의 UI 작업을 처리하며, 이를 유용하게 해주는 도구들의 묶음인 라이브러리는 npm i 또는 npm install 명령어를 이용해서 쉽게 다운로드 할 수 있다. 리액트 앱을 만드는데 필요한 기본적인 도구들은 vite(프론트엔드 빌드 도구)를 사용해 쉽게 가져올 수 있다. - React App은 어떻게 생성할 수 있나요?  먼저 패키지를 생성해야 한다. vite를 이용한다면 npm create vite@latest 명령어를 입력한다. 패키지 이름과 기본 설정들을 선택하면 폴더, 즉 패키지가 생성된다. 해당 폴더에 들어간 뒤 터미널에 npm i 를 입력해 라이브러리를 다운로드 해준다. - React App은 어..