Недавно перешел с PolymerJS на VueJS для некоторых задач. Совместно с polymer использовал Redux через библиотеку polymer-redux. Поэтому вся бизнес-логика уже была сформирована на уровне redux store. Для связки vue и redux выбрал библиотеку vuedeux. В awesome vue в разделе redux представлена еще одна библиотека для связки с redux — revue, но мне показалось эффективней использовать именно vuedeux, за счет интеграции redux store непосредственно в «свой redux» для vue — vuex, для возможного использования его в будущем.
Читать полностью »
Рубрика «redux» - 9
Удобное использование Redux в vue-компонентах
2017-09-04 в 19:36, admin, рубрики: actions, Dispatch, github, javascript, mixin, open source, redux, vuejs2, Программирование, Разработка веб-сайтовЕщё один способ работать с Promise для Redux
2017-08-22 в 19:51, admin, рубрики: javascript, npm, promise, reduxТак вышло, что в данный момент я принимаю участие в разработке фронт-энд приложения (React + Redux), делающего множество запросов к REST API каждую минуту, если не секунду.
Мне надоело на каждый запрос писать REQUEST/FAILURE/SUCCESS (далее RFS) экшны, к ним кейсы для редьюсера, всё это обильно поливать тестами (ведь качество превыше всего).
Я написал очередной велосипед.
Redux store: Расширение по «горизонтали»
2017-08-17 в 19:08, admin, рубрики: combine, javascript, redux, store, Разработка веб-сайтов
Когда приложение, использующее Redux, разрастается до достаточно больших размеров, количество состояний увеличивается многократно. Для разделения редьюсеров на логические единицы применяется подход комбинирования их с помощью combineReducers. Данное решение позволяет расширить store по «вертикали». Но бывают случаи, когда данного разделения может быть недостаточно. Например, один из уровней несет в себе составную логику, которую тоже было бы неплохо разделить (или как говорил один из известных людей: «Ухлубить!»). Но такого подхода нет в API Redux. И поиск решения данного вопроса так же ничего не дал (может плохо искал). Поэтому я разработал свой подход расширения по «горизонтали» Redux Store.
Хочу Вас ознакомить со своим проектом, который позволяет осуществить данный подход.
Использование
1) Сначала, на уровне редьюсера первого уровня, подключаем саму библиотеку:
import {stateCombine, runCombine, getInitialState} from "redux-combine-deep-props";Обучающий проект: ToDo веб приложения на Spring и ReactJS
2017-08-11 в 15:29, admin, рубрики: hibernate, java, javascript, ReactJS, redux, spring, я пиарюсь
Приложение будет предназначено для людей, нуждающихся в удобном средстве организации личных целей и задач. Типичное приложение типа todo-list, но с одной особенностью, которая впрочем понятна из названия. Организация задач будет возможна не только в виде списка, но и в виде дерева подзадач. Tree > List!
Проект будет транслироваться с нуля, то есть вплоть до установки необходимого окружения для разработки (JDK, Eclipse, Atom, Node.js) и подключения необходимых зависимостей (Spring, Hibernate, ReactJS, Redux). Если вы хотели увидеть, как используются следующие технологии: Java, Spring, Hibernate, JavaScript, ReactJS, Redux, то спешу вас обрадовать, у вас будет такая возможность! Конечно, это не весь список, но это то на чем будет делаться акцент.
Читать полностью »
Запросы GraphQL без подключения к сети с помощью Redux Offline и Apollo
2017-08-09 в 8:03, admin, рубрики: api, graphql, react-offline, redux, Разработка веб-сайтовЗабавно, но с распространением интернета в мире все больше востребованы веб-приложения, работающие без подключения к сети. Пользователи (и клиенты) хотят функциональные интернет-приложения в онлайн, офлайн и в зонах с неустойчивой связью.
А это… не просто.
Посмотрим, как создать эффективное решение, работающее без подключения к сети, на React и слое данных GraphQL с применением Apollo Client. Статья разбита на две части. На этой неделе разберем оффлайновые запросы. На следующей неделе примемся за мутации.
Анонс RamblerFront& #2
2017-07-24 в 9:31, admin, рубрики: css, galen framework, html, javascript, React, ReactJS, redux, Блог компании Rambler&Co
3 августа на Мансарде Rambler&Co состоится второй внешний RamblerFront& meetup, на котором наши сотрудники поделятся прикладными знаниями в области frontend-разработки.
Читать полностью »
Это перевод статьи "What’s So Great About Redux?" (автор Justin Falcone), которая мне показалась весьма приятной и интересной для прочтения, enjoy!
Redux мастерски справляется со сложными взаимодействиями состояний, которые трудно передать с помощью состояния компонента React. По сути, это система передачи сообщений, которая встречается и в объектно-ориентированном программировании, но она не встроена непосредственно в язык, а реализована в виде библиотеки. Подобно ООП, Redux переводит контроль от вызывающего объекта к получателю — интерфейс не управляет состоянием напрямую, а передает ему сообщение для обработки.
В этом плане хранилище в Redux — это объект, редюсеры — это обработчики методов, а действия — это сообщения. Вызов store.dispatch({ type:"foo", payload:"bar" }) равносилен store.send(:foo, "bar") в Ruby. Middleware используется почти таким же образом, как в аспектно-ориентированном программировании (например, before_action в Rails), а с помощью connect в react-redux осуществляется внедрение зависимости.
Ненормальный GraphQL в Electron или как я писал десктопный клиент для Tinder
2017-06-22 в 12:38, admin, рубрики: electron, graphql, javascript, mobx, node.js, React, ReactJS, redux, web, никто не читает теги, разработка приложенийПредыстория
Привет. В начале зимы 2016 года я снова стал одинок. Спустя какое-то время я решил завести себе профиль в Tinder. Всё бы ничего, но постепенно стала накапливаться усталость из-за невозможности нормально печатать на физической клавиатуре. Мне виделось несколько решений этой проблемы:
- Смириться и продолжать использовать официальное приложение для смартфона
- Использовать BlueStacks с официальным приложением на Android
- Использовать существующие клиенты для десктопа (Tinder++)
- Написать свой
Первый вариант меня не устраивал из-за принципиального превосходства реальной клавиатуры над экранной. Второй вариант не подходил из-за того, что всё-таки это было бы приложение, не оптимизированное под десктоп. Третий вариант был всем хорош кроме дизайна, багов, и малой активности в репозитории. Позже Tinder++ получил письмо от юристов Tinder и проект был и вовсе свёрнут. Таким образом, лично для меня выбор был очевиден.
Сокращаем использование Redux кода с помощью React Apollo
2017-06-16 в 20:40, admin, рубрики: api, graphql, javascript, node.js, React, ReactJS, reduxВсем привет! Хочу поделиться своим переводом интересной статьи Reducing our Redux code with React Apollo автора Peggy Rayzis. Статья о том, как автор и её команда внедряли технологию GraphQL в их проект. Перевод публикуется с разрешения автора.
Переключаемся на декларативный подход в Высшей Футбольной Лиге
Я твёрдо убеждена, что лучший код — это отсутствие кода. Чем больше кода, тем больше вероятности для появления багов и тем больше тратится времени на поддержку такого кода. В Высшей Футбольной Лиге у нас совсем небольшая команда, поэтому мы принимаем этот принцип близко к сердцу. Мы стараемся оптимизировать всё, что нам по силам, либо путём увеличения переиспользуемости кода, либо просто перестав обслуживать определённую часть кода.
В данной статье вы узнаете о том, как мы передали контроль над получением данных в Apollo, что позволило нам избавиться от почти 5,000 строчек кода. К тому же, после перехода на Apollo наше приложение стало не только намного меньше по объёму, оно также стало более декларативным, поскольку теперь наши компоненты запрашивают только те данные, которые им нужны.Читать полностью »
Идиоматичный Redux: Дао Redux’а, Часть 1 — Реализация и Замысел
2017-06-11 в 18:41, admin, рубрики: Dan Abramov, immutability, javascript, mvc, open source, ReactJS, redux, Разработка веб-сайтов, функциональное программированиеМысли о том, какие требования выдвигает Redux, как задумано использование Redux и что возможно с Redux.
Введение
Я потратил много времени, обсуждая онлайн паттерны использования Redux, была ли это помощь тем, кто изучает Redux в Reactiflux каналах, дискуссии о возможных изменениях в API библиотеки Redux на Github'е, или обсуждение различных аспектов Redux'а в комментариях к тредам на Reddit'е или HN (HackerNews). С течением времени, я выработал свое собственное мнение о том, что представляет собой хороший, идиоматичный Redux код, и я хотел бы поделиться некоторыми из этих мыслей. Несмотря на мой статус мейнтейнера Redux'а, это всего лишь мнения, но я предпочитаю думать, что они являются достаточно хорошими подходами :)
Redux, в своей сути, невероятно простой паттерн. Он сохраняет значение, выполняет одну функцию для обновления значения когда это необходимо, и уведомляет любых подписчиков о том, что что-то изменилось.
Несмотря на эту простоту, или, возможно, вследствие ее, существует широкий спектр походов, мнений и взглядов о том, как использовать Redux. Многие из этих подходов широко расходятся с концепциями и примерами из документации.
В то же время, продолжаются жалобы на то, как Redux «заставляет» вас делать вещи определенными способами. Многие из этих жалоб на самом деле включают концепции связанные с тем, как Redux обычно используется, а не фактическими ограничениями наложенными самой библиотекой Redux. (Например, только в одном недавнем HN треде я видел жалобы: «слишком много шаблонного кода», «константы action'ов и action creator'ы не нужны», «я вынужден редактировать слишком много файлов чтобы добавить одну фичу», «почему я должен переключаться между файлами чтобы добраться до своей логики?», «термины и названия слишком сложны для изучения или запутанны», и слишком много других.)