코딩하는라민

[React] JSX 이해하기 📌 사용자 정의 컴포넌트 ✅ Import 상단에 다른 곳에 정의된 코드를 불러와 현재 문서에서도 사용할 수 있게 해준다. 리액트 라이브러리 불러오기 import React from 'react'; JSX 를 사용하기 위해서는 React 라이브러리를 파일로 불러와야한다. 단, cdn 으로 스크립트 태그를 넣었다면 React 는 전역변수이기 때문에 별도로 불러올 필요가 없다. CSS 파일 불러오기 import './style.css'; 이미지 불러오기 import logo from './logo.svg'; ✅ 렌더링 // HTML 파일 이 안에 들어가는 모든 요소를 ReactDOM에서 관리한다. React 에서는 일반적으로 하나의 루트 DOM 노드가 있다. 렌더링하기 위해서는 ..

[React] 리액트(React) 시작하기 / JSX와 create-react-app 📌 리액트란? 사용자 인터페이스를 만들기 위한 라이브러리이다. 다른 라이브러리들과 함께 특정 환경을 렌더링하는데 사용한다. → 프레임워크 ❌ 라이브러리 ⭕ 📌 자바스크립트와 다른점 리액트는 JSX 구문을 사용한다. JSX 구문은 자바스크립트의 구문을 확장한 HTML과 유사한 코드이다. 📌 리액트 사용하기 리액트를 브라우저 환경에서 사용하기 위해서는 html 파일에 react 와 react-dom 스크립트를 넣어줘야한다. 📌 JSX JSX 는 리액트와 함께 사용한다. 리액트에서 반드시 필요한 것은 아니다. 다만, JSX 를 사용하면 보다 코드가 더 간단해진다. JSX 는 DOM 요소를 추상화한 자바스크립트 객체인 Reac..