[React] - React Intro (리액트 기초)

🧐 React 란 무엇일까?

React는 facebook(현재는 Meta)에서 개발한 오픈소스 자바스크립트 라이브러리 이다.

1. 리액트는 컴포넌트 기반.

• 리액트는 컴포넌트 기반의 라이브러리 이다.
• 컴포넌트란 웹페이지에서 화면을 이루는 작은 요소들이다.
• 컴포넌트들은 여러화면에서 재사용이 가능하며 독립적이다.

2. JSX(JavaScript XML).

JSX 란 React에서 UI를 구성할 때 사용하는 문법으로 JavaScript를 확장한 문법이다. 우리는 이것을 사용하여 React엘리먼트를 만들 수 있다.

JSX 를 사용하지 않으면 css,js파일,html 파일 각각 따로 분리하여 만들어주어야만 했다. 하지만 JSX를 사용한다면 js파일과html를 한곳에서 코딩하여 이 코드가 어떤동작을 할지 한번에 알수있고 이것의 한묶음을 컴포넌트라고 한다.

• 컴포넌트예시
• 출처 - https://ko.reactjs.org/

🤯JSX 사용시 주의할점.

1.JSX 에서 여러개의 엘리먼트를 작성해야하는경우 하나의 최상위 엘리먼트로 묶어줘야한다.

2.React 에서 CSS class 속성을 지정하려면 class 가 아닌 className 로 작성해야한다.

3.JSX 에서 JavaScript를 쓰고싶다면 중괄호{} 를 써야한다.

4.React 의 컴포넌트 첫글자는 JSX로 작성됐다면 대문자로 시작해야한다.