Свежие ресурсы для веб-дизайнеров и разработчиков (октябрь 2018 года)

В отличие от любой другой индустрии веб-разработка меняется на дрожжах. Есть новые инструменты, методы и структуры, разработанные почти каждый день, чтобы удовлетворить новые тенденции и технологический прогресс в веб-индустрии.

Итак, вот список новейших инструментов и ресурсов, включая PHP-фреймворк, чтобы легко выполнить E2E-тестирование для вашего PHP-приложения, инструмент для генерации цветов, соответствующих стандартам доступности W3C, и несколько расширений Vue.js. Давайте прыгнем, чтобы увидеть полный список.

Приложение ключевых кадров

Веб-приложение обеспечение хорошего графического интерфейса для создания CSS-анимации и визуализировать анимацию с временной шкалой. Приложение также позволяет загружать вывод CSS, как только вы будете удовлетворены. Ключевые кадры CSS - не самая простая спецификация в CSS, поэтому наличие такого приложения определенно сэкономит время.

Symfony Panther

“Symfony Panther” это удивительный PHP-фреймворк от Symfony для выполнения E2E (сквозного) теста. Это идет с его встроенный веб-сервер и может использовать Chrome, установленный на вашем компьютере, для выполнения теста E2E.

Более того, он поддерживает Выполнения JavaScript, захват скриншотов, пользовательский драйвер Selenium, Chrome и Firefox клиент. Будучи автономным фреймворком, вы можете включать Panther в любые проекты PHP, например, WordPress, Joomla и т. Д..

TrendyPalettes

Коллекция красивых цветовых палитр. Коллекция предлагает тысячи подобранные цветовые палитры. Пользователи могут представить новую цветовую палитру, поэтому всегда будут добавляться новые палитры каждый день. TrendyPalettes также доступен как расширение Chrome.

Eagle.js

Eagle.js - это инфраструктура для создания слайдов, созданная поверх Vue.js, так что вы можете легко повторно использовать пользовательские компоненты Vue.js внутри слайдов. Слайд также поддерживает навигация с помощью клавиатуры и мыши, индивидуальный стиль или тематика, интерактивные виджеты, а также предоставляет шаблон, чтобы помочь быстро настроить и представить слайд. Это может быть отличным альтернатива Reveal.js, особенно если вы уже знакомы с Vue.js.

Grape.js

GrapeJS - это веб-конструктор с открытым исходным кодом, который позволяет создавать веб-страницы просто перетаскивание компонентов. Он предоставляет некоторые общие компоненты, такие как Text, Image, Vidoe, Columns, Map, Quote и т. Д. Вы можете экспортировать его в HTML и CSS, и результат будет удивительно аккуратным, в отличие от некоторых подобных инструментов, которые я пробовал ранее. Проверьте демо.

бессодержательный

Vapid - это новая CMS, созданная на Node.js с интересным и уникальным подходом. Большинство CMS, при условии, что вы хотите включить новый тип данных, потребуют сначала определить пользовательский ввод в области Dashboard / Admin.

С Vapid вы можете определить шаблон наоборот, и Vapid автоматически сгенерирует ввод в области Dashboard / Admin. Это доступно как пакет NPM.

WP CLI Notification

Имя говорит само за себя. Это специальный пакет WP-CLI для отображения уведомлений ОС, когда WP-CLI уже завершил выполнение. Довольно фантазии.

CSSGr.id

Веб-приложение для создания CSS Grid. Вы можете настроить количество элементов, столбцов, разрыв между каждым элементом, а также каждый диапазон элементов, а затем сгенерировать код HTML и CSS. CSS Grid - это одна из тех спецификаций CSS, которую не совсем легко понять. Но этот инструмент значительно облегчает работу с ним..

Прокрутка подсказка

ScrollHint - это библиотека JavaScript, которая позволяет вам создать элемент сверху, чтобы показать, что раздел на вашей веб-странице можно прокручивать. Это особенно полезно, если у вас есть элемент горизонтальной прокрутки на веб-странице, так как большинство людей не используют естественную прокрутку слева направо (или наоборот) при использовании Интернета..

PristineJS

Библиотека JavaScript для добавления проверки ввода. HTML5 поставляется с некоторой проверкой типа уже с “Тип = электронная почта”, а также “тип = число” например. Но если вам нужна пользовательский валидатор, который не реализован в HTML5, эта библиотека JavaScript пригодится.

SelectionJS

Большинство людей, вероятно, уже знакомы с тем, как выбрать несколько папок или файлов на своем компьютере; они обычно удерживают свой щелчок мыши и перетаскивают его вокруг файлов или папок, которые они хотели бы выбрать. Если вы хотите применить тот же UX на своем сайте, SelectionJS пригодится.

Webdash

Webdash это инструмент, который может отобразить ваш проект в графическом интерфейсе. Он соединяется через package.json файл на вашем компьютере. Таким образом, он может отображать список Пакеты NPM, обновить пакет, зарегистрированные скрипты, запустить скрипт, и предварительный просмотр файлов README прямо из Webdash. Довольно круто!

CanJS

Фреймворк JavaScript для создания веб-интерфейса. Он похож на React.js с некоторыми дополнительными функциями и поставляется с маршрутизатор, DOM Utilities и AJAX функционируют прямо из коробки. Он также имеет довольно активную поддержку сообщества, предоставляет некоторые расширения.

CheerioJS

Библиотека JavaScript, которая реализует спецификацию jQuery Core для DOM (Document Object Model) и предназначена для использования на стороне сервера. Если вы работать с Node.js, а также пользоваться синтаксисом jQuery лайк addClass (), атр (), а также находить(), это тот JavaScript, который вы ищете.

Цветная коробка

Colorbox - это инициатива Lyft по созданию цветовой композиции, которая соответствует стандарту Accessiblity. Инструмент работает с умным алгоритмом, который позволяет вам просто переместить ручку, изменить конфигурацию, и он будет генерировать правильные цвета для вас. Это просто потрясающе.

Типизированные свойства в PHP 7.4

PHP7.3 уже не за горами, как мы упоминали в предыдущей части. Но PHP7.4 уже в плане. Один из планов - Typed Property. Это означает, что вы скоро сможете напиши что-нибудь вроде public int $ id; в вашем классе PHP. Это огромное изменение, которое может значительно помочь уменьшить количество ошибок в PHP-приложении..

трафарет

Компилятор JavaScript, который позволяет легко создавать веб-компоненты с последними стандартами. Вдобавок к этому, StencilJS также добавляет в этот микс современный подход к веб-разработке, включая Поддержка JSX, реактивность, маршрутизатор и управление состоянием используя плагин.

Vue Infinite Загрузка

Расширение Vue для создания бесконечной страницы прокрутки. Это мобильное и совместим с любым прокручиваемым элементом. Он также поддерживает два направления прокрутки и, что самое приятное, экономит много времени..

V буфер обмена

Пользовательское расширение Vue.js, которое делает его таким легко создать “копия” кнопка. Вы можете просто добавить v-буфер приписать кнопку, и все готово. Это расширение Vue.js работает для всех современных браузеров, а также IE11 и последних.

Vue Select

Компонент Vue.js, который обеспечивает функциональность, аналогичную Select2. Он предназначен для Vue.js, что позволяет совместим с Vuex, пользовательскими шаблонами, и куча других благ Vue.js.