11 удивительных GitHub-репозиториев для создания прекрасного проекта
Сегодня я бы хотел поделиться с вами замечательными репозиториями GitHub. С их помощью вы сможете задействовать в своем проекте сложные анимации и разные полезные функции.
1. Lottie-Web/Bodymovin
Начну, пожалуй, со своего любимого репозитория. С помощью этой библиотеки можно экспортировать анимацию из Adobe After Effects прямиком в ваш сайт.
2. Hover.css
Коллекция hover-эффектов на CSS3, которые можно применить к ссылкам, кнопкам, логотипам, SVG-изображениям и т.д. Применяйте к своим элементам, дополняйте своими творениями или просто вдохновляйтесь. Доступно на CSS, Sass и LESS.
3. Magic Grid
Эта библиотека умеет создавать адаптивную сетку, в которой не придётся задавать стили через @media. Просто укажите контейнер для неё и наслаждайтесь результатом.
4. Vue/React Content Loader
SVG-компонент для создания плейсхолдера загрузки, как в карточках Facebook.
5. React Image Gallery
React-компонент «карусель» для просмотра изображений.
6. SVG.js
Легковесная библиотека для работы с SVG без внедрения зависимостей.
7. React Motion
Репозиторий, который запросто решит ваши проблемы с анимацией.
При использовании анимированных компонентов в 95% случаев нам не нужно прибегать к точному описанию каждого кадра.
Настройте для элемента UI лишь два параметра (damping и stiffness), а обо всем остальном позаботится магия физики. Таким образом, вам не нужно беспокоиться о мелочах. Это также значительно упрощает работу с API.
8. RELLAX
Rellax — это легковесная и простая JavaScript-библиотека для создания эффекта параллакса. Обновление: Rellax теперь работает и на мобильных устройствах (версия 1.0.0).
9. mo · js
Библиотека предоставляет компоненты (такие как html, shape, swirl, burst и stagger) для создания анимации. А ещё в ней есть всё необходимое для того, чтобы ваша анимация выглядела максимально естественно.
10. Reveal.js
Reveal.js — это open-source фреймворк для построения HTML-презентаций. С его помощью любой, у кого есть браузер, сможет бесплатно создавать полнофункциональные и красивые презентации.
11. Zdog
С этой библиотекой вы сможете даже без знания геометрии или алгебры создавать псевдо-3D элементы. Библиотеку легко освоить, так что ее изучение не займёт у вас много времени.
Заключение
Спасибо, что уделили время этой статье. Я настоятельно рекомендую начинающим frontend-разработчикам почаще применять такие готовые решения, а не хвататься за самостоятельную реализацию сложных задач. Так вы сможете избежать множества проблем.
Нет нужды заново изобретать велосипед.
Сокращенный перевод статьи 18 amazing GitHub repositories that will help you make a Beautiful Project. Некоторые репозитории были исключены из списка ввиду прекращения их поддержки.