In this repository you will find an example of how to set up a PostgresDB in a docker container for your local development based only on pure PSQL, as well as how to generate types, resolver-interfaces and custom useQuery hooks automatically for the usage of Typescript and GraphQL as querying technology.
- Setting up a postgres instance in a docker container based on PSQL
- Set up a hasura instance in a docker container and connect it to the postgres instance
- Use the automatically generated GraphQL schema from hasura and extend it with an own schema
- Generate typescript type definitions and type-safe resolver interfaces using the generated schema of hasura
- Generate custom useQuery hooks for react components by writing native GraphQL files
If you have ever faced the problem of not having a standard solution to set up a local database of the same data for several developers in a team, you may have come across the solution to run a postgres instance inside a docker container. To use them with GraphQL you need to create a GraphQL schema and the respective types. For the benefit of using Typescript, this step of creating types must be repeated, which is potentially a risk for errors.
This repo contains a NextJS application for which all dependecies have to be installed by:
npm installTo start the postgres database and the hasura engine instances run:
docker-compose up -dTo start the application run
npm run devThe application can now be accessed in the browser at localhost:3000.
The hasura console can be accessed at http://localhost:8081/console and the generated schema can be tested at http://localhost:8081/console/api-explorer.
Unter http:localhost:3000/api/graphql kann die endgültige GraphQL api getestet werden.
After adding new queries under src/graphql/queries or changing the SQLs, the command
npm run graphql-codegencan be used to update the GraphQL code again and create the new useQuery hooks.
Attention! To generate, the Graphql schema is used under localhost:3000/api/graphql, so the application must run locally