Это пример того, как настроить базовый проект на JavaScript с использованием модулей prisma
и graphql-cli
. Вам потребуется базовое понимание JavaScript и GraphQL. Я расскажу о настройке базового проекта, объясню, как использовать 2 уровня API, покажу, как устанавливать отношения, и расскажу о запросах API на игровой площадке GraphQL.
Для удобства и скорости доступно несколько шаблонов, и мы будем использовать их для создания проекта. Подчеркну, все дело в скорости, и это поможет вам не изобретать велосипед 🎡.
Что такое Призма?
Некоторую информацию можно найти здесь, которая будет охватывать всю основную информацию о Prisma (почему и что). Первое, что вы должны понять, это то, что слой Prisma действует как ORM (то есть как Sequelize), вы не взаимодействуете напрямую с базой данных с помощью SQL-запросов. Все типы, входные данные, мутации и запросы в слое Prisma автоматически генерируются из Prisma datamodel
, которые вы определяете, и требуются для создания / изменения данных в базе данных.
GraphQL API является общедоступным и обслуживает данные.
Надеюсь, все станет ясно, когда вы будете читать дальше.
Настраивать
Поэтому убедитесь, что у вас установлены node
и graphql-cli
. Вы можете скачать node
здесь. А затем выполните следующую команду.
npm i -g graphql-cli
Есть несколько вариантов шаблонов, одним из которых является базовый скелет проекта Prisma (есть также вариант аутентификации, о котором я мог бы рассказать в другом посте 😄). Выполните следующие команды в любой папке, в которой вы хотите разместить проект:
mkdir graphql-example && cd graphql-example
graphql create project-one
Это покажет следующее:
Итак, скелетный проект, который нам понадобится, - node-basic
. Вы увидите это:
Так что перейдите в выбранную IDE и откройте папку проекта. Файловая структура будет выглядеть так:
Там будет код, относящийся к сообщениям / черновикам в проекте, который был создан с самого начала. Этот проект состоит из трех важных частей:
- Папка Prisma
- Созданная папка
src/index.js
иschema.graphql
в папкеsrc
Папка Prisma содержит файл datamodel.prisma
, в котором вы определите все типы, которые будут определять, как данные и отношения будут выглядеть в базе данных. Типы в этом файле будут выглядеть как типы в файле схемы GraphQL (все типы за вычетом запросов, мутаций или подписок).
Папка generated
говорит сама за себя 😛. Главное помнить, что вы не изменяйте этот сгенерированный код. Посмотри! Он содержит множество вариантов запросов и мутаций, которые вам понадобятся для получения и изменения данных.
_16 _ / _ 17_ в папке src
- это место, где вы определяете общедоступную часть API. schema.graphql
похож на стандартную схему GraphQL, определяющую все типы, а index.js
в папке src
- это место, где вы запускаете сервер и определяете преобразователи.
src/index.js
Кроме того, вы определите здесь все преобразователи для каждого запроса, мутации и подписки, которые вы определяете в файле schema.graphql
. Выше показан весь автоматически сгенерированный код.
Уберись и приготовь
Итак, что мы собираемся сделать, это удалить все это. Сделайте так, чтобы src/index.js
выглядел так:
Затем удалите весь код из файла datamodel.prisma
, а также файла schema.graphql
.
Затем мы хотим убедиться, что конечная точка в файле prisma.yml
является пустой строкой. Это гарантирует, что нам будет предложено настроить базу данных в облаке. Кроме того, удалите раздел seed
, а также раздел hooks
и удалите файл seed
:
Прежде чем мы продолжим, вам необходимо создать бесплатную учетную запись на www.Prisma.io. В корневом каталоге этого проекта запустите npm run prisma login
. Это подтвердит вашу подлинность с помощью Prisma. Вы должны увидеть это:
Далее… определение структуры данных.
Определите типы в файле datamodel.prisma
Добавьте эти три типа в файл datamodel.prisma
:
По сути, это стандартные типы, которые вы должны определить в файле schema.graphql
. Я использовал две директивы. Директива unique
не требует пояснений, а директива id
должна быть объявлена один раз для каждого определяемого вами типа (в противном случае при развертывании будет выдана ошибка).
Затем запустите эту команду: npm run prisma deploy
это сгенерирует весь код для слоя Prisma и создаст все таблицы на основе вашего datamodel.prisma
файла. Вы должны увидеть это:
Выберите параметр Demo server + MySQL database
, а затем выберите регион с наименьшей задержкой, нажмите ввод для имени и этапа; тогда вы должны увидеть это:
Теперь посмотрите на папку generated
и весь код, относящийся к типам, которые вы определили в datamodel.prisma
. Перейдите в свой проект на консоли Prisma, и вы должны увидеть таблицу, созданную на основе запроса, как показано ниже:
Public Facing API
Схема GraphQL
Мы определим типы, которые мы хотим сделать общедоступными, а также запросы и мутации:
Об этом коде следует помнить несколько ключевых моментов. Во-первых, !
означает, что это обязательно. Во-вторых, если вам нужно belongsToMany
Отношение, вы помещаете тип внутри [ ]
, т.е. для типа Chat
это: [User]
означает, что Chat
принадлежит многим User
.
Резольверы
Теперь нам нужен способ взаимодействия со слоем Prisma в нашем API. Ниже приведены резолверы, которые я использовал в файле index.js
в папке src
:
Здесь есть несколько моментов, на которые следует обратить внимание. У каждого резольвера, приведенного выше, есть 3 аргумента: родительский, аргументы и контекст. Двумя ключевыми аргументами здесь являются объект (args) и контекст. Аргументы, определенные в запросах и изменениях в файле schema.graphql
, передаются и поступают в этот объект args в преобразователе. Контекст можно установить, когда вы определяете новый сервер GraphQL (сервер определяется, как указано выше).
В этом проекте контекст содержит объект prisma
, который дает нам доступ ко всем запросам и изменениям, определенным в файле generated/prisma-client/prisma-schema.js
, что, в свою очередь, позволяет нам запрашивать базу данных.
Итак, давайте посмотрим, как создать преобразователь, например addMessage
. Итак, основная предпосылка состоит в том, что мы хотим создать сообщение и обновить чат этим сообщением. Итак, ищите createMessage
в файле prisma-schema.js
:
Затем найдите MessageCreateInput
:
Затем найдите и ChatCreateOneWithoutMessagesInputand
, и UserCreateOneWithoutMessagesInput
:
И теперь мы видим подключение, бинго! 👈. Это создаст взаимосвязь между различными типами, которые мы определили в файлах datamodel.prisma
и schema.graphql
. Наконец, найдите ChatWhereUniqueInput
и UserWhereUniqueInput
:
Что это значит? Что ж, когда мы делаем context.prisma.createMessage
, мы можем создать объект для передачи этой функции. Это будет похоже на содержимое addMessage
resolver выше.
Вы, возможно, уже сталкивались с одной проблемой: вы не можете получить доступ к вложенным данным при отправке запросов или мутаций на игровой площадке GraphQL. В этой статье будут выделены некоторые общие шаблоны, позволяющие обойти это и получить вложенные данные на игровой площадке GraphQL.
Последнее, что нужно сделать, - это поиграться на игровой площадке и опробовать некоторые запросы и мутации. Ниже приведены запросы, которые я использовал:
Так что используйте userId
, полученный в результате мутации registerUser
, и выполните запросы и мутации сверху вниз.
Вот и все. Следующим шагом будет создание подписок, чтобы сделать это приложение чата в реальном времени. Я расскажу об этом в другом уроке.
Если у вас есть какие-либо вопросы, не стесняйтесь обращаться ко мне, и я постараюсь помочь.