bananackck

[블로그 이전]

2023.08.07

React.createElement('div', null, 'Hello, ${name}');

<div>Hello, {name}</div>

const element = {
    type: 'div',
    props:{
        className: null,
        children: 'Hello, $(name)'
    }
}

물론 저 한 줄로 생성해주는 건 아니고 그냥 그런 개념이다~ 하고 생각하기.

​

​

구두점 `

​

​

< element >

: 화면 상에 눈으로 보이는 것

​

- react element : 리액트의 virtual DOM에 존재

↓ rendering

- DOM element : 실제 DOM에 존재

​

- 불변성 (element 생성 후에는 children이나 prop를 바꿀 수 없다.)

-> element를 바꾸어야 할때는? (= 화면에 나오는 것이 바뀌어야 할때는?)

: 새로운 element를 만들어 기존과 교체

[블로그 이전]

2022.03.08

1. 리액트란?

: 자바스크립트 라이브러리의 하나로서 사용자 인터페이스를 만들기 위해 사용된다.

- 싱글 페이지 애플리케이션이나 모바일 애플리케이션 개발에 사용될 수 있다.

- JS 언어를 사용한 것과 호환된다.

​

2. package.json 파일 만들기

💗 명령어 : npm init

- package name : 이름

- author : 작성자

- license : MIT

​

3. package.json에 설치 코드

💗 명령어 : npm i / (개발자모드로->) npm i -D

- 여러개 한 번에 설치 시 띄어쓰기로 구분

​

3. 실행 코드

💗 명령어 : npm run dev

​

​