Dragotchi

Миграция сайта в Progressive Web App (PWA)

Обзор Начинаем Современные теги в head Service Worker Пример push-уведомлений Кэш service-worker Императивный кэш 1. Обзор Прогрессивное веб приложение — это хорошо и прекрасно, но как мне использовать его для своего проекта? Давайте оснастим существующий десктопный сайт прекрасными новыми веб функциями, такими как установка, push-уведомления и…

pwa

Ваше первое прогрессивное веб-приложение (PWA)

Прогрессивные веб-приложения — это опыт, который объединяет лучшее от веб-сайтов и лучшее от приложений. Они полезны пользователям с самого первого открытия вкладки браузера, без необходимости установки. Поскольку пользователь постепенно наращивает взаимодействие с приложением, оно становится все более и более мощным. Приложение быстро загружается, даже в медленных сетях, отправляет релевантные push-уведомления, имеет иконку на домашнем экране и загружается в полноэкранном режиме

FullScreen API

Полноэкранный режим сайта с помощью FullScreen API

Демо Одним из преимуществ наличия новых версий браузера каждые шесть недель является быстрый темп внедрения новых функций. Переход от ночных сборок к официальным релизам проходит всего за несколько недель. Это означает, что даже те из вас, кто внимательно следит за появлением новых функций, могут легко пропустить парочку….

animate.css

Топ 9 анимационных библиотек для UI дизайнеров в 2017 году

Фронтенд веб-дизайн прошел революцию за последнее десятилетие. В 2007 году большинство из нас разрабатывали статические шаблоны сайтов — в 2017 году мы строим «digital машины» с тысячами динамических частей. Проще говоря, отличные UI дизайнеры должны быть отличными аниматорами — с хорошим пониманием техник веб-анимации. Ниже приведен последний вариант…

Webpack: основы. Как настроить проект с JavaScript и Sass

Важно разделять JavaScript и CSS-код на маленькие по объему части. Этим мы упрощаем себе и другим понимание и поддержку проекта. Браузеры, с другой стороны, предпочитают работать с маленьким количеством файлов, пускай длинными и слабо читаемыми. Здесь на помощь приходит Webpack. Webpack — инструмент веб-разработчика, который…