Проект #3

Загрузчик страниц

Node.js-разработчик

На базовом уровне научитесь работать с асинхронным кодом в JavaScript, писать тесты на Mock / Stub, работать с ошибками и исключениями, DOM, promises, async / await, работать с HTTP.

2-4
недели

Цель

Третий проект в значительной степени ориентирован на глубокую проработку принципов написания асинхронного кода. Асинхронный код – сложная тема, которая требует "перестроения" мозга для понимания происходящих процессов в коде: порядок выполнения, параллельное исполнение, обработка ошибок и многое другое. Вместе с тем, именно в 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'

Утилита скачивает ресурсы параллельно и показывает прогресс по каждому ресурсу в терминале

Наставники

Аватар наставника Dinislam Abdulsalamov
Dinislam Abdulsalamov
Аватар наставника Айдар Шайхутдинов
Айдар Шайхутдинов
Аватар наставника Александр Быков
Александр Быков
Аватар наставника Александр Фуфаев
Александр Фуфаев
Сколько стоят проекты?

Проекты входят в стоимость обучения в любом формате: самостоятельном, групповом и индивидуальном. Дополнительно платить не нужно.

Зачем проходить проекты?

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

Проекты — портфолио программиста. Их код останется в вашем аккаунте на GitHub и будет преимуществом при поиске работы.

Чтобы узнать о том, что такое проекты и в чём их польза, прочитайте нашу статью «Анатомия проектов Хекслета».

Что делать, если возникли трудности во время выполнения проекта?

Задавайте вопросы в разделе «Обсуждение» на странице шага, на котором возникли трудности, или вашему наставнику. Изучите вопросы других студентов в «Обсуждениях»: там собрана большая база знаний, ей можно и нужно пользоваться. Попросите о помощи в нашем Slack-чате в канале #hexlet-projects.

Кто проверяет проекты?

Автоматизированные тесты и линтер. В групповом и индивидуальном форматах наставник дополнительно проверит то, что тестами проверить невозможно (архитектуру проекта, правильность именования, удачность решений), и проведёт код-ревью, чтобы сделать проект ещё качественнее.

У меня другой вопрос

Нажмите на виджет в правом нижнем углу экрана и поищите ответ в нашей справке. Или сразу пишите на support@hexlet.io — вам ответит живой человек из команды Хекслета.