В нашем ноябрьском списке передовых технологий мы собрали несколько потрясающих проектов GitHub с новым CSS.Framework, менеджер пакетов node.js и решение на чистом CSS для реализации значков, эффектов загрузки, всплывающих подсказок.
Что ж, давайте посмотрим вместе. Повеселись!
1.Wing
Wing
Wing — это крошечный (всего 4 КБ минимизированный) отзывчивый CSS-фреймворк, который предоставляет адаптивную сетку из 12 столбцов и базовый набор компонентов стиля для создания прочной основы для вашего веб-сайта. Конечно, самое классное в этом проекте то, что подавляющее большинство HTML-элементов стилизуются автоматически, без дополнительных классов. надеюсь, вам понравится!
ЗДЕСЬ:https://github.com/KingPixil/wing/
2.Shave
Shave
Shave — это легкий плагин JavaScript с нулевой зависимостью, который обрезает многострочный текст, чтобы он соответствовал элементам html на основе максимальной высоты, и сохраняет необработанные текстовые строки в скрытых элементах , чтобы ваш текст оставался неповрежденным на странице. Shave не зависит ни от какой библиотеки и предоставляет автономную версию плагина в jQuery.
ЗДЕСЬ:https://dollarshaveclub.github.io/shave/
3.Cerebral
Cerebral
Менеджер состояния приложения JavaScript MVC с собственным отладчиком. В Cerebral состояние приложения хранится в единой древовидной модели, которая управляет всеми состояниями на стороне сервера и на стороне клиента.
Отладчик имеет права управления моделями, контроллерами и представлениями в режиме реального времени.
ЗДЕСЬ:http://www.cerebraljs.com/
4. Wenk
Wenk
Wenk — это легкая библиотека текстовых подсказок, написанная на чистом CSS. Хотя его сжатая версия имеет размер всего 700 байт, она по-прежнему управляема и предлагает некоторые параметры настройки. Например, размер, положение и выравнивание текста различных всплывающих подсказок.
ЗДЕСЬ:https://tiaanduplessis.github.io/wenk/
5. CSS Loader
CSS Loader
CSS Loader — очень полезный загрузчик. Это позволяет разработчикам быстро создавать индикаторы загрузки, используя чистые файлы CSS и пустой элемент
ЗДЕСЬ:http://www.raphaelfabeni.com.br/css-loader/
6.Yarn
Yarn
Я считаю, что Yarn, менеджер пакетов Node.js с открытым исходным кодом, недавно запущенный Facebook, был услышан всеми. Он имеет мощную систему кэширования, которая значительно сокращает время установки пакетов и поддерживает одинаковую структуру каталогов node_modules для всех пользователей, участвующих в проекте, помогая уменьшить трудно отслеживаемые ошибки и репликацию на нескольких машинах.
Хотя это отличается от предыстории NPM, но использование Yarn почти эквивалентно использованию NPM, разработчикам нужно понять это быстрее!
ЗДЕСЬ:https://yarnpkg.com/
7. Canvas Gauges
Canvas Gauges
Canvas Gauges — это полностью настраиваемый датчик, использующий чистый JavaScript и HTML5 Canvas (холст), который можно использовать для создания измерительных устройств, таких как автомобильные спидометры, термометры и многое другое.
Из-за небольшого объема кода и отсутствия зависимостей он также подходит для устройств IoT. Вы можете увидеть это на примерах на сайте.
ЗДЕСЬ:https://canvas-gauges.com/
8.CSS Icon
CSS Icon
CSS Icon — это веб-сайт с набором значков, который объединяет более 500 реализаций чистого кода CSS. Он также очень прост в использовании.При нажатии на иконку всплывает HTML и CSS-код, соответствующий значку.В то же время вы можете интуитивно понять, какая часть CSS-кода и какие элементы иконки реализовано.
Обязательно ли ставить высшие оценки такому замечательному проекту? Приходите и наслаждайтесь!
ЗДЕСЬ:http://cssicon.space/
9. CurrencyFormatter.js
CurrencyFormatter.js
CurrencyFormatter.js — это простая и практичная библиотека валют в чистом формате JS. Он поддерживает форматы валют для 155 разных стран и локализации для более чем 700 различных языков.
Кроме того, он также может обрабатывать некоторые форматы валюты, которые не используются, что очень удобно.
ЗДЕСЬ:https://osrec.github.io/currencyFormatter.js/
10. KUTE.js
KUTE.js
Встроенный механизм анимации JavaScript с высокой производительностью: KUTE.js. Его основная библиотека предоставляет все основные методы анимации, и вы можете добавить множество плагинов для расширения функциональности KUTE. В то же время у него также есть отдельное расширение, которое может одновременно работать со свойствами jQuery, SVG, CSS и т. д.
ЗДЕСЬ:http://thednp.github.io/kute.js/
11. Vue Material
Vue Material
Vue Material — это легкий фреймворк Vue.js, созданный в соответствии со спецификацией Material Design. Он направлен на предоставление набора повторно используемых высококачественных компонентов и набора элементов пользовательского интерфейса для создания приложений с поддержкой Vue2.0 для современных веб-браузеров.
Библиотека также проста в реализации и не имеет никаких зависимостей, кроме Vue.js.
ЗДЕСЬ:https://marcosmoura.github.io/vue-material/#/
12. Test Cafe
Test Cafe
Test Cafe — это комплексное решение для тестирования веб-приложений, написанных на чистом Node.js. Он основан на Node.js и не требует установки ничего, кроме пакетов NPM — никаких плагинов для браузера или компиляторов.
После того, как вы написали свои тесты, запустите Test Cafe, и он запустит для вас браузерные тесты, соберет результаты и создаст отчеты.
ЗДЕСЬ:http://devexpress.github.io/testcafe/
13. Core.css
Core.css
Core.css — это легкий фреймворк для создания адаптивных веб-сайтов. Он весит всего 1,3 КБ, в нем нет предустановленных элементов и встроенных анимаций. Так что он подходит для создания любого небольшого веб-проекта.
ЗДЕСЬ:http://corecss.io/
14.Flv.js
Flv.js
Я полагаю, что все знакомы со Station B, и Flv.js — это проигрыватель HTML5 Flash Video (FLV), исходный код которого открыт на веб-сайте bilibili.Он разработан на чистом родном JavaScript (написан на ECMAScript 6) и не использует Flash.
Его принцип работы заключается в том, что Flv.js анализирует поток файлов FLV в JavaScript, перепаковывает его в fmp4 в режиме реального времени и передает в браузер через расширения Media Source для реализации воспроизведения видео в формате FLV.
ЗДЕСЬ:https://github.com/Bilibili/flv.js
15.Next.js
Next.js
Next.js — это JavaScript-фреймворк общего назначения, основанный на React. Он предоставляет удобный способ создания новых веб-приложений JavaScript. Разработчикам не нужно тратить слишком много времени на настройку конфигураций Webpack или Babel.
ЗДЕСЬ:https://zeit.co/blog/next
Вышеизложенное — это все, чем мы поделились в этой статье, я надеюсь, вы сможете найти интерфейсную библиотеку, подходящую для вашего проекта.
через: http://www.jianshu.com/p/f651fc45e586