React - новая эра фронтенд разработки (RU)

React - новая эра фронтенд разработки (RU)

Видео: https://youtu.be/BNmKJ1ioEpU

React(JS) — это современная библиотека для разработки UI компонентов от Facebook, по праву считающаяся самой трендовой технологией среди JavaScript разработчиков на 2015/16 год.

Но каким образом React стал настолько популярен в среде разработчиков, учитывая что библиотека покрывает только View из необходимого минимума MVC архитектуры? Ответ таится в экосистеме технологий, в рамках которой нам открываются совершенно новые способы разработки приложений, не только для веба, но и нативных платформ с родным UI (iOS, Android, Win 10, OSx).

Роберт расскажет, почему огромная популярность React более чем заслужена, и почему это не "очередной фреймворк", а чуть ли не самое большое изменение в JavaScript разработке за последние годы.

Bad3e55f0b96b80bc4ffb40d1c1414dc?s=128

Robert Haritonov

May 31, 2016
Tweet

Transcript

  1. Реакт: новая эра 
 фронтенд разработки Роберт Харитонов @operatino &

    rhr.me
  2. Front-end Development Lead Liberty Global / Ziggo Роберт Харитонов @operatino

  3. None
  4. None
  5. None
  6. V значит View в традиционном MVC, а так же Virtual

    DOM
  7. Реакт — это декларативная библиотека для синхронизации DOM с вашими

    данными.
  8. но...

  9. @operatino Экосистема во главе всего • Реакт закладывает основы функционального

    программирование в UI код • Поддержка кроссплатформенного рендеринга • Отличная поддержка композиции модулей • Огромное сообщество и множество инструментов
  10. @operatino Новая эра

  11. None
  12. @operatino Почему Фейсбук создал Реакт • Предсказуемость исполнения UI кода

    • Инкапсуляция состояния в компонентах • Неизменные параметры компонентов и однонаправленный поток данных • Композиция, простота разработки и дебага • Новые подходы разработки сложных интерфейсов
  13. @operatino React makes rendering of UI as simple as defining

    a function.
  14. None
  15. None
  16. @operatino

  17. None
  18. @operatino Осваивайте программирование, а не инструменты.

  19. @operatino Почему вам стоит попробовать Реакт?

  20. @operatino

  21. @operatino Преимущества Реакта • Гибкость внедрения • Простота поддержки кода

    • Мощные библиотеки компонентов • Кросс-платформенный рендеринг • React Native
  22. @operatino Before we jump in...

  23. @operatino

  24. None
  25. None
  26. Stateless Component

  27. None
  28. None
  29. @operatino 1816 компонентов 2288 компонентов http://react-components.com http://ngmodules.org

  30. @operatino

  31. @operatino Polymer от Google

  32. @operatino gl-react

  33. @operatino react-canvas

  34. @operatino Server rendering Single Page 
 JS App Первый запрос

    Рендеринг на сервере
  35. As Easy As Calling a Function

  36. @operatino Преимущество серверного рендеринга • Производительность • Единый UI код

    для клиента и сервера • SEO оптимизация • Прогрессивное улучшение
  37. @operatino Собирая все вместе Flux/Redux ReactiveX Backbone и другие

  38. @operatino Flux

  39. None
  40. None
  41. None
  42. None
  43. @operatino React Native

  44. @operatino “Learn once, write anywhere..” Tom Occhino, React Native: Bringing

    modern web techniques to mobile
  45. None
  46. @operatino JavaScript везде!

  47. @operatino

  48. @operatino React Native • Оперирует нативным UI • Выполняет JS

    код в отдельных потоках • Позволяет переиспользовать бизнес логику с веба • Мгновенные релизы в обход App Store • Отличный Developer Experience
  49. None
  50. @operatino Инструменты

  51. Native Hot Reload

  52. Native Playground

  53. Redux Time Travel

  54. Living Style Guide

  55. @operatino Домашнее задание • Официальный туториал от разработчиков Реакта •

    https://github.com/petehunt/react-howto • https://camjackson.net/post/9-things-every-reactjs- beginner-should-know
  56. Роберт Харитонов @operatino & rhr.me Спасибо!