Как создать REST API с помощью Express JS и Typescript. Часть II (Организация маршрутов)

В первой части этой серии я рассказал, как настроить проект Express JS REST API с помощью Typescript. К концу этой статьи мы создали маршрут home и смогли протестировать нашу конечную точку в браузере.

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

ТРЕБОВАНИЯ

Вам потребуется базовое понимание разработки REST API с использованием среды Express для Node JS.

Также будет легче следить, если вы прочитали первую часть этой статьи.

Шаг 1. Создайте папку маршрутов

Откройте папку в vs code и создайте новую папку для хранения наших файлов маршрутов. Мне нравится размещать эту папку в корне моего проекта, на том же уровне, что и файл index.ts. Мы назовем эту папку routes.

Шаг 2. Добавьте наш первый маршрут (home.ts)

Создайте новый файл машинописного текста в папке маршрутов. Этот файл будет содержать код нашего домашнего маршрута. Мы назовем этот файл home.ts.

Шаг 3. Добавьте код для домашнего маршрута

Мы добавим код для домашнего маршрута, как показано на скриншоте ниже.

Сравните код в файле маршрута home.ts (показан выше) с кодом, который мы написали ранее в index.ts (показан ниже) и вы увидим много сходства.

В строке 1 файла route.ts мы импортировали экспресс, как и в index.ts.

Однако в строке 2вместо вызова express()я вызываю express. Router() и присвойте его переменной, которую я называю router. В строке 5 файла home.ts вы также заметите, что вместо использования app.get(), я использую router.get().

В строке 9 файла home.ts мы выполняем по умолчаниюэкспорт маршрутизатора, который мы создали в строке 2 файла home.ts. Это сделает наш маршрутизатор видимым для импорта вне этого модуля (homet.ts).

Шаг 4. Импортируйте домашний маршрут в index.ts

Экспортируя маршрут в home.ts, мы можем импортировать его в другой модуль. Мы импортируем маршрут как home в строку 4 файла index.ts. Теперь мы можем удалить код, который у нас был для домашнего маршрута в index.ts, и заменить его кодом на снимке экрана в строке 6.

Шаг 4. Проверьте маршрут

Теперь мы готовы протестировать код. Как и в первой части этой статьи, запустим наш dev-скрипт в package.json, запустив следующий скрипт из терминала

npm run dev

Затем вы можете перейти по указанному ниже URL-адресу в своем браузере.

http://localhost:3000/

Вы должны увидеть текст на экране, похожий на тот, что у меня на скриншоте ниже.

Вы также должны увидеть новую папку routes, созданную в папке dist. Когда вы откроете эту папку, вы увидите новый файл home.js с кодом, подобным тому, что я привожу ниже.

Вы можете добавить дополнительные конечные точки к своим маршрутам или создать новые маршруты в папке routes.

Вы можете найти полный код в ветке add-routes этого репозитория github:

hthttps://github.com/divinedela/express-typescript-apis/tree/add-routes

Вы также можете найти первую часть этой статьи здесь:

https://medium.com/swlh/build-a-rest-api-with-express-js-and-typescript-dc2c8da89c52