React(3)
-
1.2 리액트의 특징
1.2.1 Virtual DOM 리액트의 주요 특징 중 하나는 Virtual DOM을 사용하는 것이다. 1.2.1.1 DOM이란? DOM은 Document Object Model의 약어로 객체로 문서 구조를 표현하는 방법이다. 주로 XML이나 HTML로 작성한다. 웹 브라우저는 이 DOM을 활용하여 객체에 자바스크립트와 CSS를 적용한다. DOM은 트리 형태이기 때문에 CRUD가 가능하다. DOM은 과연 느릴까? DOM은 동적 UI에 최적화되어 있지 않다. HTML은 정적이며, 자바스크립트로 동적으로 만들 수 있다. 규모가 큰 웹앱에서 DOM에 직접 접근하여 변화를 주면 성능 이슈가 발생한다. 이를 두고 "요즘 자바스크립트 엔진은 매우 빠른 반면, DOM은 느리다"라고 한다. 하지만 실제로 DOM 자체는..
2023.07.17 -
1.1 왜 리액트인가?
자바스크립트 관련 프레임워크들(Backbone.js, Derby.js, Ember.js, Ext.js, Knockback.js, Sammy.js, PureMVC, Vue.js)은 주로 MVC(Model-View-Controller) 아키텍쳐, MVVM(Model-View-View Model) 아키텍쳐를 사용하며, AngularJS는 MVW(Model-View-Whatever) 아키텍처로 애플리케이션을 구조화한다. MVC, MVVM, MVW 등과 같은 여러 구조가 지닌 공통점은 모델(Model)과 뷰(View)가 있다는 것이다. 모델은 애플리케이션에서 사용하는 데이터를 관리하는 영역, 뷰는 사용자에게 보이는 부분, 컨트롤러는 프로그램이 사용자에게서 어떤 작업을 받으면 모델 데이터를 조회하거나 수정하고, 변..
2023.07.14 -
[React Native] React
1. React란 User Interface 를 개발하기 위한 JS library 텍스트, 버튼, 그림 같은 화면을 구성하는 뷰를 만들어주는 라이브러리. 페이스북에서 개발하고 관리 중이다. 2. 화면 출력 맛보기 react 모듈에서 Component 클래스 import. Component 클래스를 App이라는 클래스가 상속받는데, 이 안에는 render() 라는 함수가 있고, 이 함수가 리턴하는 것들이 화면을 구성하게 된다. import React, { Component } from 'react'; import { View, Text, StyleSheet } from 'react-native'; class App extends Component { render() { return ( Hello World..
2022.01.08