패스트캠퍼스 챌린지 22일차 - 바벨과 JSX
0. 공부 인증
공부 시작 22 : 53
공부 종료 23 : 30
오늘부터는 하루에 한강만 수강할 예정이다.
패스트 캠퍼스 챌린지도 중요하지만..... 학과 과제도 쌓여있기 때문에, 적절하게 시간 분배를 해야할 것 같다.
시험기간에도 패캠 챌린지를 할 수는 없으니...
1. 바벨과 JSX
앞선 강의에서 처럼 CDN을 통해서 리액트를 제작하는 것은 끔찍함.
그래서, 이런 불편한 것들을 해결하고자 새롭게 나온 것이 JSX 임!
JSX에 대해서 설명된 리액트 문서
https://ko.reactjs.org/docs/introducing-jsx.html#gatsby-focus-wrapper
JSX 소개 – React
A JavaScript library for building user interfaces
ko.reactjs.org
사실상 자바스크립트 확장 문법.
html DOM 요소를 변수에 담아서 활용할 수 있음.
그런데 JSX는 모든 브라우저에서 지원하지 않을 수 있음.
그래서 이것을 위한 것이 또 있음.
그것이 바벨인데, 어렵다고 들었음. (어렵나?)
https://ko.reactjs.org/docs/faq-build.html#gatsby-focus-wrapper
Babel, JSX, 그리고 빌드 과정들 – React
A JavaScript library for building user interfaces
ko.reactjs.org
현재 최신 문법을 과거의 문법으로 고쳐주는 것임.
그래서 존재하는 대부분의 브라우저에서 작동을 가능케 해줌.
여튼 JSX를 통해서, 코드를 훨씬 간결하게 수정할 수 있고, 이벤트도 기본 HTML 처럼 수정할 수 있음.
<div onClick={() => {onEvent()}}>
</div>
와 같이 활용할 수 있음.
그리고 이 강의 다음으로 웹팩을 사용하는데,
이 강의와 연결해서 들으면 좋음.
이 두가지(바벨, 웹팩)을 활용하면 대부분의 브라우져에서 돌아가는 로딩이 비교적 빠른 웹페이지를 만들 수 있다고 함!!
오늘은 여기까지!
환급 챌린지 (22/30)
본 포스팅은 패스트캠퍼스 환급 챌린지 참여를 위해 작성되었습니다.
패스트캠퍼스 [직장인 실무교육]
프로그래밍, 영상편집, UX/UI, 마케팅, 데이터 분석, 엑셀강의, The RED, 국비지원, 기업교육, 서비스 제공.
fastcampus.co.kr
#패스트캠퍼스 #패캠챌린지 #직장인인강 #직장인자기계발 #패스트캠퍼스후기 #한번에끝내는Node.js웹프로그래밍초격차패키지