Erudit — Учебники 21-го века 🤓

Целый год я разрабатывал универсальную платформу для современных открытых и удобных онлайн-учебников. Идеальную замену бумажным учебникам в эпоху интернета. И вот у меня наконец есть первый рабочий прототип! Хочу поделиться с вами деталями этого проекта!

Ровно год назад я написал свой первый полноценный учебник по математике:

Написание этого учебника выявило множество проблем и недостатков, которые имел самописный движок, на котором этот учебник размещен.

Чтобы полноценно писать образовательные материалы и дальше, нужно было устранить эти проблемы, написать новую основу, платформу для учебников. Я назвал эту платформу Erudit. Разработка этой платформы и заняла весь этот год.

Если кому-то хочется сразу пощупать новую платформу, то смело переходите по ссылке ниже. Обращаю внимание, что это "минимально рабочий прототип", база и основа, которая будет постепенно доделываться. Там много багов, но и посмотреть есть на что:

Ну а сейчас я расскажу про то, чего мне удалось за этот год добиться:

Движок Erudit устанавливается в виде программной зависимости (библиотеки, пакета) в проект. Проект задает не только содержимое, но и некоторые внешние элементы: название сайта, логотип, используемый языке и так далее. Имеется поддержка даже нестандартных блоков. Например, на сайте по информатике могут быть блоки с программным кодом, а на сайте по химии — красивые блоки химических реакций.

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

Сайт имеет адаптивный дизайн и хорошо выглядит на любом устройстве: большом мониторе, планшете или смартфоне. Основной контент расположен по центру, все остальные меню и прочие данные по бокам — чтобы не отвлекать от изучения материала.

Все элементы сайта полностью поддерживают светлый и темный режим: днем в светлой теме не будет пересветов от солнца, а вечером в темной теме глазам будет комфортно читать материал. Темная тема так же уменьшает расход заряда аккумулятора на планшетах и смартфонах.

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

Формируется эта навигация полностью автоматически прямо из файловой структуры проекта! 3 учебника — 3 папки. Надо поместить эти учебники в категорию? Просто создайте папку категории и поместите внутрь нее папки учебников!

Статьи в учебниках тоже могут быть немаленькими, можно и потеряться в тексте! И в панели слева отображается глобальная навигация по всему сайту, то в правой панели отображается оглавление открытой в данный момент статьи.

Более того, оглавление показывает все блоки, которые в данный момент отображаются на экране. А еще оглавление тоже можно настраивать! Хотите, чтобы там отображалось важное определение, теорема или формула? Не проблема, любой блок можно пометить, чтобы он показывался в оглавлении!

На обычных сайтах переход по ссылке либо открывает новое окно вместо текущего, либо открывает окно в новой вкладке. Оба варианта приводят к потере контекста. Возможно, вам всего лишь хочется посмотреть определение, а не переходить в статью, где оно вводится.

Для решения этой проблемы сайты на Erudit вместо открытия новых окон показывают снизу панель «Предпросмотр». В ней показывается, куда ведет ссылка: определение, теорема, раздел статьи и так далее:

Так же эта панель может сообщать о возможных проблемах на странице и других событиях. Вот несколько примеров того, какой вид она может принимать:

Теория хорошо изложена в одной книге, ключевые моменты и формулы тезисно описаны на каком-то сайте, а задачи на отработку вообще приходится брать из задачника. Знакомая ситуация, правда?

Сайты на движке Erudit объединяют все три ключевых компонента получения и всестороннего закрепления качественных знаний в одном месте! Каждая статья каждого учебника может быть разбита на три ключевых компонента: «Теорию», где максимально понятно и подробно объясняются понятия, «Конспект» — выжимка самого важного из теории, и «Задачи» — десятки задач на отработку полученных знаний!

Одна из больших проблем бумажных учебников — они медленно обновляются и имеют фиксированных авторов. Сайты на движке Erudit решают эту проблему на корню: каждая статья, учебник и категория может иметь неограниченное количество «авторов»: людей, которые предложили какой-то материал.

Такой подход мотивирует людей со стороны включаться в процесс и делиться своими идеями, находками и задачами, помогая создавать лучший образовательный материал по теме!

Весь исходный код Erudit и библиотек, которые он использует, полностью открытый! Всего 8 программных пакетов, которые размещены в 3-х репозиториях:

Репозиторий Erudit на GitHub. Движок состоит из 3-х модулей: cog — типы и схема, kit — полезные функции, cli — команды для работы с Erudit из терминала, и erudit — сам движок и оболочка сайта.

Репозиторий Bitran на GitHub. Bitran — текстовый процессор (примерно как TeX, но для браузеров). Он тоже состоит из 3-х модулей: core — типы и объектная DOM модель текста, transpiler — парсинг текста в объектную модель и преобразование объектной модели обратно в текст, renderer-vue — красивое отображение блоков на сайтах.

Репозиторий Erudit Bitran Elements на GitHub. Содержит основные элементы, которые будут использоваться в большинстве сайтов на движке Erudit: заголовки, перекрестные ссылки, математические формулы, определения и так далее. Готовый набор, чтобы не городить костыли для каждого сайта отдельно.

База и основа готова. Теперь можно наполнять ее дополнительным функционалом, переносить материалы из старой версии "Открытой математики" на новый движок, ну и писать новые статьи.

Впереди еще очень и очень много работы. Но самый сложный этап, этап написания основы, я завершил. Дальше будет проще! Буду держать вас в курсе новостей! 😉