GraphQL is a powerful way to bridge the gap between frontend and backend. Providing a typed API with introspection. This can be used for code generation or code completion. Because of some misconceptions it can be hard to combine GraphQL with Kafka, but it doesn’t need to be hard. After handling misconceptions like 'Kafka is just a message bus' and 'GraphQL is only for Graph databases' I will have a few demo's how both can be combined. It can be a clear way to make your event sourcing backend available to the frontend. GraphQL can be used to quickly setup a typed API, if you already use ksqlDB.

1. www.openweb.nl
Kafka and GraphQL:
Misconceptions and
Connections
@GKlijs

2. www.openweb.nl
Contents
▰Intro to GraphQL
@GKlijs

3. www.openweb.nl
Contents
▰Intro to GraphQL
▰Misconceptions about GraphQL
@GKlijs

4. www.openweb.nl
Contents
▰Intro to GraphQL
▰Misconceptions about GraphQL
▰Intro to Kafka
@GKlijs

5. www.openweb.nl
Contents
▰Intro to GraphQL
▰Misconceptions about GraphQL
▰Intro to Kafka
▰Misconceptions about Kafka
@GKlijs

6. www.openweb.nl
Contents
▰Intro to GraphQL
▰Misconceptions about GraphQL
▰Intro to Kafka
▰Misconceptions about Kafka
▰Combining Kafka with GraphQL
@GKlijs

7. www.openweb.nl
Contents
▰Intro to GraphQL
▰Misconceptions about GraphQL
▰Intro to Kafka
▰Misconceptions about Kafka
▰Combining Kafka with GraphQL
▰2 example POC’s
@GKlijs

8. www.openweb.nl
Contents
▰Intro to GraphQL
▰Misconceptions about GraphQL
▰Intro to Kafka
▰Misconceptions about Kafka
▰Combining Kafka with GraphQL
▰2 example POC’s
▰Main Takeaway
@GKlijs

9. www.openweb.nl
Bit about me
▰More than 5 years Kafka experience
@GKlijs

10. www.openweb.nl
Bit about me
▰More than 5 years Kafka experience
▰Added GraphQL subscriptions for
micronaut-graphql
@GKlijs

11. www.openweb.nl
Bit about me
▰More than 5 years Kafka experience
▰Added GraphQL subscriptions for
micronaut-graphql
▰Used GraphQL in production
server and client (JVM)
@GKlijs

12. www.openweb.nl
Intro to GraphQL
@GKlijs

13. www.openweb.nl
Intro to GraphQL
@GKlijs
▰Queries

14. www.openweb.nl
Intro to GraphQL
@GKlijs
▰Queries
▰Mutations

15. www.openweb.nl
Intro to GraphQL
@GKlijs
▰Queries
▰Mutations
▰Subscriptions

16. www.openweb.nl
Misconceptions about GraphQL
@GKlijs
GraphQL needs a Graph
Database

17. www.openweb.nl
Misconceptions about GraphQL
@GKlijs
GraphQL is owned by
Facebook

18. www.openweb.nl
Misconceptions about GraphQL
@GKlijs
GraphQL is better than
REST

19. www.openweb.nl
Misconceptions about GraphQL
@GKlijs
GraphQL is just for
frontend

20. www.openweb.nl
Misconceptions about GraphQL
@GKlijs
GraphQL is only for
javascript

21. www.openweb.nl
Intro to Kafka
@GKlijs

22. www.openweb.nl
Intro to Kafka
@GKlijs

23. www.openweb.nl
Intro to Kafka
@GKlijs

24. www.openweb.nl
Misconceptions about Kafka
@GKlijs
Kafka is just a message
queue

25. www.openweb.nl
Misconceptions about Kafka
@GKlijs
Kafka can’t be used to
mutate data

26. www.openweb.nl
Misconceptions about Kafka
@GKlijs
Kafka can’t be used to
mutate data

27. www.openweb.nl
Misconceptions about Kafka
@GKlijs
Kafka is hard to maintain

28. www.openweb.nl
Misconceptions about Kafka
@GKlijs
Kafka is hard to maintain

29. www.openweb.nl
Misconceptions about Kafka
@GKlijs
Kafka is hard to maintain

30. www.openweb.nl
Misconceptions about Kafka
@GKlijs
It’s not possible to do
queries on Kafka

31. www.openweb.nl
Misconceptions about Kafka
@GKlijs
It’s not possible to do
queries on Kafka

32. www.openweb.nl
Connecting the technologies
@GKlijs
How to get the types?

33. www.openweb.nl
Connecting the technologies
@GKlijs
How to get the types?
● Schema Registry

34. www.openweb.nl
Connecting the technologies
@GKlijs
How to get the types?
● Schema Registry
● Schema first

35. www.openweb.nl
Connecting the technologies
@GKlijs
How to get the types?
● Schema Registry
● Schema first
● Relation to topics

36. www.openweb.nl
Connecting the technologies
@GKlijs
How/if to implement the operations?
● Query

37. www.openweb.nl
Connecting the technologies
@GKlijs
How/if to implement the operations?
● Query
● Mutation

38. www.openweb.nl
Connecting the technologies
@GKlijs
How/if to implement the operations?
● Query
● Mutation
● Subscription

39. www.openweb.nl
Connecting the technologies
@GKlijs
Authentication,
authorization and security?

40. www.openweb.nl
Connecting the technologies
@GKlijs
Authentication,
authorization and security?

41. www.openweb.nl
2 example POC’s: ksqlDB
@GKlijs
https://gklijs.tech/a

42. www.openweb.nl
2 example POC’s: ksqlDB
@GKlijs

43. www.openweb.nl
2 example POC’s: ksqlDB
@GKlijs
query {
PERSONS_BY_BIRTHYEAR(BIRTHYEAR: 1983){
BIRTHYEAR
TOTAL
}
}

44. www.openweb.nl
2 example POC’s: ksqlDB
@GKlijs
{
"data": {
"PERSONS_BY_BIRTHYEAR": {
"BIRTHYEAR": 1983,
"TOTAL": 1
}
}
}

45. www.openweb.nl
2 example POC’s: ksqlDB
@GKlijs
mutation {
PERSONS (
ID_KEY: "gklijs" ID: "gklijs"
FIRST_NAME: "Gerard" LAST_NAME: "Klijs"
BIRTHDAY: { YEAR: 1983 MONTH: 8 DAY: 23
}
){ statusCode }
}

46. www.openweb.nl
2 example POC’s: ksqlDB
@GKlijs
{
"data": {
"PERSONS": {
"statusCode": 200
}
}
}

47. www.openweb.nl
2 example POC’s: ksqlDB
@GKlijs
subscription {
PERSONS_BY_BIRTHYEAR {
BIRTHYEAR
TOTAL
}
}

48. www.openweb.nl
2 example POC’s: ksqlDB
@GKlijs
{
"data": {
"PERSONS_BY_BIRTHYEAR": {
"BIRTHYEAR": 1983,
"TOTAL": 2
}
}
}

49. www.openweb.nl
2 example POC’s: ksqlDB
@GKlijs
{
"data": {
"PERSONS_BY_BIRTHYEAR": {
"BIRTHYEAR": 1983,
"TOTAL": 3
}
}
}

50. www.openweb.nl
2 example POC’s: CQRS
@GKlijs
https://gklijs.tech/b

51. www.openweb.nl
2 example POC’s: CQRS
@GKlijs

52. www.openweb.nl
2 example POC’s: CQRS
@GKlijs
query {
transaction_by_id(id: 1){
descr
iban
}
}

53. www.openweb.nl
2 example POC’s: CQRS
@GKlijs
{
"data": {
"transaction_by_id": {
"descr": "initial funds",
"iban": "NL66OPEN0000000000"
}
}
}

54. www.openweb.nl
2 example POC’s: CQRS
@GKlijs
mutation {
get_account(username: "gerardklijs",
password: "test1234") {
iban
token
}
}

55. www.openweb.nl
2 example POC’s: CQRS
@GKlijs
{
"data": {
"get_account": {
"iban": "NL32OPEN0116336786",
"token": "64863395589341241872"
}
}
}

56. www.openweb.nl
2 example POC’s: CQRS
@GKlijs
subscription {
stream_transactions(iban:
"NL66OPEN0000000000") {
id
new_balance
}
}

57. www.openweb.nl
2 example POC’s: CQRS
@GKlijs
{
"stream_transactions": {
"id": 7,
"new_balance": "€1.000.026,00",
"descr": "test for presentation"
}
}

58. www.openweb.nl
2 example POC’s: CQRS
@GKlijs
{
"stream_transactions": {
"id": 9,
"new_balance": "€1.000.045,00",
"descr": "another test"
}
}

59. www.openweb.nl
Main Takeaway
@GKlijs
GraphQL opens up some interesting
possibilities used with Kafka.
Bridging between backend and frontend,
with lots of ways to do it.