02. React- jsx

jsx

- JSX(JavaScript XML)는 JavaScript의 확장 문법으로, React에서 UI를 작성하는 데 사용됩니다. JSX는 HTML과 비슷한 구문을 사용하여 UI 요소를 작성할 수 있으며, JavaScript 코드와 결합하여 동적인 UI를 생성하는 데에 유용합니다.

 

Counter 폴더를 생성하여 jsx 문법을 활용한 카운터 프로그램을 작성해보겠습니다.

 

 

문제.
아래와 같은 카운터 프로그램을 작성해보자.
- 두 카운트의 합이 TotalCount에 표기
- 두 카운트의 숫자는 별개로 함
- TotalCount의 값이 10보다 작으면 👎🏽 출력하고, 10보다 크면 👍🏽를 출력

 

cmder에서 위의 코드를 실행하여 default로 파일을 설정할 수 있습니다.

AppCounter.jsx

components폴더 -> Count.jsx

 

App.css