Головна » Веб дизайн » Свіжі ресурси для веб-дизайнерів і розробників (березень 2017 р.)

    Свіжі ресурси для веб-дизайнерів і розробників (березень 2017 р.)

    З CLI (інтерфейс командного рядка) ми можемо оптимізувати та автоматизувати робочі процеси веб-розробки. Ось чому в цій частині ми включили досить багато чудових інтерфейсів, які можна встановити на локальному комп'ютері або запустити на сервері. Крім того, ми також включили декілька Інструменти PHP, додатки браузера та бібліотеки JavaScript. Давайте перевіримо їх.

    Натисніть "Більше ресурсів"

    Натисніть "Більше ресурсів"

    Знайдіть всю нашу колекцію рекомендованих ресурсів і найкращі доступні інструменти веб-дизайну та розробки.

    Гетцлі

    Новий кодер від Google дозволяє стискати зображення до 35% від початкового розміру при збереженні якості. Це досить прорив, враховуючи, що подібні кодери з відкритим кодом, такі як JPEGOptim і jpegtran обмежуються лише 20% від середньої кількості. Я бачу, що існує низка додатків і плагінів для платформи CMS, що інтегрують Guetzli для оптимізації файлів JPEG.

    Дорожня карта для розробників

    Як видно з назви, Дорожня карта для розробників інфографіки подорожі бути веб-розробником. Є три курси Front-end, Back-end і DevOps. Ці дорожні карти нагадують, ну, карту; і є чудовим посиланням де ми зараз знаходимося, що ми, можливо, пропустили, і куди ми йдемо далі.

    Netlify CMS

    SmashingMagazine нещодавно зробив жирний крок до урви WordPress і спробувати щось нове повністю з новою CMS під назвою Netlify CMS. Це нова CMS, побудована поверх React.js і може бути інтегровані з будь-якими статичними генераторами сайтів, такими як Jekyll, Hugo і MiddleMan.

    BadSSL

    Це перевірити конфігурацію SSL. BadSSL є зручним інструментом для налагодження та помилок через SSL, встановлених на вашому сайті.

    Алікс

    Alix - це Розширення Chrome, що дозволяє перевіряти доступність вашого веб-сайту. Після встановлення та увімкнення плагін додасть поле накладання на декілька елементів на сторінці які створюють попередження або помилки.

    AR.js

    AR.js є Бібліотеки JavaScript на відміну від інших. Ця бібліотека дозволяє нам створювати розширену реальність, використовуючи веб-технології, і дивно працює на мобільних телефонах.

    Тенденція реагування

    Це реагувати компонент з Unsplash створити прекрасні Лінійка діаграми, як правило, для відображення тенденцій. Компонент налаштовується; Ви можете встановити товщину лінії, колір, градієнти і криву плавності. Ви можете просто використовувати графічний інтерфейс користувача зручно генерувати код компонента.

    Gitee

    A додаток macOS для відстеження активності Github безпосередньо з робочого столу, Gitee додає новий елемент до рядка стану, який показує кількість зірок, послідовників і сповіщень. Крім того, ви також можете переглядайте діаграми вашого натискання та вкладає в сховище, а також у репозиторій тренду на поточний місяць і тиждень. Це Github на робочому столі в двох словах.

    Goops

    Огляди - це зручний CLI, який буде аналізувати ваш каталог проекту і визначити каталоги і файли, які потрібно додати в .gitignore. CLI може бути встановлений через NPM. Після встановлення введіть кози і зробили.

    Налагодження CSS

    DebugCSS - це CSS drop-in утиліта, яка дозволяє аналізувати і перевіряти ваш CSS-вивід у браузері. Він працює дуже схоже на Alix, коли ви завантажуєте таблицю стилів debugCSS або використовуєте букмарклет виділяє елементи на сторінці, які створюють помилки або попередження.

    EagleJS

    EagleJS - це Бібліотека JavaScript для створення презентації схожий на RevealJS. EagleJS різним чином відрізняється; він побудований з використанням Vue.js, JavaScript MVC фрейму й використовує Pug як система шаблонів для побудови слайда.

    BootstrapTour

    A JavaScript бібліотека для створення спливаючих посібників з використанням компонента Bootstrap. Пов’язані посібники, як правило, з'являються для нового користувача, щоб пройти через інтерфейс програми, нові функції та показувати поради. Це ідеальна бібліотека, якщо ваш сайт також побудований з Bootstrap.

    Цегла

    Цегла бібліотека JavaScript, призначена для створення інтерфейсу веб-додатків. Ви знайдете деякі поширені, такі як Календар, Меню та Форма серед компонентів, що постачаються в комплекті "storage-indexeddb" компонент, що дозволяє вам зберігати дані на стороні клієнта за допомогою IndexedDB.

    Жовтень

    OctoTree - приємна утиліта, яка дозволяє переглядати вихідні коди та файли на Github з деревоподібною структурою, як у середовищі IDE або редакторах коду. Він поставляється як надбудова для Chrome, Safari, Firefox і Opera, і доступний у їх офіційному сховищі додаткових компонентів. Octotree підтримує сховище приватних і корпоративних Github.

    Сповіщення Github

    Ще одне корисне розширення Github для Chrome. Після встановлення ви зможете отримувати сповіщення, навіть якщо ви зараз не перебуваєте на сторінках Github. Відмінний плагін, якщо ви хочете залишатися в контурі зі своїми сховищами.

    Розгортальник

    Deployer - це інструмент для розгортання сайтів PHP. Він працює з низкою популярних фреймворків і платформ, включаючи WordPress, Drupal, Magento, Laravel і CodeIgniter. За допомогою цього інструменту ви можете створювати власні рецепти, частину команди для запуску під час розгортання. Він поставляється з Відкат функція, яка дозволить вам повернутися до попередньої версії у випадку збоїв.

    PHPStan

    CLI, який сканує файли PHP, щоб знайти помилки без виконання часу виконання. Це означає, що вам не потрібна повноцінна середовище PHP для налагодження файлів PHP у вашому проекті.

    NGINX Котли

    Набір загальних конфігурацій Nginx, які включають кешування Backend, обмеження швидкості підключення та запитів, а також деякі інші кращі практики для підвищення швидкості вашого сайту та налаштування його для швидкого руху.

    Пузирчасті

    Bubbly - це чудова командна лінія, яку ви можете встановити на сервері для створення, керування та поновлення сертифікату за допомогою шифрування Let's Encrypt. Дозуючий SSL тепер стає набагато простіше.

    Вафельні сітки

    Тим не менш, інший CSS сітки рамках побудований з Flexbox, що я думаю, ви повинні подивитися.