Vue example using GraphQL with AWS AppSync
Task Manager Application built using Vue, AWS AppSync, and Vue Apollo
This application goes along with the medium blog Full Stack Vue with GraphQL & AWS AppSync
git clone https://github.com/dabit3/vue-graphql-appsync.git
cd vue-graphql-appsync
yarn || npm install
Video walkthrough (replace Todo with Task, and fetchTodos with fetchTasks), or go to AWS AppSync if you already are familiar with how to create the correct schema.
input CreateTaskInput {
id: ID!
name: String!
completed: Boolean!
}
input DeleteTaskInput {
id: ID!
}
type Mutation {
createTask(input: CreateTaskInput!): Task
updateTask(input: UpdateTaskInput!): Task
deleteTask(input: DeleteTaskInput!): Task
}
type Query {
getTask(id: ID!): Task
listTasks(first: Int, after: String): TaskConnection
}
type Subscription {
onCreateTask(id: ID, name: String, completed: Boolean): Task
@aws_subscribe(mutations: ["createTask"])
onUpdateTask(id: ID, name: String, completed: Boolean): Task
@aws_subscribe(mutations: ["updateTask"])
onDeleteTask(id: ID, name: String, completed: Boolean): Task
@aws_subscribe(mutations: ["deleteTask"])
}
type Task {
id: ID!
name: String!
completed: Boolean!
}
type TaskConnection {
items: [Task]
nextToken: String
}
input UpdateTaskInput {
id: ID!
name: String
completed: Boolean
}
schema {
query: Query
mutation: Mutation
subscription: Subscription
}
src/AppSync.js