27.05.2022 14:00
kot_review 0 1400 Источник

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

Хотите — верьте, хотите — нет, но это возможно! Это руководство покажет вам, как использовать Feathers.js для создания REST API за считаные минуты. Мы изучим Feathers.js, реализуем пример API, а также поделимся некоторыми мыслями и соображениями.

Давайте узнаем, как создать REST API Feathers.js для быстрого прототипирования приложения.

Что такое Feathers.js


Feathers — это лёгкий веб-фреймворк для разработки приложений реального времени (RTA) и REST API на JavaScript или TypeScript.

Feathers может взаимодействовать с любой backend и frontend технологией, такой как React, VueJS, Angular и React Native, а также поддерживает более десятка баз данных.

Feathers.js известен своей простотой использования и быстротой внедрения, а также обширной документацией. С Feathers всё, что вам нужно для добавления функции, — это выполнить простую команду.

Рекомендуемые требования


Этот материал представляет собой практическую демонстрацию. Прежде чем начать, я бы хотел, чтобы у вас было всё необходимое:

  • установлен Node.js,
  • установлен Arctype,
  • установлен Insomnia,
  • есть предварительные знания о Node.js и Express.js.

Что мы будем делать?


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

Приступим к делу


Для начала откройте интерфейс командной строки и создайте папку для нашего руководства с помощью приведённой ниже команды:

npm install @feathersjs/feathers --save
Установка Feathers

Дождитесь завершения установки и подтвердите её с использованием приведённой ниже команды:

feathers -V
Подтверждение установки

Если установка прошла успешно, вы увидите в консоли номер версии.

Создание приложения


С установленным на компьютере Feathers создайте для нашего приложения папку:

Mkdir RestWithFeathers && RestWithFeathers
Создание папок

Затем с помощью данной команды создайте новое API-приложение:
feathers generate app
Создаём приложение

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

Ожидаемый результат

На приведённом выше скриншоте мы выполнили следующие действия:

  • Выбрали Javascript в качестве предпочтительного языка программирования,
  • Указали название для приложения (movie-rental),
  • Выбрали src в качестве места для размещения шаблонов проекта,
  • Выбрали npm в качестве управляющего пакета,
  • Включили аутентификацию пользователей,
  • Выбрали Eslint для анализа нашего кода,
  • Выбрали стратегию аутентификации по имени пользователя и паролю,
  • Выбрали user в качестве имени для нашей сущности,
  • Выбрали Sequelize в качестве ORM для приложения,
  • Выбрали SQLite в качестве нашей базы данных,
  • Указали movieDB в качестве имени нашей базы данных.

Далее команда сгенерирует экспресс-подобную структуру проекта. Теперь давайте посмотрим на структуру папок, созданную в результате выполнения вышеуказанной команды.


Структура папки

В этом руководстве мы рассмотрим только следующие пункты:

  • config: содержит файлы конфигурации для приложения,
  • node_modules: папка для хранения списка установленных пакетов, необходимых для работы приложения,
  • ublic: содержит статические файлы, которые могут быть переданы клиенту,
  • src: содержит серверный код для приложений Feathers.js,
  • src/hooks: содержит пользовательские хуки приложения,
  • src/middleware: содержит промежуточные модули Express,
  • src/service: содержит наши службы приложения,
  • src/index.js: стартовый файл, запускающий приложение,
  • src/app.js: настраивает наше приложение Feathers,
  • src/app.hook.js: содержит хуки, которые применяются к каждой службе,
  • src/channels.js: устанавливает каналы событий Featherjs,
  • test: содержит тест для приложения.

Теперь запустим сервер в режиме разработки при помощи команды ниже:

npm run dev
Запуск сервера

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

Создание служб


Служба — это объект или экземпляр класса, который реализует определённые методы. Службы обеспечивают согласованный, независимый от протокола интерфейс для взаимодействия с любыми данными. В Feathers достаточно выполнить команду, и всё будет готово для создания службы. Создайте службу фильма (movie service) с помощью приведённой ниже команды:

feathers generate service
Создание службы

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


Результат выполнения команды generate service

Здесь мы выбрали ORM для таблицы фильмов, имя службы, URL маршрута и включили аутентификацию на маршрутах фильмов. После того как эти параметры будут выбраны, команда создаст структуру папок в src/service.

????movie
┣ ????movie.class.js
┣ ????movie.hooks.js
┗ ????movie.service.js

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

before: {
   all: [],
   find: [ authenticate('jwt') ],
   get: [ authenticate('jwt') ],
   create: [ hashPassword('password') ],
   update: [ hashPassword('password'),  authenticate('jwt') ],
   patch: [ hashPassword('password'),  authenticate('jwt') ],
   remove: [ authenticate('jwt') ]
 },
Добавленный фрагмент

Затем создайте службу проката (rental service) с помощью команды, приведённой ниже:

feathers generate service
Создание службы проката

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

???? rentals
┣ ????rentals.class.js
┣ ????rentals.hooks.js
┗ ????rentals.service.js

Она также вызовет функцию jwt authenticate('jwt') во всех маршрутах. Кроме того, команда создаст соответствующие модели (models) для только что созданных служб с некоторыми шаблонами:

????models
┣ ????movie.model.js
┣ ????rentals.model.js
┗ ????users.model.js

Создание таблиц базы данных


Создав службы и модели, измените свойства моделей на необходимые. Для модели фильма добавьте следующие свойства.

title: {
    type: DataTypes.STRING,
    allowNull: false,
},
producer: {
    type: DataTypes.STRING,
    allowNull: false,
},
imageURL: {
    type: DataTypes.STRING,
    allowNull: false,
},
createdAt: { type: DataTypes.DATE, defaultValue: Date.now },
     updatedAt: { type: DataTypes.DATE, defaultValue: Date.now },
Добавление свойств к модели фильма

Затем, в модели проката добавьте следующие свойства.

quantity: {
       type: DataTypes.INTEGER,
       allowNull: false,
     },
     createdAt: { type: DataTypes.DATE, defaultValue: Date.now },
     updatedAt: { type: DataTypes.DATE, defaultValue: Date.now },
Обновление модели проката

Нам всё ещё нужно создать ассоциацию между пользователем, фильмом и моделью проката, что приводит нас к следующему разделу данного руководства.

Взаимосвязь данных


Зависимости в базе данных — это ассоциации, образующиеся между таблицами при получении данных с помощью операторов объединения. Отношения часто планируются с помощью ERD-диаграммы.

В нашем приложении есть пользователь, фильм и таблица проката. Фильм принадлежит прокату, а пользователь владеет прокатом. Самый простой подход к отслеживанию этих данных в каждой базе — установить между ними связь, сохранив идентификаторы таблиц в качестве внешнего ключа в таблицах, с которыми они связаны. Итак, давайте создадим связь между тремя таблицами. В файле models/user.models.js найдите комментарии:

// Define associations here
// See https://sequelize.org/master/manual/assocs.html
Комментарии для замены

И добавьте приведённый ниже фрагмент кода.

const { rentals } = models;
   users.hasMany(rentals);
Создание отношения «один-ко-многим»

Во фрагменте кода вы создали связь «один-ко-многим» с таблицей проката (rentals table). Это означает, что у одного пользователя может быть много прокатных записей.

Затем мы также добавим приведённый ниже код в файл models/movie.model.js.

const { rentals, movie } = models;
   movie.belongsToMany(rentals, { through: 'MovieRendtals' });
Файл модели фильма

В приведённом выше фрагменте кода мы создали связь «многие-ко-многим» между таблицами прокатов, что означает, что у фильма может быть несколько прокатов. В отношениях «многие-ко-многим» создаётся таблица пересечения для отслеживания идентификаторов двух таблиц, в данном случае MovieRentals.

Наконец, добавьте приведённый ниже фрагмент кода в файл models/rentals.model.js.

const { users, movie } = models;
   rentals.belongsTo(users);
   rentals.belongsToMany(movie, { through: 'MovieRentals' });
Арендная модель

На этом этапе таблицы теперь имеют связь друг с другом. Теперь вы можете загружать данные в таблицы при создании или получении данных из любой службы. Это подводит нас к разделу, посвящённому хукам в Feathers.

Добавление настраиваемых хуков


Хуки — это подключаемые функции промежуточного ПО, которые могут быть зарегистрированы до, после или при ошибках метода службы. Вы можете зарегистрировать одну функцию хука или создать цепочку из них для создания сложных рабочих процессов. Вы создадите хук, который будет загружать данные, связанные с каждой таблицей. В папке service/rentals создайте файл get-related.js и приведённый ниже фрагмент:

module.exports = function (options = {}) {
    return async (context) => {
        const sequelize = context.app.get('sequelizeClient');
        const { users, movie } = sequelize.models;
        context.params.sequelize = {
        include: [{ model: users }, { model: movie }],
        raw: false,
    };
    return context;
    };
};
Файл get-related

В приведённом выше коде этот фрагмент указывает Feathers загружать модели пользователей и фильмов всякий раз, когда фильм берётся напрокат. Теперь обновите файл service/rentals/rental.hooks.js с помощью фрагмента кода, приведённого ниже. Измените код внутри объекта before.

all: [authenticate('jwt')],
find: [getRelated()],
get: [getRelated()],
create: [getRelated()],
update: [],
patch: [],
remove: []
Обновление файла rentals.hooks.js

Тестируем приложение


Теперь давайте протестируем приложение с помощью Insomnia. Начнём с маршрутов пользователей (users).

Создаём пользователя


Создайте пользователя на маршруте /users.


Аутентифицируем пользователя


Аутентифицируйте пользователя по маршруту /authentication.


Создаём фильм


Создайте фильм по маршруту /movie.


Берём фильм напрокат


Возьмите фильм напрокат по маршруту /rentals. В этом маршруте следует задать значения userId, movieId и количество (quantity).



Всё выглядит хорошо! Теперь проведите тестирование других методов запросов на каждом маршруте, таких как GET, UPDATE и DELETE.

Подключение к Arctype


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

  1. Запустите Arctype.
  2. Перейдите на вкладку SQLite.
  3. Нажмите на кнопку «Выбрать файл SQLite» (Choose SQLite File).
  4. Перейдите в папку проекта и выберите файл moviedb.sqlite.
  5. Протестируйте соединение и сохраните изменения.


После подключения вашей базы данных к Arctype вы увидите таблицы users, movies, rentals и MovieRentals, как показано на скриншоте ниже:

Таблицы перечислены в правой колонке

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

Заключение


На протяжении всего этого руководства вы изучали Feathers.js, создавая демонстрационное приложение. Вы узнали, как настроить приложение, создать службу, реализовать аутентификацию/авторизацию, создать пользовательские хуки и подключиться к Arctype.

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

НЛО прилетело и оставило здесь промокод для читателей нашего блога:

— 15% на все тарифы VDS (кроме тарифа Прогрев) — HABRFIRSTVDS.

Комментарии (0)