Свіжі ресурси для веб-дизайнерів і розробників (липень 2017 р.)
Час летить, і ми зараз знаходимося в середині 2017 року. У цьому місяці ми маємо низку чудових бібліотек JavaScript і кілька інших, як плагін для включення GraphQL у WordPress, настільну програму для відображення даних CSV і кілька веб-сайтів рамки. Давайте перевіримо їх.
HeroPatterns
Колекція повторюваний шаблон, виконаний з SVG які можна використовувати як фон у своєму веб-сайті. Сайт обладнаний зручною установкою налаштувати колір і непрозорість шаблону дозволяє просто скопіювати та вставити код для додавання у ваш CSS.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017.jpg)
TestCafe
TestCafe - це наскрізний (e2e) інструмент тестування що дозволяє перевірити веб-сайти та веб-програми так, наче вони використовуються реальними користувачами. Це дозволить автоматизувати кілька речей при виконанні тесту, в тому числі запускаючи браузери, запускайте вказаний тестовий блок, генеруйте звіти, скріншоти, а також sourcemap легко виправляти помилки.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_2.jpg)
SugarJS
SugarJS - це бібліотека JavaScript для маніпулювати об'єктами, масивами та датами з більш симпатичним і більш читаним синтаксисом. Бібліотека також має кілька функцій, наприклад, утиліти, .escapeHTML ()
які будуть конвертувати елементи HTML у їхній формат Entity.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_3.jpg)
MS
Зручна бібліотека JavaScript для поворот часу, числа і звичайного рядка до мілісекунд. мс ("2 дні")
, наприклад, буде перетворено на 172800000
.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_4.jpg)
pa11y
Великий набір інструментів, щоб допомогти покращити доступність на вашому веб-сайті та веб-програми. pa11y складається з CLI для тестування будь-яких веб-сторінок для будь-яких проблем з доступністю, a Інформаційна панель показує згенеровані звіти про помилки та попередження, і CLI, спеціально розроблений для інструментів CI, таких як Codeship або Travis.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_5.jpg)
Ікони перо
A колекція ікон з сучасним vibe. Ці піктограми ідеально підходять для веб-сайту та додатків, призначених для будь-яких платформ (iOS, Windows або Ubuntu). Іконки входять SVG, а також в компонентах React і Angular.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_6.jpg)
Реагуйте на політ
Модуль React to Створіть композицію анімації у вашому додатку. Бібліотека натхненна Принципом ескізу, в якому ви можете додавати інтерактивність до компонента інтерфейсу швидко і легко.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_7.jpg)
BounceJS
Бібліотека для створювати анімації з ефектом відскоку. Анімація працює на основі CSS3 і ряду попередньо встановлених анімацій. Ви можете встановити бібліотеку JavaScript через npm, bower або просто скопіюйте анімацію CSS на веб-сайті.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_8.jpg)
Бойлер
Бойлер є фреймворк електронної пошти з керівництвом для написання HTML коду який відображатиметься на більшості популярних клієнтів електронної пошти. Ви можете знайти додаткові рамки електронної пошти в попередній публікації.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_9.jpg)
Devicon
Колекція іконок мов програмування, проектування та інструментів розробки. Піктограми доступні у форматі SVG та Font. Деякі конкретні Іконки, такі як Firefox, AWS і HTML5, також містять детальні варіанти. Досить холодне право?
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_10.jpg)
Тепер UI Kit
Інтерфейс, що відповідає колекції, заснований на Bootstrap 4. Це має 50 елементів і 3 власні шаблони. Окрім версії HTML, інтерфейс користувача також доступний у форматах PSD та Sketch.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_11.jpg)
T-Scroll
T-Scroll - a Бібліотека JavaScript для застосування анімації коли елемент відображається у вікні перегляду. Він оснащений декількома опціями та попередньо встановленими анімаціями.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_12.jpg)
Редактор Ory
ORY - це сучасний і доступний веб-редактор у мережі. Редактор ORY є побудований на вершині React і Flux. Це полегшує редагування, дозволяючи користувачам редагувати вміст і негайно бачити результат без необхідності знати спеціальні синтаксиси, як HTML або Markdown.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_13.jpg)
TadViewer
TadViewer зручно додаток для робочого столу для перегляду CSV і працює на великих даних і файлах. Програма доступна на MacOS, Windows і Linux.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_14.jpg)
Плавний прокручування Polyfill
Функція Smooth Scrolling має більш приємний користувальницький досвід. Тепер він запропонований і розроблений офіційно в W3C. На даний момент він працює тільки в Chrome, Firefox і Opera. Використовуйте цю бібліотеку для емулювати поведінку плавного прокручування в Internet Explorer і Safari.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_15.jpg)
Noty
Бібліотека JavaScript для відображення сповіщень, Noty дозволяє легко показувати повідомлення Alart, Success, Error, Warning, Information або діалогове вікно. Її можна використовувати разом з бібліотекою анімації, як mo.js і bounce.js для того, щоб сповзання сповіщання виходило та виходило.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_16.jpg)
HopScotch
Hopscotch є Проект з відкритим кодом, створений за допомогою LinkedIn. Це рамки, які дозволяють розробникам легко додавати екскурсії. Ознайомтеся з демонстрацією для живого прикладу та API.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_17.jpg)
SurveyJS
SurveyJS - це ще одна чудова бібліотека JavaScript. Як випливає з назви, це так призначені для створення вхідних даних для опитувань. Він містить різні типи вхідних даних для заповнення відповідей та опитування також перенесено на кілька популярних фреймворків JavaScript включаючи AngularJS, VueJS і React.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_18.jpg)
WP GraphQL
GraphQL зростає і може бути Сильний претендент на заміну REST архітектури що забезпечує роботу майже всіх веб-API. Це плагін, який дозволить вам це зробити отримати вміст WordPress за допомогою GraphQL. Ось велике посилання на те, як REST і GraphQL відрізняються один від одного.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_19.jpg)
Редактор Монако
Редактор Монако - це редактор повноваження Visual Code Editor. Він побудований корпорацією Майкрософт і підтримує декілька мов з коробки, включаючи HTML, CSS, LESS, CoffeeScript і PHP, а також Intellisense допомагає швидше писати код.
![](http://savtec.org/img/images/fresh-resources-for-web-designers-and-developers-july-2017_20.jpg)