minXD's blog

2일차 리액트에서 다루는 데이터는 props와 state가 있다. props 부모 컴포넌트가 자식 컴포넌트에게 주는 값. 자식 컴포넌트에서는 props 수정 불가. // MyName.js import React, { Component } from "react"; class MyName extends Component { render() { return 안녕하세요! 제 이름은 {this.props.name} 입니다.; // this.props을 통해 props 값 참조 } } export default MyName; // App.js import React, { Component } from "react"; import MyName from "./MyName"; class App extends Compon..

객체의 사용 // 배열 const memberArray = ["egoing", "graphittie", "leezhce"]; console.log("memberArray[2]", memberArray[2]); // 객체의 정의 const memberObject = { manager: "egoing", developer: "graphittie", designer: "leezhce", }; memberObject.designer = "leezche"; // 객체의 데이터에 접근 console.log("memberObject.designer", memberObject.designer); console.log("memberObject['designer']", memberObject["designer"]); //..

CRA을 통한 프로젝트 생성 npx create-react-app my-app cd my-app npm start (or yarn start) npm이 아닌 npx를 사용하는 이유 : npm을 이용해 전역 설치를 할 경우 최신버전으로 업그레이드를 수동으로 해줘야 한다. 특히 React는 업데이트가 매우 빈번하기 때문에 npm으로 설치할 경우 버전관리가 어렵다. 하지만 npx는 최신버전의 CRA를 일시적으로 설치 후 실행한 다음 바로 삭제시키기 때문에 CRA에 대한 버전 관리를 할 필요성이 없어진다. JSX 문법 열린 태그는 반드시 닫아줘야 함 ex) br, input 등을 포함한 모든 태그 두 개 이상의 엘리먼트는 반드시 하나의 엘리먼트로 감싸져야 함 Hello Bye { /* 또는 를 사용*/ } 자바..