16 сентября 2017 года вышла React Fiber — новая мажорная версия библиотеки. Помимо добавления новых фич, о которых вы можете почитать здесь, разработчики переписали архитектуру ядра библиотеки. Я как React-разработчик решил разобраться, что за зверь этот Fiber, какие задачи он решает и за счёт чего. Разобрался и пришёл к неоднозначным выводам.
Рубрика «react.js» - 7
Медленнее, плавнее: разбираемся с React Fiber
2017-11-29 в 13:52, admin, рубрики: fiber, javascript, performance, react.js, ReactJSСоздание библиотеки компонентов с использованием Storybook
2017-10-22 в 9:16, admin, рубрики: html, javascript, react.js, ReactJS, Графические оболочки, Разработка веб-сайтовВведение
В наши дни разработка интерфейса является достаточно затратным процессом который требует усилий от множества людей, разработчиков, дизайнеров, тестировщиков продукт менеджеров и так далее.
Компании все чаще прибегают к написанию интерфейса состоящего из множества независимых компонентов, которые могут быть использованы повторно. Многие дизайнеры создают дизайн проект который описывает каждую деталь дизайна. Они используют ряд инструментов для документирования интерфейсов, первые которые приходтя на ум это axshare.com и zeplin.com. Тот же фотошоп, в котором у них все разложено строго по папочкам. Это позволяет им с легкостью работать над дизайном проекта, обновлять и добавлять новые страницы, просто копируя уже имеющиеся наработки.
Читать полностью »
Сравниваем Angular, React и Vue в 2017 году
2017-10-11 в 18:36, admin, рубрики: angular.js, AngularJS, javascript, js фреймворки, react.js, ReactJS, vue.js, Программирование, Разработка веб-сайтовВыбор JavaScript-фреймворка для вашего веб-приложения может оказаться не простой задачей. Не так давно у таких популярных фреймворков, как Angular и React, появился завоевывающий сердца разработчиков конкурент – VueJS. И что самое главное: это далеко не полный список существующих фреймворков.
Тогда, спросите вы: «И как же нам быть, ведь большинство статей, в которых приводятся недостатки и преимущества фреймворков – это дело субъективное». В данной статье я постарался дать как можно более объективное мнение.
Наши участники: Angular, React и Vue
Во-первых, мне бы хотелось рассмотреть жизненный цикл и стратегические критерии фреймоворков. Далее мы перейдем к их особенностям и принципам работы. Ну и в завершении сделаем выводы и проголосуем за свой выбор.
Вот примерный список вопросов:
- Насколько «зрелыми» являются данные фреймворки/библиотеки?
- Насколько велика вероятность того, что они останутся на плаву в ближайшее время?
- Насколько их комьюнити большие и будут ли они полезными?
- Насколько просто найти разработчиков, использующих данные фреймворки/библиотеки?
- Каковы принципы программирования для каждого из них?
- Насколько просто применять данные фреймворки для разработки большихмаленьких приложений?
- Сколько времени займет изучение каждого?
- Какая производительность?
- Насколько просто начать разрабатывать приложения с их помощью?
Готовы? Тогда начинаем!
Читать полностью »
Как библиотека MobX помогает управлять состоянием веб-приложений. Лекция в Яндексе
2017-10-01 в 8:20, admin, рубрики: mobx, mobx-state-tree, React, react.js, ReactJS, state, Блог компании Яндекс, веб-приложения, Разработка веб-сайтовНедостаток зависимостей в веб-приложении приводит к ошибкам в интерфейсе, избыток — снижает производительность. Руководитель отдела разработки интерфейсов Яндекса Азат razetdinov показывает, как библиотека MobX помогает отслеживать минимальный набор изменений и поддерживать консистентность состояния приложений, а также знакомит с инструментом mobx-state-tree, который позволяет совместить всё лучшее из MobX и Redux.
То, что мы руками пытаемся работать с immutable-данными, — это необязательно. Immutable-состояние нашего приложения — это еще один вид, еще одно представление, еще одно отображение. Можно использовать живую модель, просто каждый раз в любой момент времени получить его плоскую проекцию.
Вышел React v16.0
2017-09-28 в 13:42, admin, рубрики: Facebook, javascript, React, react.js, ReactJSЭто перевод поста Эндрю Кларка о выходе столь ожидаемой версии React. Оригинальный пост в блоге React.
Мы с удовольствием сообщаем о выходе React v16.0! Среди изменений некоторые давно ожидаемые нововведения, например фрагменты, обработка ошибок (error boundaries), порталы, поддержка произвольных DOM-атрибутов, улучшения в серверном рендере, и уменьшенный размер файла.
DI для полностью переиспользуемых JSX-компонентов
2017-09-25 в 11:24, admin, рубрики: dependency injection, javascript, react.js, ReactJS, Программирование
Привет, меня зовут Сергей и мне интересна проблема переиспользования компонент в вебе. Глядя на то, как пытаются применить SOLID к реакту, я решил продолжить эту тему и показать, как можно достичь хорошей переиспользуемости, развивая идею внедрения зависимостей или DI.
DI как основа для построения фреймворка, применительно к вебу, довольно молодой подход. Что бы тут было понятней о чем идет речь, начну c привычных для react-разработчиков вещей.
Angular vs. React vs. Vue: Сравнение 2017
2017-09-18 в 19:25, admin, рубрики: angular, AngularJS, comparison, framework, javascript, react.js, ReactJS, vueВыбор JavaScript-фреймворка для вашего веб-приложения может быть невыносим. В настоящее время очень популярны Angular и React, и есть также выскочка, получающий много внимания в последнее время: VueJS. Кроме них, лишь эти несколько новичков.
Pi-Sonos или DIY портативная акустика на Raspberry Pi
2017-09-16 в 15:46, admin, рубрики: diy или сделай сам, Raspberry Pi, react.js, звук
Тот, кто сталкивался с продукцией Sonos, определенно согласится с тем, что Sonos — это Apple от мира портативной акустики (во всяком случае, пока еще официально не вышел HomePod). Акустика Sonos — это сочетание минимализма, качества и удобства, которая восхищает с первого прикосновения. Я не являюсь счастливым обладателем этой акустики, но знакомство с Sonos Play 1 настолько впечатлило меня, что я решил создать нечто подобное — портативную домашнюю акустику под управлением Raspberry Pi. Под катом я расскажу, как у меня это получилось.
Читать полностью »
Проблемы React UI Kit-а и единой дизайн-системы, о которых вы не знали
2017-09-14 в 9:01, admin, рубрики: design, development, React, react.js, ReactJS, UI, uikit, UX, ux/ui, Блог компании Tinkoff.ru
2 сентября 2017 прошла конференция Moscow Frontend, где я на примере React UI Kit рассказывала о проблемах, которые встречаются при внедрении UI Kit в компании. Тема оказалась актуальнее, чем я могла предположить, поэтому решила опубликовать статью по этой же тематике, преследуя две цели: донести материал до людей, которые не смогли оказаться на конференции лично, и предоставить отличную возможность провести жаркую дискуссию на эту тему в комментариях.
Приятный бонус заключается в том, что после выступления и дискуссий в кулуарах в моем материале к докладу появились дополнения и нововведения. Поэтому, даже если вы были на конференции, вам все равно будет интересно прочитать статью. В конце материала я оставила несколько вопросов, на которые я попрошу ответить в комментариях. Приятного чтения!
Читать полностью »
Валидация React компонентов с помощью Livr.js
2017-09-10 в 11:10, admin, рубрики: javascript, livr.js, react.js, ReactJS, validationПару лет назад я увидел на хабре статью про LIVR и с тех пор использую библиотеку на всех проектах. С переходом на React я адаптировал для валидации ее же, т.к. существующие решения не предлагали гибкости которой мне хотелось. Свое решение я уже использую на двух проектах и решил выложить в npm — может кому-то еще оно покажетсяя удобным.
Пакет называется react-livr-validation.
Читать полностью »