Создание приложения graphql от нуля до героя с использованием node JS и vue.js, часть 2

Ссылка на первую часть учебника

Если вы здесь, я предполагаю, что вы следуете руководству из предыдущей части. Мы продолжим создавать наше приложение с полным стеком, интегрируя реальный источник данных в наше приложение, которое мы будем использовать mongoDB в качестве базы данных и mongoose для создания нашей схемы для mongoDB. MongoDB - это база данных без схемы или NoSQL, поэтому мы используем mongoose для создания схемы для проверки данных, поступающих в нашу базу данных. Для начала мы должны создать папку в нашем исходном каталоге с именем models и добавьте файл с именем post.js.

const mongoose = require('mongoose')
const postSchema = new mongoose.Schema({
title: {
type: String,
required: true,
minlength: 10
},
content: {
type: String,
required: true
},
createdAt: {
type: Date,
default: Date.now
}
})
// using the schema to make a collection in our DB
const Post = mongoose.model('Post', postSchema)
module.exports = Post

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

const Post = require('./post')
let DB = {}
DB.Post = Post
module.exports = DB

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

const express = require('express')
const cors = require('cors')
const morgan = require('morgan')
const bodyParser = require('body-parser')
const {
graphiqlExpress,
graphqlExpress} = require('apollo-server-express')
const mongoose = require('mongoose')
const port = 10101
const app = express()
// app modules
const schema = require('./graphql')
const DB = require('./models')
// setting up middleware for the app
app.use(cors())
app.use(morgan('dev'))
// setting up graphql
app.use('/graphql', bodyParser.json(), graphqlExpress({
schema,
context: {
DB
}
}))
// setting up a graphiql a ui for testing our query
app.use('/graphiql', graphiqlExpress({
endpointURL: '/graphql'
}))
// connecting to a mongodb database with name of db fullstack
mongoose.connect('mongodb://localhost:27107/fullstack', () => {
console.log('connected to database successfully')
})
// starting the server
app.listen(port, () => {
console.log(`starting grapql serevr on localhost:${port}`)
})

Мы обновили файл server.js, подключившись к реальной базе данных с помощью mongoose, а затем потребуем, чтобы база данных, которую мы использовали для добавления контекста в наш graphql в другом, чтобы иметь возможность доступа к данным из параметра контекста в нашем Resolver. Чтобы иметь возможность запрашивать данные с помощью graphiql, нам необходимо определить типы данных и запрос модели в вашем файле typeDefs.js.

module.exports = `
type Post {
id: ID!
title: String!
content: String!
createdAt: String!
}
type Query {
allPost: [Post]!
postById(id: ID!): Post!
}
type Mutation {
createPost(title: String!, content: String!): Post
}
`

Мы обновили нашу схему typeDef и добавили мутацию под названием createPost, которая используется для изменения состояния ваших данных. Мутация createPost будет использоваться для создания нового сообщения. Прежде чем мы сможем обновить или запросить данные в нашей базе данных, давайте обновим файл resolvers.js, чтобы он соответствовал нашей текущей схеме в typeDef.js.

module.exports = {
Query: {
async allPost (root, args, {DB}) {
    const posts = await DB.Post.find()
   return posts
},
async postById (root, args, {DB}) {
    const {id} = args
    const post = await DB.Post.findById({_id: id})
    if (!post) {
      throw new Error('post not found ')
     }
    return post
}
},
Mutation: {
    createPost (root, args, {DB}) {
    const post = args
    const newPost = new DB.Post(post)
    return newPost.save()
}
}
}

Я считаю, что все настроено хорошо, теперь, когда мы подключились к нашей базе данных и установили наш запрос и мутацию, давайте начнем тестировать API с помощью graphiql на localhost: 10101 / graphiql

Это сработало, мы только что создали пост с нашей мутацией. Давайте запросим все сообщения.

Все наши тесты работают нормально. В следующей главе руководства мы рассмотрим подключение к нашему клиенту с помощью vue.js.

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