arui-feather
Advanced tools
arui-feather — это библиотека React компонентов для создания веб-интерфейсов.
Вы можете посмотреть примеры использования на нашем сайте с документацией.
Команда дизайн-системы Альфа-Банка ищет разработчика интерфейсов: https://hr.alfabank.ru/vacancies/ui-dev. Присоединяйся!
arui-feather доступен как npm-пакет.
npm install arui-feather --save
Desktop
Mobile
Использование в адаптивной/мобильной среде
Необходимые внешние зависимости системы:
node 8 и npm
Шаги запуска демо:
npm inpm run demoЗапустить demo на произвольном порту:
PORT=8888 npm run demo
Использовать только для обновления нескольких компонентов. Иначе не хватает памяти.
Перед каждым коммитом js код проверяется через eslint, css через stylelint.
Запуск unit-тестов npm run test.
Запуск unit-тестов для определенных компонентов TESTS=amount,calendar npm run test.
Запуск unit-тестов используя Chrome npm run test -- --browser=Chrome
Запуск линтера для css npm run lint-css.
Запуск линтера для js npm run lint-js.
Запуск тестов на мобильных устройствах
Для тестирования деградаций в вёрстке используется gemini.
Тесты для каждого компонента хранятся в gemini/<component>.gemini.js.
Запуск тестов производится командой npm run gemini.
Обновление или создание новых эталонных скриншотов: npm run gemini-update.
Для запуска тестов или обновления скриншотов необходимы следующие шаги:
export SAUCE_USERNAME=alfalab.js SAUCE_ACCESS_KEY={ ключ взять у мейнтейнеров }npm run sauce-connectnpm run gemini или npm run gemini-updateЗапуск gemini на выборочное число тестов (используется опция --grep): npm run gemini -- --grep="button|select".
Во время тестирования рендер каждого сьюта доступен по URL, например: http://localhost:8668/popup/popup_theme_alfa-on-color.popup_size_m.popup_prop-set_1
Для оптимизация svg используется svgo.
npm install svgo -g
find src -name *.svg -print0 | xargs -0 -L 1 svgo
Подробнее о том, как контрибьютить в проект
Для оптимизации производительности компонентов используется метод shouldComponentUpdate, реализуемый декоратором @performance.
Пример использования:
import performance from '../performance';
@performance(true)
class Component extends React.Component {}
Для выпуска новой версии используйте следущие команды:
npm run release-patchnpm run release-minornpm run release-majorЗапуск этих команд автоматически сформирует changelog, сделает новый git tag, запустит сборку и публикацию.
Deprecation публичного API должно происходить плавно, позволяя пользователям библиотеки обновляться с наименьшими неудобствами. Deprecation происходит со следующим сценарием:
До полного удаления устаревшей функциональности в мажорном релизе, должна быть выпущена как минимум одна минорная версия для уведомления пользователей об изменениях.
© 2016-2019 Alfa-Bank. Код лицензирован Mozilla Public License 2.0.
16.0.0 (2019-12-27)
<a name="15.6.0"></a>
FAQs
Alfa-Bank UI lightweight library
The npm package arui-feather receives a total of 364 weekly downloads. As such, arui-feather popularity was classified as not popular.
We found that arui-feather demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 19 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Research
Socket researchers have discovered malicious npm packages targeting crypto developers, stealing credentials and wallet data using spyware delivered through typosquats of popular cryptographic libraries.
Security News
Socket's package search now displays weekly downloads for npm packages, helping developers quickly assess popularity and make more informed decisions.
Security News
A Stanford study reveals 9.5% of engineers contribute almost nothing, costing tech $90B annually, with remote work fueling the rise of "ghost engineers."