Overview React는 프론트엔드 웹 애플리케이션을 개발자의 입장에서 조금더 편하고 직관적으로 개발할 수 있도록 도와주는 자바스크립트 라이브러리입니다. 처음 React로 개발을 시작하게 되면 아마도 가장 먼저 듣게 되는 정보가 바로 가상돔(Virtual DOM)에 관한 내용입니다. 그만큼 React에서 핵심적인 기능을 담당하고 있는 것이 바로 Virtual DOM인데, 이번 포스팅에서는 이 Virtual DOM에 대한 간단한 개념을 살펴보고 왜 Virtual DOM이 필요한지, 그리고 Virtual DOM은 어떻게 동작하는지를 간단하게 살펴보도록 하겠습니다. Virtual DOM & DOM DOM은 Document Object Model의 약자로 간단하게 말하면, 브라우저가 HTML문서를 해석하는 ..

Overview 리덕스는 웹 프론트엔드 라이브러리인 리액트(React)에서 상태관리 컨테이너로 사랑받고 있는 라이브러리 입니다. 리액트 앱에서 컴포넌트의 상태관리를 할 수 있게 도와주는 다른 여러 라이브러리 (Flux, MobX)들이 있지만, 현재까지는 그 편리함과 리액트의 Virtual DOM(가상돔)과 가장 잘 어울리는 것 같다는 장점들 때문에 가장 많이 쓰이고 있습니다. 이번 포스팅에서는 이 리덕스를 처음부터 간단하게 구현해보면서 동작원리 및 특징들을 살펴보도록 하겠습니다. How Redux Works 리덕스가 가지고 있는 특징 및 키워드를 간단하게 정리해 보았습니다. 이를 어느정도 이해한 뒤에 리덕스를 살펴보면 실제로 앱에 리덕스를 적용하는 데에도 도움이 될 것이라고 생각합니다. 불변성 (IMMU..

Overview 스마트폰이나 웹 브라우저를 통해서 회원가입을 할 때 다음과 같은 화면을 보신 적이 있으실 것입니다. 사용자로 하여금 이미 가입되어 있는 페이스북, 로그인, 트위터등을 통해서 클릭 한번에 간편하게 회원가입을 진행할 수 있도록 하는 것입니다. 이렇게 간편하게 회원가입을 할 수 있도록 하는 일련의 과정을 프로토콜로 정의해 놓은 것이 바로 OAuth 2.0 표준입니다. OAuth가 왜 필요할까? 웹 기술이 많이 발전하고, 프레임워크가 점차 사용자 친화적으로 발전해 나가면서 수많은 웹 서비스들이 런칭하고, 문을 닫고 있습니다. 대부분의 웹 서비스가 기본적으로 갖추고 있는 것이 "회원" 시스템이기 때문에 이들 사이트에서 회원가입 및 로그인은 필수적인 요소가 되었습니다. 문제는 다양한 웹 서비스를 사..