Роутер
JS: Алгоритмы и структуры данных (Деревья)
Погрузитесь в написание древовидной библиотеки. Повысьте свои навыки работы с деревьями. Пройдите путь в улучшении скорости работы алгоритма.
Цель
Роутер – проект, направленный на прокачку работы с древовидными структурами. Проект продолжает тему, поднятую в курсе по деревьям и раскрывает её на задаче, которую решают современные фреймворки. В ходе разработки понадобится создать абстракцию для удобного обхода дерева и накопление результата работы.
Архитектура
Роутер — один из самых используемых компонентов на любом сайте, ведь любое обращение на сайт происходит через него. Поэтому, от производительности роутера зависит, в том числе как быстро будет работать сайт. Например, на нагруженные сайты поступают тысячи запросов в секунду, следовательно, на роутинг тратится какое-то время, а если маршрутов много – выбор занимает существенное время. По этой причине то как, он устроен и с какой скоростью работает, сильно влияет на работу сайта. Для эффективной работы роутеры реализуют специальным образом, используют специальные структуры данных. Один из таких способов в выражении внутренней структуры в виде префиксного дерева.
Описание
У каждой страницы любого сайта есть URL-адрес. Каждый раз когда, происходит обращение к сайту, движок на котором написан сайт анализирует URL-адрес и пытается найти функцию для генерации ответа. За этот процесс отвечает роутинг, который обычно реализован в виде отдельного компонента – роутера. Этот компонент является одним из ключевых частей сайта. Соответственно, он производит выбор функции в зависимости от URL-адреса.
Роутеры часто реализуются в виде отдельных библиотек, которые потом используется внутри сайта. Это хорошая практика, и здесь мы напишем такую библиотеку. После завершения наш роутер можно будет использовать на реальных сайтах.
Пример реальной библиотеки:
// https://adonisjs.com/docs/4.1/routing
// Определение маршрута /
// Вторым параметром передается обработчик
// Он просто возвращает строку Hello Hexlet
Route.get('/', () => 'Hello Hexlet');
// Определение маршрута /about
Route.get('/about', () => 'About Hexlet');
// Где-то запускаем сайт example.com
// и делаем запрос
curl example.com
Hello Hexlet
curl example.com/about
About Hexlet
Пример использование нашей библиотеки:
import makeRouter from '@hexlet/code';
const routes = [
{
path: '/hello', // маршрут
method: 'POST', // метод HTTP
handler: () => 'Hello!', // обработчик
},
{
path: '/hello/:name', // динамический маршрут
handler: ({ name }) => `Hello ${name}!`,
constraints: { name: /\w+/ }, // ограничения накладываемые на динамический маршрут
},
];
const router = makeRouter(routes); // инициализируем наши маршруты
// запрос из сети
// На самом деле, всё гораздо сложнее и в реальности сам HTTP запрос обрабатывает сервер на сайте
// Далее он сам прокидывает запрос в роутер
// Мы просто говорим, что запрос должен состоять из пути и метода
const request = { path: 'hello/Hexlet', method: 'GET' };
// вызываем наш роутер с запросом из "сети"
const result = router.serve(request); // { path: 'hello/Hexlet', method: 'GET', handler: [Function handler], params: { name: 'Hexlet' } }
// вызываем обработчик с параметрами, который вернул роутер
result.handler(result.params); // Hello Hexlet!
Проекты входят в стоимость обучения на любом плане: самостоятельном, групповом и индивидуальном. Дополнительно платить не нужно.
Проекты дают опыт разработки в реальной среде. Проходите каждый проект сразу после изучения курсов, которые стоят в учебном плане перед ним, — это отличный способ глубже разобраться в материале.
Проекты — портфолио программиста. Их код останется в вашем аккаунте на GitHub и будет преимуществом при поиске работы.
Чтобы узнать о том, что такое проекты и в чём их польза, прочитайте нашу статью «Анатомия проектов Хекслета».
Задавайте вопросы в разделе «Обсуждение» на странице шага, на котором возникли трудности, или вашему наставнику. Изучите вопросы других студентов в «Обсуждениях»: там собрана большая база знаний, ей можно и нужно пользоваться. Попросите о помощи в нашем Slack-чате в канале #hexlet-projects.
Автоматизированные тесты и линтер. В групповом и индивидуальном форматах наставник дополнительно проверит то, что тестами проверить невозможно (архитектуру проекта, правильность именования, удачность решений), и проведёт код-ревью, чтобы сделать проект ещё качественнее.
Нажмите на виджет в правом нижнем углу экрана и поищите ответ в нашей справке. Или сразу пишите на support@hexlet.io — вам ответит живой человек из команды Хекслета.