ARMGDN
Apollo, React, MobX, GraphQL, Db and Node
Building modern web apps with
ARMGDN
Developer Advocate
Web / Mobile / VR / AR / IoT
GDE, author, consultant
What all these technologies are about
X
QL
ReactJS
React is everywhere
MobX
State management solution applying functional reactive programming principles
MobX State Tree
Opinionated, transactional, MobX powered state container combining the best features of the immutable and mutable world for an optimal DX
GraphQL
What is GraphQL?
RESTfull API
The core idea is to have a URL for every resource
Description of resource is coupled to implementation
Overfetching
Underfetching
chaining requests to server to get needed data
GraphQL
A query language for your API
How to Consume GraphQL API
Apollo Client
Integrate Apollo with MobX State tree
DB/Node
What about our GraphQL Backend
Let's talk about architecture
3factor.app
-
Real-time GraphQL
-
Reliable eventing
-
Async serverless
3factor.app
Factor 1: Real-time GraphQL
-
Hasura
-
AppSync
-
graphql -yoga -
apollo server
Factor 2: Reliable eventing
-
Debezium
-
Hasura event triggers
-
Event sourcing
Factor 3: Async serverless
-
AWS Lambda
-
Google Cloud Functions
-
Azure Functions
-
Zeit
-
OpenFaas, Kubeless, Knative (for Kubernetes)
What is Hasura
open source and free engine that gives you auto-generates real-time GraphQL API on top of new or existing Postgres database
Features
- Can be deployed to any cloud or run locally
- Compatible with all Authentication solutions
- Can run on top of new or existing Postgres database
- Supports Postgres addons (PostGIS, TimescaleDB)
- Auto-generates GraphQL api
- GraphQL queries are compiled to performant SQL statements using native Postgres features
Features
- Comes with hasura-cli which has awesome tools like migrations and more
- Can work with custom SQL statements
- Has configurable access controls for data
- Can be connected to your own GraphQL server (does schema stitching)
- Has eventing system which enables to trigger serverless functions
How to get started?
-
Go to hasura.io
-
Click on Get started with Heroku
-
Click on
-
Enter your app name
Hasura Console overview
- GraphiQL - run your queries in in-browser IDE
- Data - manage your data, access control, relations, permissions
- Remote Schemas - stitch GraphQL schema of your custom GraphQL server
- Event Triggers - connect your serverless functions
GraphiQL tab - use for development
- Set endpoint headers
- Execute queries mutations and subscriptions
- Analyse queries
Data tab - data management interface
- View and insert data into db
- create and modify tables
- Create relationships
- set permissions and access control
- execute custom sql statements
Remote Schemas tab
stitch your custom GraphQL server schema
Event triggers
- connect custom webhooks to database events to execute serverless functions
- set retry logic
- forward custom headers to webhook
Run hasura locally on top of existing postgres
What about supported Databases?
- Postgres
- Postgres extensions (PostGis, TimeScaleDB)
- MySQL (Coming soon) https://www.producthunt.com/upcoming/hasura-graphql-engine-on-mysql
- NoSQL databases( through json2graphql tool)
- Migration from Firebase(through firebase2graphql tool)
Where is NodeJS in all of these?
Serverless functions for your business logic
In any programming language, your cloud provider supports
Demo time
Thank You
@VladimirNovick
vnovick.com
Copy of ARMGDN - Build modern web apps using Apollo, React, MobX GraphQL, Db and Node.js
By Vladimir Novick
Copy of ARMGDN - Build modern web apps using Apollo, React, MobX GraphQL, Db and Node.js
In this talk, we will see how we can use modern javascript stack for writing serverless applications with GraphQL powered backend, Apollo, React and MobX client, Postgress or DynamoDb and NodeJS.
- 1,440