Play Button Pause Button

Configure real time updates in your Vue app with Subscriptions

vladimirnovick profile image Vladimir Novick ・1 min read

Vue and GraphQL with Hasura (14 Part Series)

1) Vue and GraphQL with Hasura video course 2) What is GraphQL 3 ... 12 3) Creating auto generated CRUD API with Hasura engine 4) Extending CRUD API with Remote Schemas and Event Triggers 5) Securing Hasura GraphQL Endpoint with Admin Secret key 6) Running Hasura engine locally on existing database 7) Setting up Vue app with Apollo client and querying GraphQL endpoint for data 8) Different gotchas when executing GraphQL queries 9) Use ApolloQuery component inside your template 10) Different ways of using GraphQL mutations in our Vue app for inserting posts 11) Delete posts conditionally using delete_posts mutation 12) Configure real time updates in your Vue app with Subscriptions 13) Using subscribeToMore when defining a query to get partial updates 14) Move subscribeToMore to be more declarative by moving it to the template

In this lesson we will finally add real time capabilities to our app by adding GraphQL Subscriptions that were also auto-generated for you by Hasura engine. We will reconfigure our Apollo client from using simple solution as apollo-boost to more complex setup for subscriptions. We will learn how to use $subscribe in our apollo provider and will see how data is updated in real time.


Hasura GraphQL Engine is an opensource service that gives you instant realtime GraphQL APIs on Postgres with fine grained access control.


markdown guide