Загрузчик страниц
На базовом уровне научитесь работать с асинхронным кодом в JavaScript, писать тесты на Mock / Stub, работать с ошибками и исключениями, DOM, promises, async / await, работать с HTTP.
Цель
Третий проект в значительной степени ориентирован на глубокую проработку принципов написания асинхронного кода. Асинхронный код – сложная тема, которая требует "перестроения" мозга для понимания происходящих процессов в коде: порядок выполнения, параллельное исполнение, обработка ошибок и многое другое. Вместе с тем, именно в JavaScript асинхронный код используется повсеместно как во фронтенде так и в бекенде. Работа с файловой системой, AJAX, вебсокеты, таймеры, взаимодействие с базой данных – все это примеры мест, где асинхронность используется на полную катушку.
Практически все современные библиотеки для этих задач построены на базе промисов. Именно эффективная работа с промисами (и как продолжение async/await) лежит в основе качественного асинхронного кода. В этом проекте промисы отрабатываются как для файловых операций, так и для выполнения HTTP-запросов с помощью библиотеки axios
Асинхронный код значительно влияет не только на порядок выполнения кода, но и на работу с ошибками. Правильно контролировать ход выполнения асинхронных операций и реагировать на возникающие в процессе ошибки придется учиться заново. Стандартные подходы с try/catch тут не работают. Также в асинхронном коде становится важно использовать логгирование для отслеживания процесса выполнения кода.
Все это влияет не только на сам код, но и на тесты для него. Тесты асинхронного кода предсказуемо устроены хитрее. Здесь включаются и возможности самого тестового фреймворка и определенный способ организации кода, который делает его тестируемым. Помимо этого, в тестах проекта отрабатывается манки-патчинг HTTP-запросов с помощью популярной библиотеки nock.
Кроме асинхронности, в этом проекте идет активная работа с HTML. Для замены ссылок внутри страницы, нужно выполнить парсинг страницы в DOM. Из него с помощью языка запросов (селекторов) потребуется извлечь все ресурсы для скачивания и заменить их локальными ссылками. Эта задача выполняется с помощью библиотеки cheerio, которая работает аналогично jQuery (в плане селекторов).
И, конечно же, архитектура. Создание хороших абстракций и правильная организация процесса загрузки – ключевая задача при создании загрузчика страниц. В этом проекте много цепочек, много преобразований, много операций ввода/вывода. Для создания хорошей архитектуры, понадобится вспомнить все чему учил Хекслет не только в курсах, но и в дополнительных статьях, например, из серии "совершенный код".
Описание
PageLoader – утилита командной строки, которая скачивает страницы из интернета и сохраняет их на компьютере. Вместе со страницей она скачивает все ресурсы (картинки, стили и js) давая возможность открывать страницу без интернета.
По такому же принципу устроено сохранение страниц в браузере (вы знали что они так умеют?).
Пример использования:
page-loader --output /var/tmp https://ru.hexlet.io/courses
✔ https://ru.hexlet.io/lessons.rss
✔ https://ru.hexlet.io/assets/application.css
✔ https://ru.hexlet.io/assets/favicon.ico
✔ https://ru.hexlet.io/assets/favicon-196x196.png
✔ https://ru.hexlet.io/assets/favicon-96x96.png
✔ https://ru.hexlet.io/assets/favicon-32x32.png
✔ https://ru.hexlet.io/assets/favicon-16x16.png
✔ https://ru.hexlet.io/assets/favicon-128.png
Page was downloaded as 'ru-hexlet-io-courses.html'
Утилита скачивает ресурсы параллельно и показывает прогресс по каждому ресурсу в терминале
Наставники



Проекты входят в стоимость обучения на любом плане: самостоятельном, групповом и индивидуальном. Дополнительно платить не нужно.
Проекты дают опыт разработки в реальной среде. Проходите каждый проект сразу после изучения курсов, которые стоят в учебном плане перед ним, — это отличный способ глубже разобраться в материале.
Проекты — портфолио программиста. Их код останется в вашем аккаунте на GitHub и будет преимуществом при поиске работы.
Чтобы узнать о том, что такое проекты и в чём их польза, прочитайте нашу статью «Анатомия проектов Хекслета».
Задавайте вопросы в разделе «Обсуждение» на странице шага, на котором возникли трудности, или вашему наставнику. Изучите вопросы других студентов в «Обсуждениях»: там собрана большая база знаний, ей можно и нужно пользоваться.
Автоматизированные тесты и линтер. В групповом и индивидуальном форматах наставник дополнительно проверит то, что тестами проверить невозможно (архитектуру проекта, правильность именования, удачность решений), и проведёт код-ревью, чтобы сделать проект ещё качественнее.
Нажмите на виджет в правом нижнем углу экрана и поищите ответ в нашей справке. Или сразу пишите на support@hexlet.io — вам ответит живой человек из команды Хекслета.