ReactJS

Иногда лучше остаться спать дома в понедельник, чем провести всю неделю отлаживая написанный в понедельник код.

(Christopher Thompson)


CodeIT Alex Frentsel © 2017

React - это не...

React - не фреймворк, это библиотека.

React - не MVC. Это только V (представление).

Что нужно для старта?

  1. EcmaScript 6
  2. JSX
  3. FLUX
  4. Webpack

Router

ReactDOM.render(
	
		
		
		
		
	,
	document.querySelector('#main')
);

Это все!

Теперь вы знаете о базовых возможностях ReactJS все!

...ну почти все :)

Первое впечатление от ReactJS:

  • Весит почти как angular, а умеет на порядок меньше;
  • К JSX еще нужно привыкнуть, а без него код выглядит просто отвратно;
  • Неудобная и неэффективная работа с данными;
  • React из коробки просто бесполезен;

Пока не появился FLUX!

FLUX - это система по управлению состоянием.
Mix паттернов Observer и Store.

Принцип однонаправленного потока данных.

REDUX

Это одна из реализаций паттерна FLUX

REDUX Demo











React + FLUX

Это и есть тот самый React,
которым восхищаются многие разрабы.

Demo

SPA - store

Недостатки:

  1. Специфичность JSX;
  2. Скудный базовый API;
  3. Если не знаком с ES6, JSX, FLUX, Webpack, то все это, рано или поздно, придется осваивать;
  4. Плохая доккументация;
  5. Для приложений с малым кол-вом динамики избыточен;

Преимущества:

  1. Простой в освоении;
  2. Изоморфный код (клиент/сервер);
  3. Виртуальный DOM (производительность);
  4. Понятно что отображает конкретный компонент;
  5. Можно внедрить в существующее приложение без переписывания (причем постепенно).
  6. Формирует полезные привычки в проектировании;
  7. Перспектива легкого перехода к мобильной разработке;
  8. Компонентный подход - это уже не будущее, а настоящее;

The end

Опасайтесь багов в приведенном выше коде;
я только доказал корректность,
но не запускал его.

(Donald E. Knuth)


CodeIT Alex Frentsel © 2017