Библиотека UI компонентов, о которой вы всегда мечтали (RU)

Библиотека UI компонентов, о которой вы всегда мечтали (RU)

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

Уже много лет все говорят о компонентном вебе и мире, где новые интерфейсы строятся из готовых блоков на раз-два, но чего мы в итоге достигли? Пока БЭМ, Polymer, Angular и создатели других технологий ищут лучшие пути организации клиентского кода, создавая сложные абстракции, сообщество React уже давно наслаждается отличными и простыми инструментами для работы с UI компонентами.

В рамках доклада Роберт поделится опытом мирового React-сообщества в создании удобных и простых в обращении библиотек UI компонентов.

Вы научитесь:
- Разрабатывать компоненты таким образом, что их можно будет легко интегрировать в любые проекты.
- Создавать удобную, изолированную среду для разработки UI компонентов.
- Делиться описанием всевозможных состояний имплементаций компонентов с командой разработчиков и дизайнеров.

Bad3e55f0b96b80bc4ffb40d1c1414dc?s=128

Robert Haritonov

June 01, 2016
Tweet

Transcript

  1. БИБЛИОТЕКА UI КОМПОНЕНТОВ о которой вы всегда мечтали Роберт Харитонов

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

  3. None
  4. None
  5. None
  6. None
  7. SourceJS The Living Style Guide Platform

  8. @operatino Предыдущие доклады • http://bit.ly/building-react-library • http://bit.ly/the-style-guide-platform • http://bit.ly/style-guide-tools-overview •

    http://bit.ly/documenting-the-markup
  9. Начнем наш КВЕСТ • Выбираем технологии • Выбираем инструменты •

    Разрабатываем
  10. @operatino Технологии

  11. None
  12. None
  13. None
  14. @operatino 1816 компонентов 2288 компонентов http://react-components.com http://ngmodules.org

  15. @operatino

  16. @operatino Хороший компонент должен • Быть полностью инкапсулированным • Хорошо

    расширяться • Легко устанавливаться
  17. None
  18. None
  19. None
  20. @operatino Инструменты

  21. react-styleguidist

  22. None
  23. None
  24. react-storybook

  25. None
  26. @operatino Разрабатываем

  27. Начинаем с малого

  28. None
  29. Добавим стилей

  30. None
  31. None
  32. Добавим propTypes

  33. None
  34. None
  35. None
  36. @operatino Рабочая станция

  37. None
  38. None
  39. None
  40. None
  41. None
  42. None
  43. None
  44. None
  45. None
  46. Роберт Харитонов @operatino & rhr.me Спасибо!