Найти в Дзене
Chris Roylance

CMS на Bun.js. Инициализация проекта.

В этом цикле статей мы произведём разработку CMS на основе Bun.js. Bun.js – это интерпретатор языка JavaScript для серверного рендеринга, подобный Node.js. Bun.js имеет полную совместимость с Node.js, но при этом обладает большей производительностью.

Метрики производительности и способы установки вы можете посмотреть по ссылке https://bun.sh/

Любая CMS — это набор страниц , которые можно объединить по категориям. В нашей CMS будет несколько шаблонов маршрутов, в пределах которых и будут существовать страницы:

/install/* – маршруты для установки CMS. Данные маршруты будут работать только в том случае, если CMS не была первоначально проинициализирована.

/admin-panel/* – маршруты для управления CMS, редактором статей, просмотром пользователей и т.д. Данный маршрут будет динамическим, т.. е. у маршрута будет стандартное значение , как в примере, но его можно будет поменять в настройках для безопасности системы

/auth/* – в данном маршруте нас встретят страницы , отвечающие за авторизацию, регистрацию, восстановление пароля, второй фактор и т.д.

/user/* – личный кабинет пользователя. Личный кабинет пользователя служит для сбора статистики по комментариям, просмотра статистики по написанным им статьям. Возможность написания статей (если такой функционал будет включен).

/error/* – Страницы с ошибками 404 и подобными. Текст можно будет редактировать в admin-panel. /tag/* – Маршрут для просмотра тегов или страниц, связанных с тегом

/author/* – Маршрут для просмотра всех статей определенного автора

/pages/* – маршрут самих страниц. /*/ – маршрут самой страницы. Для страниц тоже сделаем возможность смены части маршрута.

/api/* – маршрут для работы с системой по API. Данный список маршрутов не является последним, со временем список будет расширяться.

Приступим к разработке с инициализации bun проекта. Инициализация проекта выполняется командой:

bun init

После выполнения команды bun спросит, что именно мы хотим инициализировать. В нашем случае мы выбираем Blank, как показано на скриншотах ниже:

После выполнения инициализации у нас появится следующая структура.

-2

И сразу же сделаем ряд незначительных изменений, произведём переименование index.ts в cms.ts и в package.json изменим module и добавим ещё одну директиву version со значением 0.0.0, как представлено на скриншоте ниже.

-3

Установка пакетов производится также через bun. Произведём установку веб-сервера Express.js:

bun add express @types/express.

После установки попробуем создать простой сервер, который бы отвечал по адресу / текстом «Сервер запущен». Создание сервера будет производиться в файле cms.ts. Пример сервера представлен на скриншоте ниже.

-4

Давайте разберем по порядку.

В 1 и 2 строчках кода мы импортируем пакет express.js и необходимые нам типы (Express, Request, Response). В 4 строке мы производим инициализацию переменной app с типом данных Express, а также производим инициализацию пакета express.js.

В 6 строке мы создаем обработчик для маршрута/ в формате GET-запроса, после чего создаем контроллер, который будет обрабатывать маршрут. Контроллер в данном случае является стрелочной функцией. На вход такая функция (как и любая функция, которая отвечает как контроллер) имеет две переменные на входе: req с типом данных Request и res с типом данных Response.

В 7 строке мы отвечаем браузеру текстом «Сервер запущен».

В 10 строке мы вызываем функцию listen, которая произведет создание сервера на порту 8000 с последующим вызовом callback-функции, которая в данном случае является стрелочной.

В 11 строке мы производим оповещение о том, что сервер запущен на порту 8000.

Запустить приложение можно , использовав команду:

bun cms.ts

Но для удобства автоматического перезапуска мы будем использовать дополнительный ключ watch, таким образом запуск сервера будет выглядеть следующим образом: