반응형
Babel이란?
- React 프로젝트 생성 도구 내부에 기본적으로 Babel이 구성되어 있습니다.
- 즉, React를 사용하여 프로젝트를 구성한다는 것은 Babel을 사용하여 프로젝트를 구성한다는 것입니다.
- 브라우저는 JSX를 이해하지 못합니다.
- 그래서 Babel이라는 통역사로 JSX -> JavaScript로 변환해서 브라우저에게 알려줍니다.
- JavaScript는 시대가 변함에 따라 문법에 변화가 생겼습니다.
- JavaScript의 어떤 최신 문법들을 최대한 많은 브라우저가 호환할 수 있게끔 변환해 줍니다.
- => 브라우저의 버전이 최신 버전이 아니라면 해석할 수 있는 JavaScript의 문법이 최신 버전이 아닐 수 있기 때문
즉, Babel은 기본적으로 JSX의 문법을 JavaScript 문법으로 변환해서 브라우저에게 알려주는 동시에,
자바스크립트의 어떤 최신 문법들을 최대한 많은 브라우저가 호환할 수 있게끔 변환해 주는 도구라고 이해하시면 됩니다.
참고
만들면서 배우는 리액트 : 기초 강의 | 진유림 - 인프런
진유림 | 리액트를 가장 쉽고 빠르게 배울 수 있는 리액트 입문 강의입니다. 토이 프로젝트를 만들면서 개념과 실전 감각을 익히고 배포까지 3시간 만에 완성하는 알짜 강의! 초급, 중급, 고급으
www.inflearn.com
프론트엔드 개발자를 위한 웹팩 강의 | 장기효(캡틴판교) - 인프런
장기효(캡틴판교) | 1000명이 선택한 웹팩 강의! 새롭게 나온 웹팩 버전에 맞춰 리뉴얼된 강좌입니다. 실습 중심으로 더 쉽게 웹팩을 배워보세요 :), 날로 복잡해지는 프론트엔드 개발 생태계에서N
www.inflearn.com
반응형
'Frontend' 카테고리의 다른 글
| [ React ] Uncaught TypeError: users.map is not a function 오류 해결 방법 (0) | 2024.10.14 |
|---|---|
| [React] Warning: Encountered two children with the same key 오류 해결 방법 (1) | 2024.10.11 |
| [React] JSX란? 아주 쉽게 총 정리(+코드, 그림) (1) | 2024.10.08 |
| 알기 쉽게 정리한 package.json 총 정리 : 프론트엔드 개발자를 위한 웹팩 (1) | 2024.09.29 |
| Node.js와 NPM이란? 아주 쉽게 정리 (1) | 2024.09.25 |
댓글