본문 바로가기

Develop/React2

[React] 처음 만난 리액트 section(3~5) Section 3. JSX JSX의 정의와 역할A syntax extension to JavaScriptJavaScript + XML/HTML내부적으로 XML/HTML 코드를 JavaScript 코드로 변환하는 역할을 함JSX를 사용하면 react에서는 내부적으로 createElement 함수를 사용하도록 변환 됨JSX의 장점 및 사용법간결가독성 향상버그 발견 쉬움Injection Attacks 방어XML/HTML 코드 사이에 { } 를 사용해서 js 코드를 넣어주면 됨 (실습)JSX 코드 작성해보기import React from "react";function Book(props) { return ( {`이 책의 이름은 ${props.name} 입니다.`} {`이 책은 총 ${props.num.. 2024. 5. 18.
[React] 처음 만난 리액트 section(0~2) Section 0. 준비하기 HTML과 CSShtml은 뼈대 css는 레이아웃 SPA(Single Page Application)하나의 페이지만 존재하는 웹 사이트 / 웹 애플리케이션기존 방식: multi page application 사용자가 페이지 요청할 때 마다 새로운 페이지가 로드됨SPA: html 파일이 하나만 존재. 단 하나의 페이지만 존재. body 태그의 내부가 동적으로 채워짐. 리액트가 이를 수행 JavaScript 소개 및 자료형ECMAScript Script Language 특징런타임시에 코드가 해석되고 실행됨 Data Type자바스크립트는 동적타이핑 방식을 사용. 변수의 자료형이 선언 시가 아닌 대입되는 시점에 정해짐 JavaScript의 연산자대입 연산자사칙연산증감연산(전위, 후위.. 2024. 5. 18.