늘 겸손하게

Redux란? 공식 페이지에서는 Redux를 "자바스크립트를 위한 예측가능한 state 컨테이너"로 정의합니다. Redux는 한 마디로 자바스크립트 상태(state) 관리 라이브러리입니다. Redux는 state 관리 라이브러리로 React를 포함한 다양한 자바스크립트 라이브러리와 같이 사용가능합니다. 하지만 React의 기능적 성격 때문에 React와 잘맞아 일반적으로 Redux는 React와 같이 사용됩니다. 왜 Redux를 사용하나요? 컴포넌트의 state는 컴포넌트가 언제 렌더링될지, 어떤 행동을 할지를 결정합니다. 이 state를 props를 통해 자식 컴포넌트로 전달하는것도 가능합니다. 이러한 state을 컴포넌트 내부에 저장하는 일은 컴포넌트 개수가 적고 깊이도 얖은 작은 앱을 개발할때는 큰..

React란? React는 오늘날 가장 유명한 JavaScript 라이브러리 중 하나입니다. 공개된 이후 수년이 지난 지금도 웹 개발자들이 사용 중이고 view를 유지하고 만들기에 가장 좋은 JavaScript UI 라이브러리입니다. React를 이렇게 유명하게 만든 주요한 특징은 바로 React의 JSX와 Virtual DOM입니다. JSX는 JavaScript eXtension의 축약어로 자바스크립트 구문의 확장판입니다. JSX는 HTML구문과 JavaScript를 혼합하여 개발자가 브라우저에 쉽게 접근할 수 있게 만들었습니다. Virtual DOM은 웹 브라우저가 생성한 DOM tree의 가상 복사본으로 실시간으로 일어나는 업데이트를 기록하기 위해 React에서 생성합니다. React js를 사용..

DOM이란? Document Object Model의 축약어로 브라우저에서 다룰 HTML을 파싱하여 이해하기 쉽게 트리 구조로 표현한 객체입니다. DOM은 웹 페이지의 객체 지향 표현이고, 자바스크립트와 같은 스크립팅 언어를 이용해 DOM을 수정할 수 있습니다. 기본적으로 자바스크립트에는 DOM을 조작할 수 있는 DOM API들을 제공합니다. Virtual DOM이란? 위의 DOM을 추상화한 객체입니다. DOM을 추상화한 가벼운 사본을 메모리에 만들어 놓은 것. DOM 추상화 이유 DOM을 반복적으로 직접 수정하면 수정이 일어날때마다 브라우저 렌더링이 일어나게되고, 변경점이 없는 부분까지 리렌더링되어 PC 자원을 낭비하게됩니다. 이 문제를 해결하기 위해 DOM을 추상화합니다. 작동원리 변경사항이 있을때 ..

Promise 자바스크립트에서 비동기를 간편하게 처리해주는 객체입니다. 비동기는 '특정 코드의 실행이 완료되기를 기다리지 않고 다음 코드를 먼저 수행하는 것을 말합니다'. 프로미스는 다음 중 하나의 상태를 가집니다. 대기 ( pending ) : 이행하지도, 거부하지도 않은 초기 상태 이행 ( fulfilled ) : 연산이 성공적으로 완료 거부 ( rejected ) : 연산 실패 혹은 오류 발생 Promise가 필요한 이유 자바스크립트에서 비동기 처리는 주로 콜백함수로 이루어집니다. 하지만 콜백함수가 많이 중첩될 경우, 가독성이 떨어지고 에러처리도 힘든 콜백지옥에 빠질 수 있습니다. 이러한 콜백함수의 단점을 보완하기 위해 'Promise'를 사용합니다. Promise 객체 생성자 let promise..