인생은 회전목마 우린 매일 달려가

언제쯤 끝날진 잘 몰라

Study/React 2

[TIL] 벨로퍼트와 함께하는 모던 리액트(1)

리액트가 만들어진 이유 인터렉션이 자주 발생하고 이에따라 동적으로 UI를 표현해야 된다면 규칙이 너무 많아지고 관리도 힘들어진다. DOM을 직접 건드리며 작업하면 코드가 난잡해지기 쉽다. -> 그래서 나온 Ember, Backbone, AngularJS 등의 프레임워크 작동 방식을 쉽게 설명하자면 특정 js 값이 바뀌면 특정 dom 이 바뀌게 연결, 업데이트(작업 간소화) 리액트는 어떤 상태가 바뀔 때 DOM을 업데이트 하는게 아니라 아예 날리고 새로 만들어서 보여주면 어떨까 라는 아이디어로 시작 -> 어떻게 업데이트할지 고민X 하지만 실제로 다 날리고 새로 만들면 속도가 엄청 느려질 것 ->> 이걸 가능하게 해주는 Virtual DOM 말그대로 가상 DOM, 브라우저에 실제로 보여지는 게 아닌 메모리에..

Study/React 2023.12.19

React(리액트) 기초(1) - react 특징, JSX란? 규칙

React 리액트 - 프론트엔드 개발을 위한 JavaScript 오픈소스 라이브러리 - 선언형, 컴포넌트 기반, 범용성(다양한 곳에서 활용할 수 있다) 리액트의 특징 3가지 선언형(Declarative) - 리액트는 한 페이지를 보여주기 위해 HTML/CSS/JS로 나눠서 적기보단 하나의 파일에 명시적으로 작성할 수 있게 JSX를 활용한 선언형 프로그래밍을 지향한다. 컴포넌트 기반(Component-Based) - 리액트는 하나의 기능 구현을 위해 여러 종류의 코드를 묶어둔 컴포넌트를 기반으로 개발한다. - 컴포넌트로 분리하면 서로 독립적이고 재사용 가능하기 때문에, 기능 자체에 집중하여 개발할 수 있다. 이런 식으로 나누어서 작성, 구현 가능 (넘나 편리하쥬) 위의 코드를 보고 Application을 ..

Study/React 2022.01.15