Что это такое?
Evergreen — это React UI-фреймворк от Segment: набор готовых, аккуратных React-компонентов корпоративного уровня для веб-приложений, которые работают сразу из коробки.
Evergreen — это React UI-фреймворк от Segment: набор готовых, аккуратных React-компонентов корпоративного уровня для веб-приложений, которые работают сразу из коробки.Это фреймворк, на котором строится всё приложение, или набор компонентов на выбор?Это библиотека компонентов: множество компонентов и инструментов, которые подключаются по одному, — всё построено на React-примитиве ui-box, чтобы их было удобно комбинировать.
Это библиотека компонентов: множество компонентов и инструментов, которые подключаются по одному, — всё построено на React-примитиве ui-box, чтобы их было удобно комбинировать.Как добавить её в своё React-приложение?Установите пакет evergreen-ui (npm install evergreen-ui), затем импортируйте нужные компоненты — всё работает в стандартных React-настройках вроде Create React App.
Установите пакет evergreen-ui (npm install evergreen-ui), затем импортируйте нужные компоненты — всё работает в стандартных React-настройках вроде Create React App.Кроме React что-то ещё нужно?Ничего, кроме React и npm — пакет сам подтягивает свои зависимости (downshift, утилиты lodash); для сборки репозитория из исходников нужен Node 14+.
Ничего, кроме React и npm — пакет сам подтягивает свои зависимости (downshift, утилиты lodash); для сборки репозитория из исходников нужен Node 14+.Она навязывает свою систему стилей?Используется CSS-in-JS — Evergreen поставляет собственное решение на базе ui-box, — поэтому стили живут прямо в JavaScript, а не в отдельных CSS-файлах.
Используется CSS-in-JS — Evergreen поставляет собственное решение на базе ui-box, — поэтому стили живут прямо в JavaScript, а не в отдельных CSS-файлах.Она только для корпоративных приложений?Дизайн-язык ориентирован на веб-приложения корпоративного уровня, но сами компоненты универсальные и работают из коробки в любом React-приложении.
Дизайн-язык ориентирован на веб-приложения корпоративного уровня, но сами компоненты универсальные и работают из коробки в любом React-приложении.Можно бесплатно использовать в коммерческих проектах?Да — лицензия MIT, бесплатно, в том числе в коммерческих целях. Один нюанс: входящие в комплект иконки BlueprintJS распространяются по собственной версии лицензии Apache 2.0.
Да — лицензия MIT, бесплатно, в том числе в коммерческих целях. Один нюанс: входящие в комплект иконки BlueprintJS распространяются по собственной версии лицензии Apache 2.0.Можно настроить внешний вид под свою тему?Да — Evergreen из коробки поддерживает мощный механизм тем, и в документации тема оформления подробно разобрана.
Да — Evergreen из коробки поддерживает мощный механизм тем, и в документации тема оформления подробно разобрана.Работает ли она с серверным рендерингом?Да — есть простая поддержка SSR с автоматической гидратацией через функцию extractStyles(), а в репозитории есть примеры настройки для Next.js и GatsbyJS.
Да — есть простая поддержка SSR с автоматической гидратацией через функцию extractStyles(), а в репозитории есть примеры настройки для Next.js и GatsbyJS.Почему Segment сделал собственный UI-кит?Их ключевые убеждения: невозможно предугадать все будущие требования, поэтому стоит строить системы, готовые к изменениям; давать разумные значения по умолчанию, оставляя полный контроль, когда он нужен; и делать работу с библиотекой и вклад в неё приятными — отсюда упор на документацию и удобство для разработчика.
Их ключевые убеждения: невозможно предугадать все будущие требования, поэтому стоит строить системы, готовые к изменениям; давать разумные значения по умолчанию, оставляя полный контроль, когда он нужен; и делать работу с библиотекой и вклад в неё приятными — отсюда упор на документацию и удобство для разработчика.Насколько болезненны обновления мажорных версий?Критические изменения сопровождаются руководством по миграции — для перехода на v7 в репозитории опубликован такой гайд, — так что у вас есть документированный путь обновления, а не догадки.
Критические изменения сопровождаются руководством по миграции — для перехода на v7 в репозитории опубликован такой гайд, — так что у вас есть документированный путь обновления, а не догадки.What are similar projects?primitives, ant-design, chakra-ui, tamagui, styled-components, naive-ui, vuetify, primeng
primitives, ant-design, chakra-ui, tamagui, styled-components, naive-ui, vuetify, primengWhich topics is it in?css-in-js, design-systems, ui-kit, ssr, themes, enterprise, component-library, ui-components, customization, ui, web-development, react
css-in-js, design-systems, ui-kit, ssr, themes, enterprise, component-library, ui-components, customization, ui, web-development, react