Опыт работы с React в качестве фронтенда для Drupal 8.

1. React
Drupal 8
Нарисовала Катя Маршалкина, 26 лет
ко дню рождения друпала 8 🎉

2. Drupal 8
как CMF
Часть 1

3. CMS/CMFФреймворк
Feature 1 Feature 2
Feature 3
...

4. Feature 1 Feature 2
Feature 3
...
Выбор архитектуры

5. .
Веб-разработка

6. Drupal 8
1.
2.
3.

7. Drupal 8
1.
2.
3.
Symfony components

8. Symfony components

9. (DrupalKernel)

10. modules/example/example.routing.yml

11. modules/example/src/Controller/ExampleController.php

12. Drupal 8
1.
2.
3.
Symfony componentsSymfony components
Drupal traditions
Symfony components
Drupal traditions

13. Drupal Way
1. Build a tool
2. Wire it up
Drupal 8: The Crash Course, Larry Garfield

14. > drupal config:export
Всё что накликано — коммитабельно!

15. Drupal 8
1.
2.
3.
Symfony componentsSymfony components
Drupal traditions
Symfony components
Drupal traditions
Community contributions

16. Drupal Commerce
Фреймворк во фреймворке 😱

18. Тегированный (умный) кеш

19. И ещё
• RESTful Web Services
• Migrate
• 100% multilingual
• Twig
• Schema.org
• In-place Editing
• Безопасность: уровень «Паранойя»
• Кроме ядра, огромная база модулей

20. Почему ещё не на восьмёрке?

21. Ссылки
1. https://api.drupal.org/api/drupal/8.1.x 💪
2. Поставить Drupal, Drush, Drupal Console: https://github.com/drupal-
composer/drupal-project
3. Читать тесты и https://www.drupal.org/project/examples
4. Смотреть видео (скринкасты, конференции)
5. Читать дайджест на Хабре (проект заморожен 🙀)
6. То же самое про семёрку: http://kalabro.github.io/DrupalCMF-2014/

22. Часть 2
API

23. REST в ядре JSONAPI* GraphQL Services RELAXed
просто
работает
по стандарту,
планы слить в
ядро
не рест, планы
слить в ядро
Drupal Way
для сложных
контентных
проектов
https://
www.drupal.or
g/project/
jsonapi
https://
www.drupal.or
g/project/
graphql
https://
www.drupal.or
g/project/
services
https://
www.drupal.or
g/project/
relaxed
* мой выбор

24. http://drupal.local/node/1?_format=json

25. /api/node/article/?_format=api_json&fields[node--article]=nid,title

26. Ссылки
1. A roadmap for making Drupal more API-first, by
Dries Buytaert
2. Тоже самое про семёрку: REST in Peace - API
Development in Drupal, by Komelin & Marshalkina

27. Часть 3

28. Тренд Headless. Зачем?
http://buytaert.net/how-should-you-decouple-drupal

29. сложно 😫

30. Какой
фронтенд-фреймворк
выбрать?

32. React

33. https://twitter.com/kojoru
у Кости Якушева

34. http://blog.andrewray.me/reactjs-for-stupid-people/
http://blog.andrewray.me/flux-for-stupid-people/

35. React это только представление
Заблуждение 1:
Нет. Реакт — это философия, сообщество
и потом уже библиотека от фейсбука.

36. React это модно
Заблуждение 2:
Нет. React — это мейнстрим, PHP от фронтенда.
Модно — это Vue и Elm.

37. React это для сложных приложений
Заблуждение 3:
Нет. React — это будущее веба. В виде новой
библиотеки, веб-компонентов W3C, или как-то ещё.

38. React нужно учить как обычно, в бою
Заблуждение 4:
Нет. Нужно понять идею, но подавляющее
большинство статей и курсов — об инструментах,
вебпаках и синтаксическом сахаре.

39. Две гениальные статьи
1. Removing User Interface Complexity, or Why
React is Awesome, May 13, 2014
Что значит «реактивность» и почему за этим
подходом будущее.
2. A Comprehensive Guide to Test-First
Development with Redux, React, and Immutable,
Sep 10, 2015
Что такое Application State Tree и в чём крутость
Redux.

40. А теперь можно в бой 💪
1. create-react-app — быстрый старт, потом можно
сделать круто
> npm install -g create-react-app
> npm start
> # Всё.

41. А теперь можно в бой 💪
2. react-redux-universal-hot-example — пример со
всеми популярными библиотеками
Redux, Universal, API, React Router, ES6/ES7,
Webpack, sass-loader, mocha

42. 3. Каждый
веб-программист
желает
знать
_ _ _ _.

43. А теперь можно в бой 💪
3. Скринкаст NODE.JS / Курс по Node.JS от Ильи
Кантора
промисы, обработка ошибок, безопасность, продакшн

44. 1. Drupal отдельно, фронтенд отдельно. Нет
никакого «модуля».
2. Drupal классный на бекенде: CMS, CMF, API.
Не надо всё переписывать на Node — мы за
безопасный бекенд.
3. На фронтенде то, что вам нравится.
Итого

45. «Изучайте новое,
чтобы не остаться
на помойке»
- @kalabro