리액트 - 브라우저에서 구동되는 원리

웹브라우저는  리액트로 작성한 JSX 코드를 이해할 수 없다. 

 

따라서 순수 자바스크립트 언어로 번역을 해서 구동하게 되는데 

이걸 테스트해볼 수 있는 사이트는 https://babeljs.io/

Babel · Babel

코드를 번역하는 과정을 트랜스파일링 Transpiling, 코드를 번역해주는 주체를 트랜스파일러 Transpiler라고 한다.

 

즉 Babel은 대표적인 자바스클비트 트랜스 파일러 이다. 

---

트랜스파일링 번역된 코드들은 번들링을 통해 웹브라우저가 다운받기 좋도록 묶음으로 만들어진다. 

 

빌드할때 소스 코드 파일들을 압축해서 묶어놓은 파일이 생성된다.  = 번들