안녕, 리액트(Hello, React)

자바스크립트 라이브러리인 React.js 를 처음 시작하는 분들을 위한 내용이며, 간략한 소개와 사용 사례 및 학습할 수 있는 사이트를 알려 드립니다. 깊이 있는 정보는 이미 많은 자료가 있어서 참고할 수 있는 사이트 공유 정도로 생각하시면 될 거 같습니다. 1. React 소개 페이스북과 인스타그램에서 사용자 경험을 향상하기 위해 만든 라이브러리입니다. 이벤트 요청 시 서버에서 코드를 받아 다시 렌더링해야 되는 문제를 해결하기 위해 만들어졌습니다. 프레임워크가 아니다. 사용자 인터페이스 라이브러리입니다. UI 컴포넌트를 만드는 일만 하며 캡슐화를 잘 시켜줘서 재사용 성이 높습니다. 한가지 일만하여 단순하고 여러 자바스크립트 프레임워크나 라이브러리와 함께 사용할 수 있습니다. 그래서 React를 사용하기 위해서 기존 코드를 모두 바꿀 필요 없이 필요한 부분부터 조금씩 사용이 가능합니다. 왜 MVC 프레임워크가 아닌가? MVC는 확장이 어렵고 거대한 시스템에 어울리지 않는다고 페이스북은 결론을 내렸습니다. 이유는 새로운 기능 추가 시 시스템의 복잡도가 기하 급 수적으로 증가하여 개발자는 기존 기능에 대한 영향을 주지 않을지에 대한 불안감을 주게 됩니다. 모델(Model)과 뷰(View)의 수가 커지고 데이터의 흐름이 양방향으로 이루어질 수록 복잡도는 더욱 증가하고 디버깅 및 코드를 이해하기 어려워지므로 MVC는 작은 앱에 어울린다는 것이죠. 그래서 MVC 대안은? 하지만 "좀더 예측 가능하도록 코드 구조화"에 대한 목표로 "데이터 흐름이 단방향인 시스템 아키텍처" Flux를 제안합니다. Store: APP의 모든 데이터를 저장하며 MVC의 Model 역활입니다. Dispatcher: 모든 데이터를 관리하는 Controll 역활이며 Action 이 시작될 때 어떻게 Store가 업데이트되어야 하는지 결정합니다. View: Store가 변경된 경우같이 변경됩니다. 단방향: 데이터는 단방향으로 흐르고 데이터 계층이 자기가 영향을 미치는…