React (2) 썸네일형 리스트형 [React] Virtual Dom 이란? (Diffing, Reconciliation, Batch Update) React를 공부하면서 Virtual Dom이 도대체 무엇일까?? 어떤 역할을 하는건지 궁금해서 정리해보았습니다. DOM (Document Object Model) 웹페이지에 들어가있는 HTML elements 들을 트리 형태의 구조 표현한 것 DOM 조작 개발자들은 dom이 제공하는 api를 통해서 dom 구조에 접근해 원하는 elements의 구조와 스타일을 변경할 수 있음 ex) Javascript 같은 경우는 getElementById(), querySelector() 등과 같은 API를 통해서 dom구조 안에 있는 elements에 접근해서 원하는대로 내용, style, layout 등을 수정할 수 있음 Virtual DOM 가상돔 이란? 실제 DOM과 같은 내용을 담고 있는 복사본 이 복사본은.. [React] 개발 환경 준비, 프로젝트 만들기 (React 가장 기본 단계) React 개발 환경 셋팅 및 프로젝트 만들기 React 개발 환경 셋팅 및 서버 실행 하는 방법에 대해서 알아보려고 한다. 개발 환경 셋팅 개발 환경 셋팅을 위해서 우선 하기에 있는 것들을 설치해준다. Node.js Webpack 과 Babel 같은 도구들이 자바스크립트 런타임인 Node.js 를 기반으로 만들어져있다. 그렇기에 해당 도구들을 사용하기 위해서 Node.js 를 설치한다. Webpack, Babel 은 무슨 용도인가요? 리액트 프로젝트를 만들게 되면서, 컴포넌트 를 여러가지 파일로 분리해서 저장 할 것이고, 또 이 컴포넌트는 일반 자바스크립트가 아닌 JSX 라는 문법으로 작성하게 됩니다. 여러가지의 파일을 한개로 결합하기 위해서 우리는 Webpack 이라는 도구를 사용하고, JSX 를 비.. 이전 1 다음
