React JS의 개요와 Hello World

  리액트(React)는 UI를 효과적으로 구축하기 위해 사용하는 자바스크립트(JavaScript) 기반의 라이브러리입니다. 그러므로 HTML과 자바스크립트를 할 수 있다면 리액트도 어렵지 않게 사용할 수 있습니다. 또한 리액트는 라이브러리라는 점에서 다른 라이브러리들과 함께 사용할 수 있어 효율적입니다. 무엇보다 리액트는 오픈소스 커뮤니티가 매우 방대하다는 장점이 있습니다.

  다시 말해서 리액트(React)를 배우기 전의 선행 과정은 JavaScript입니다. 또한 추가적으로 jQuery와 같은 다른 라이브러리를 사용해 본 경험이 있다면 리액트의 장점 및 필요성에 대해서 보다 쉽게 이해할 수 있을 것이라고 생각합니다.

  이 강좌는 초반부에는 리액트의 개요 및 사용 방법에 대해서 다루기 때문에 조금 지루할 수 있습니다. 다만 1시간 가량만 실습을 하더라도 기본적인 사용 방법에 대해서 알 수 있으며, 이후에는 바로 실습을 진행하며 공부하게 되므로 재미있게 학습하실 수 있습니다.

  ▶ 리액트 오픈소스: https://github.com/facebook/react

  리액트(React) 오픈소스는 별점이 10만 개가 넘는 유명한 프로젝트입니다. (그래서 리액트를 제대로 다룰 줄 모르는 저는 마치 저만 쓸 줄 모르는 것 같은 소외감을 느끼곤 했습니다.) 또한 MIT 라이센스를 따른다는 점에서 상당히 자유롭게 사용할 수 있는 편입니다.

※ 리액트의 특징 ※

  - 선언적(Declarative): 리액트는 대화형 UI를 작성하기에 유리합니다. 데이터가 변경되었을 때 효율적으로 렌더링을 수행할 수 있도록 합니다.

  - 컴포넌트 기반(Component-Based): 캡슐화된(Encapsulated) 컴포넌트가 상태를 관리하고 UI를 효과적으로 구성할 수 있습니다.

  - 한 번 배워서 어디에서나 사용하기(Learn Once, Write Anywhere): 기존의 소스코드를 불필요하게 다시 작성하지 않고 새로운 기능을 개발할 수 있습니다.

  이러한 리액트는 공식 문서를 읽으면서 바로 공부를 시작해 볼 수 있습니다.

  ▶ 리액트 학습 사이트: https://reactjs.org/docs/getting-started.html

  또한 기본적으로 리액트는 단순히 웹 환경에서 돌릴 수 있다는 점에서 굳이 우리 로컬(Local) 컴퓨터에 개발 환경을 구축하지 않아도 충분히 온라인 상에서 소스코드를 테스트 해 볼 수 있습니다.

  ▶ 리액트 사용해보기: https://reactjs.org/redirect-to-codepen/hello-world

※ 리액트의 장점과 단점 ※

  리액트는 뛰어난 성능을 가지고 있으며 클라이언트 렌더링 뿐만 아니라 서버 사이드 렌더링도 지원합니다. 그래서 Ajax 등과 같은 비동기 방식과 비교했을 때 검색 엔진 최적화(SEO) 등에 있어서 유리한 형태로 소스코드를 작성할 수 있습니다. 이러한 검색 엔진 최적화 문제는 상당수 SPA 프로젝트가 가지는 문제입니다.

  또한 리액트는 이미 많은 웹 서비스가 채택한 기술이라는 점에서 그에 따라서 오는 부가적인 장점이 있습니다.

  ▶ 리액트를 사용한 서비스들: https://github.com/facebook/react/wiki/Sites-Using-React

  확인을 해보시면 페이스북(Facebook), 인스타그램(Instagram) 등 유명한 서비스가 포함되어 있습니다.

  (+ 추가)

  또한, 리액트를 시작하기 전에 자바(Java), C++ 등을 해 본 사람을 위해서 이것이 무슨 라이브러리인지 쉽게 설명해드리겠습니다. 기존에 웹 사이트를 만들 때에는 보통 프론트 엔드 부분을 객체 지향적으로 작성하지는 않았어요. 백 엔드에서나 객체 지향 기법을 적절히 따르면서 개발했죠. 하지만 리액트는 프론트 엔드 또한 매우 객체 지향적으로 작성하도록 해주는 라이브러리라고 보시면 됩니다.

  그리고 기존에 JavaScript 및 jQuery까지 사용해보신 분들이라면 리액트(React) 과정은 하루에서 이틀 정도 잡으시고 빠르게 끝내시는 것을 추천드립니다. 어렵게 생각하지 마시고 단순한 라이브러리 따위 하루만에 정복하겠다는 거만한(?) 마인드로 공부하시면 좋아요.