패스트캠퍼스 챌린지 20일차 - 한 번에 끝내는 React의 모든 것 초격차 패키지 Online

2022. 2. 12. 10:10공부/패스트캠퍼스

수강 인증샷

 


패스트캠퍼스 챌린지란?

 패스트캠퍼스에서 진행하는 '50일 공부 루틴 챌린지' 행사로 50일 동안 매일 수강 인증샷과 함께 학습 기록을 게시글로 남기는 행사다.


20일차

 20일차에는 Part 1. React 기초 Ch 02. React 공식 문서로 디테일잡기(초급) 챕터에서 03. JSX 강의 내용을 기록하려 한다.

Part 1. React 기초 Ch 02. React 공식 문서로 디테일잡기(초급) 챕터에서 03. JSX 강의에서 JSX가 무엇인지 Part 1. React 기초 Ch 01. React 맛보기 챕터에서 배운 적 있었지만 챕터의 제목처럼 JSX를 좀 더 디테일하게 배우는 시간을 갖는다. React를 쓸 때 JSX를 쓰지 않고도 React를 쓸 수 있다. React를 사용할 때 JSX가 필수가 아니기도 하고 빌드 환경에서 컴파일 설정을 하고 싶지 않을 때 JSX 없이 React를 사용하는 것이 편리하다는 이점이 있다. JSX 엘리먼트는 React.createElement(component, props, children)를 호출하기 위해 사용되는 편리한 문법이기 때문에 JSX로 할 수 있는 것은 모두 순수 JavaScript 로도 할 수 있다.

 하지만, JSX는 UI가 어떻게 생겨야 하는지 설명하기 위해 React와 함께 사용할 것을 권장하는 것이 React 공식 문서의 설명이다. 권장에 대한 이유로는 대부분의 사람들이 JavaScript 코드 안에서 UI 관련 작업을 할 때 시각적으로 더 도움이 된다고 생각하기 때문이다.

 JSX도 결국 표현식이기에 컴파일이 끝나면, JSX 표현식이 정규 JavaScript 함수 호출이 되고 JavaScript 객체로 인식된다. 즉, JSX를 if 구문 및 for loop 안에 사용하고, 변수에 할당하고, 인자로서 받아들이고, 함수로 반환할 수 있다.

 


본 게시글은 이벤트 참여를 위해 작성된 게시글입니다.

 


패스트캠퍼스 공식 홈페이지 : https://bit.ly/37BpXiC