jsx 검색 결과

해당 글 2건

[JSX]: JS와 JSX 확장자는 무엇이 다를까?

JSX: Javascript XML 1) Javascript에서 HTML을 사용할 수 있게 하는 리액트만의 문법(syntax)을 말한다. 2) html안에 변수를 넣으려면 { }로 감싼다. 3) html의 attribute를 다르게 쓴다. class대신 className, onclick대신 onClick 등 JSX는 react 파일의 확장자로써의 상징적인 의미를 갖는다. ECMAScript가 Javascript의 표준과 규격등 문법에 관해 사용할 때 쓰는 것처럼, JSX도 JS의 파일에 React 라이브러의 표준을 따른다는 의미로써 사용되는 확장자다. 다만, 둘을 구분지으면서 얻는 이익이 딱히 없고, JS파일에 JSX로 코드를 작성하면, CRA와 같은 툴체인에 의해 JS 코드로 변환해주기 때문에 실제로 ..
🌕 Front/⚛️ React JS 2021. 9. 7. 09:37

[리액트 삼대장]: Component, State, Props

1. 컴포넌트 1) 기능을 단위별로 캡슐화하는 리액트의 기본 단위 2) 사용자가 보는 뷰는 컴포넌트들을 조합하여 만든다. 3) 함수 혹은 클래스로 만든다. 4) 상위 컴포넌트에서 props를 입력받고, 내부적으로 각자의 state를 관리한다. 5) 컴포넌트의 이름은 대문자로 시작한다. import React from "react"; import ReactDOM from "react-dom"; import App from "./App"; import Milk from "./Milk"; ReactDOM.render( , document.getElementById("root") ); 컴포넌트는 반드시 하나의 태그만 리턴할 수 있기 때문에, 최상위 태그 안에 태그/컴포넌트들을 배치한다. 2. State - 변수..
🌕 Front/⚛️ React JS 2021. 2. 2. 16:49