Git Product home page Git Product logo

graphql-workshop-2hrs's Introduction

graphql-workshop-2hrs

What we'll be building: https://learn-hasura-todo-app.netlify.com/

Prerequisites

  • Install docker (or use heroku)
  • Install the hasura CLI

1. Backend setup with Hasura

1.1 Run Hasura + Postgres

#Clone this repo
git clone https://github.com/hasura/graphql-workshop-2hrs

cd hasura-graphql-workshop/

docker-compose up -d

hasura console
#You might have to wait if you get an error on the command above, for hasura and postgres to start up

1.2 Data modelling

  • On the Hasura console, create a users table, todo table
  • Setup foreign keys and relationships

Users table:

name type nullable unique default primary
id Text no yes yes
name Text no no no
password Text no no no
created_at Timestamp no no now()
last_seen Timestamp no no

Todos table

https://learn.hasura.io/graphql/hasura/data-modelling/3-todos-table https://learn.hasura.io/graphql/hasura/relationships/1-create-foreign-key https://learn.hasura.io/graphql/hasura/relationships/2-create-relationship

Once you finish modelling, head to the migrations directory to see the actual files that have been created!

1.3 Try out the GraphQL API

  • Use Mutations to insert users & todos
  • Use Queries to try fetching combinations of users and todos

Exercises:

  1. Insert a user: https://learn.hasura.io/graphql/hasura/data-modelling/2-try-user-queries
  2. Insert todos: https://learn.hasura.io/graphql/hasura/data-modelling/4-try-todos-queries
  3. Query users, todos: https://learn.hasura.io/graphql/hasura/relationships/3-try-out-relationship-queries

1.4 Set up authorization to secure data access

  1. Setup todo table permissions: https://learn.hasura.io/graphql/hasura/authorization/1-todos-table-permissions
  2. Setup user table permissions: https://learn.hasura.io/graphql/hasura/authorization/2-users-table-permissions

1.5 Creating a custom GraphQL type with derived data (views)

  1. Setup a view to capture currently online users: https://learn.hasura.io/graphql/hasura/data-transformations

2. Integrating a GraphQL API into your app

https://learn.hasura.io/graphql/react/introduction

graphql-workshop-2hrs's People

Contributors

coco98 avatar

Stargazers

Dipak Saraf avatar

Watchers

 avatar James Cloos avatar Dipak Saraf avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.