개발환경
NPM 이란?
소프트웨어 registry 를 기반으로 해서, 프로젝트의 자바스크립트 라이브러리 관리 기능을 제공한다. registry 란 기록등이 보관되는 장소를 말하는데, 여기서는 라이브러리 패키지를 보관하는 저장소로 볼 수 있다. 개발자는 CLI 를 통해 저장소에서 패키지를 가져오거나 실행하는 등의 작업을 수행할 수 있다.
Webpack 이란?
module bundler 이다. 프로젝트의 소스코드와 의존하고 있는 라이브러리들을 합치는 역할을 한다. 먼저, 엔트리 포인트(보통 index.js)에서 시작해서, 의존하고 있는 모듈들의 dependency graph 를 그린다. 그 후에 dependency graph 를 재귀적으로 순회하며 의존성을 모두 포함해서 하나 혹은 여러개의 번들로 합친다.
See https://webpack.js.org/concepts/dependency-graph/
Node.js 란?
비동기 이벤트 주도 자바스크립트 런타임.
비동기 이벤트 주도 vs 스레드 동시성 모델.
런타임 - 실행되는 환경.
DOM 이란?
document 를 구조적으로 표현해서, 웹페이지를 스크립트나 프로그래밍 언어로 다룰 수 있게 해주는것. '구조적' 으로 표현하는 방법은 document 를 논리 트리 구조로 표현해 주는 것을 말한다.
Babel 이란? Babel 을 왜 쓰는가?
주된 이유는 ECMAScript 2015+ 이상 버전의 자바스크립트를 이전 버전으로 바꾸어서 동작할 수 있게 해주는 역할을 한다. 이외에도 jsx 와 같은 문법을 변환하거나 타겟 브라우저에서 지원하지 않는 기능을 구현하는 pollyfill 기능도 지원하고 있다.
리액트
리액트의 탄생 배경
리액트의 핵심 개념
Immutability
리액트의 엘리먼트는 불변성이 있다. 하나의 엘리먼트가 생성되면 그것은 일부분만 바뀌지 않는다.
ReactDOM
리액트돔은 렌더링을 할때, 이전의 엘리먼트(스냅샷)와 현재 엘리먼트를 비교해서 변화된 부분만을 새로 렌더링 한다. 따라서, 불변성을 유지하면서도 효율적인 렌더링이 가능하다.
리액트 훅이란?
여러 컴포넌트에 걸쳐서 재사용 가능한 로직(ex. store 와 연결되는 로직)을 쉽게 사용하기 위한 도구.
테스트
Jest 의 장점은?
리덕스
Flux Architecture 란?
Flux pattern 은 어플리케이션 내에서 데이터를 관리하는 방법이다. 가장 주된 목적은 데이터를 단방향으로 흐르게 하는데에 있다. 모든 action은 dispatcher 를 통해서 store 로 보내지고, store의 상태는 view에 반영된다.
리덕스로 상태관리를 하면 얻어지는 이점은?
- 중앙화되고 불변적인 상태관리가 가능하다. 상태가 한 곳에서 관리되고 접근이 통제된다. 불변성의 상태를 유지하므로,
undo,redo와 같은 기능도 포함할 수 있다. flux pattern을 적용해서 데이터가 단방향으로 흐르므로, 버그를 찾아내기가 쉽다.- 본질적으로 UI 와 관계가 없으므로, 어느 UI 프레임워크와도 유연하게 어울리는 것이 가능하다.
