Простой офлайн сайт

Простой офлайн сайт

От автора: не так давно Nicolas Bevacqua написал замечательную статью о создании простого офлайн сайта, работающего на ServiceWorker. Суть была такая. Nicolas сделал всю работу, но идея сделать сайт автономным была моей (и я разработал простенький маленький сайт). Я не хотел, чтобы сайт был таким же сложным, как крупные веб-приложения с кучей ресурсов и API, но он и не должен был быть простой HTML-страницей.

Статья полностью актуальна и она подходит для изучения офлайн возможностей сайта. Пара замечаний:

Я обновил репозиторий, чтобы проверить, что все работает корректно. Пример не совсем пустой, но в то же время простой. На сайте есть небольшой билд-скрипт, который можно назвать примером современной веб-разработки: Sass, конкатенация файлов, минификация, sourcemaps, система SVG-иконок и… все перемешать, чтобы выпустить офлайн продакшн версию.

Я переместил демо на CodePen Project. Здесь легче смотреть код и сам сайт одновременно, легче вносить правки и экспериментировать.

Также я закинул сайт на simpleoffline.website, который использует возможность CodePen Projects по использованию кастомных доменов.

Современные тенденции и подходы в веб-разработке

Узнайте алгоритм быстрого профессионального роста с нуля в сайтостроении

Узнать подробнее

Простой офлайн сайт

Редакция: Chris Coyier

Источник: https://css-tricks.com/

Редакция: Команда webformyself.

Самые свежие новости IT и веб-разработки на нашем Telegram-канале

Практика HTML5 и CSS3 с нуля до результата!

Получите бесплатный пошаговый видеокурс по основам адаптивной верстки с полного нуля на HTML5 и CSS3

Получить

Метки:

Похожие статьи:

Комментарии Вконтакте:

Комментарии Facebook:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Я не робот.

Spam Protection by WP-SpamFree