Размышления с конференций Frontend Love и VueJS Amsterdam
Сердце Амстердама - поистине красивое место с очень гармоничной архитектурой и дружелюбной инфраструктурой. Мне очень понравилось открывать для себя этот город, особенно район Йордан - тихое место с заметной артистической душой и умиротворенной атмосферой. Это отличный пример сложной джентрификации, потому что в 70-х это был типичный рабочий район.
Конференция проходила в пригороде порта, в Театре Амстердама. Окрестности были не особенно привлекательными из-за продолжающегося ремонта города, но сам театр действительно впечатлял. У него самый большой экран, который я когда-либо видел - это действительно усилило ощущение и улучшило восприятие лекций. Два дня конференции были разделены на разные темы и носили отдельные названия: Frontend Love и VueJS Amsterdam.
Реактивное программирование было очень модной темой в последние несколько лет. Ваша первая ассоциация, вероятно, будет RxJS, но эта парадигма часто скрыта под капотом фреймворков / других инструментов, с которыми вы, вероятно, действительно знакомы - мы убедились в этом на обоих днях конференции.
«Анимация Vue: насколько Vue.js умен и элегантен с точки зрения анимации»
Сара Драснер
Основные методы анимации с помощью VueJS - это <transition>
и <transition-group>
components. Конечно, вы можете использовать CSS-анимацию, но помните, что вы должны использовать ее с принципом DRY. Более продвинутые методы используют наблюдатели и реактивность для создания настраиваемых директив, гибкую SVG-анимацию (возможность использования без D3) и компоненты переходов с nuxt.js .
Vue предоставляет простые решения для создания сложных и красивых взаимодействий, которые в то же время кажутся удобными для пользователей. Мне очень понравился слайд ниже, который очень четко объясняет, что такое реактивность, где она есть, а где нет:
«Реагировать; это не структура пользовательского интерфейса, а структура ума »
Мишель Вестстрат
Итак, теперь мы знаем, что React не является реактивным, потому что он декларативен, а название этого фреймворка вводит в заблуждение - я думаю, слово Scheduler подходит лучше. Но это не дефект, поскольку он не навязывает какую-либо парадигму, которую вы хотите использовать.
В любом случае React предназначен не только для пользовательского интерфейса. Не случайно, что пакеты react и react-dom разделены - JSX не просто библиотека шаблонов, но также подходит для создания любых пользовательских интерфейсов, таких как мобильные приложения с React Native, настольные приложения (Cacoa, UWP, QT), Shell и CLI (Blessed и Ink), а также, слайды, игры или приложения для ТВ.
Как сказал Майкл, это каркас для разума, и вы можете использовать его для чего-нибудь новаторского в мире программирования. Я слышал анекдот «если что-то еще не написано на React, то скоро будет», как до недавнего времени, в основном на JavaScript.
«Дерево состояний MobX + React: обеспечена чистая реактивность»
Лука Меццалира
MobX - это полностью реактивная библиотека, которая предоставляет декоратор наблюдателя и содержит состояние, а с деревом состояний имеет тот же шаблон, что и в VueX или CycleJS. - вы можете писать императивно, и это очень хорошая идея для начала в реактивном мире. Он также самоуверен и транзакционен - Дерево состояний в первую очередь содержит хуки жизненного цикла для магазинов, систему типов, снимки для изменяемого / неизменяемого дерева - больше вы можете узнать об этом из приятного документация.
Кстати, Лука написал очень многообещающее название о реактивности в JS-библиотеках, таких как RxJS, Mobx или CycleJS - его книга «Front-End Reactive Architectures» доступен на apress.com за 22 евро - я считаю, что оно того стоит.
«Захватывающее будущее React»
Китце Ристовски
После самой большой версии Fiber version номер 16.4 приносит нам новые шаблоны, такие как Portals, и новые методы, такие как componentDidCatch
, createRef
, new Context API и, вероятно, обеспечит удобство использования без классов. Кроме того, в новой версии такие компоненты, как componentWillMount
, componentWillUpdate
, componentWillReceiveProps
, будут устаревшими, поэтому их лучше не использовать в следующих проектах.
Мой любимый слайд для фанатов Vue:
«Почему мне никто не сказал о ngrx / entity?»
Джерард Санс
Ngrx / store - это повторная реализация Redux поверх Angular и RxJS 5.
Внутри ngrx 5 есть оператор new Pipeable select и RxJS 5.5. Ngrx / entity - хороший выбор для более эффективного управления списками более понятным способом.
«Настоящее и будущее Vue»
Эван Ю
Как и в Mobx 4.0, в Vue 2.6 Прокси будут реализованы на основе системы реактивности. В новом выпуске Vuex они упрощают API с помощью async / await и потенциально устраняют разделение действий и мутаций.
«Apollo, GraphQL и Vue: идеальный стек»
Гийома Чау
Я действительно обожаю это сочетание. Это дает нам четкую и простую структуру, с которой вам больше ничего не нужно, даже контейнеры состояний - Vue-Apollo помогает вам избежать этого и делает взаимодействие между компонентами и ответами от бэкэнда более строгим и понятным.
Движок Apollo предоставляет нормализованный кеш и дает возможность использовать свою наблюдаемую систему (они используют реализацию zen-observable, чтобы использовать ее как полифил с наблюдаемым предложением).
Резюме
Как видите, Observables, вероятно, изначально встроены в Javascript. Стоит отметить, что Observables Pattern - рабочая лошадка в реактивной парадигме. Так что просто приготовьтесь использовать их для лучших целей и помните о том, что мир вокруг вас работает с реактивностью, поэтому, может быть, пора написать все более реактивно?
Сама конференция стала прекрасной возможностью увидеть, что больше всего ценится в рамках. Если вас интересует тема VueJS, я рекомендую вам посетить VueJS Amsterdam в следующем году. Если ваш ответ отличается, подумайте о Frontend Love или о них обоих.
Спасибо организаторам и до встречи в следующем году!
Если вам понравился этот пост, нажмите кнопку хлопка ниже 👏👏👏
Вы также можете подписаться на нас в Facebook, Twitter и LinkedIn.