Apollo
The graphQL platform that even covers the moon!
Italo "lin" lino
- Musician
- Open source enthusiast
- Love education
- Connecting people to justice.
Graphql
" GraphQL é uma linguagem de consulta. É considerada uma alternativa para arquiteturas REST, além de oferecer um serviço runtime para rodar comandos e consumir uma API.
Wikipédia
Graphql
Rest
interface Planet {
id: string
name: string,
description: string
}
interface BaseApi<T> {
getAll: () => Promise<[T]>
getById: (id: string) => Promise<Planet>
}
class PlanetAPI implements BaseApi<Planet> {
private API_URL = "https://somekindofendpoint.com/api/";
public getAll = () => axios.get<Planet>(`${API_URL}/planets`);
public getById = (id: string) => axios.get(`${API_URL}`/planet/${id});
}
about rest APIs
- A lot of endpoints 🤯
- More data than needed 💍
- Version management ♻
- Hight cost maintainment 💸
SO how GQL works?
Describe your data
type Planet {
id: ID
name: String
description: String
}
type Query {
getPlanets: [Planet]
}
Schema
Only what you need
query VemPlaneta{
getPlanet(id: "someid") {
name
}
}
Response
{
"planet": {
"name": "Sanar"
}
}
Query
Ways to fetch data
- Query
- Mutation
- Subscription
Query
At its simplest, GraphQL is about asking for specific fields on objects
{
planet {
name
}
}
{
"data": {
"planet": {
"name": "some kind of planet"
}
}
}
Query
Response
MUtation
Just like in queries, if the mutation field returns an object type, you can ask for nested fields.
mutation AddPlanet($input: AddPlanetInput!){
addPlanet(input: $input){
name
}
}
{
"data": {
"planet": {
"name": "some kind of planet"
}
}
}
Mutation
Response
Subscription
Real time data
subscription {
lastPlanet
}
{
"data": {
"planet": {
"name": "some kind of planet"
}
}
}
------------------------------------
{
"data": {
"planet": {
"name": "another planet after update"
}
}
}
Mutação
Resposta
Apollo
Finally!
What it is?
"Apollo is a complete platform for implementing a graph over your data"
Apollo platform
Apollo PLATFORM
Players.
Apollo server
Features
Apollo Server
Universal compatibility.
Apollo Server
HUGE community.
Apollo Server
Built-in features.
- Error handling
- Pagination
- Caching
Apollo Server
Live demostration.
Bifrost GraphQL
Apollo CLIent
Features
Apollo Client
Client for every one.
Apollo Client
Interoperability with other frameworks
Apollo Client
Declarative data fetching.
function Planets() {
const { loading, error, data } = useQuery(GET_PLANETS);
if (error) return <Error />;
if (loading || !data) return <ActivityIndicator />;
return <PlanetList planets={data.planets} />;
}
Apollo Client
Caching
"The InMemoryCache normalizes your data before saving it to the store by splitting the result into individual objects, creating a unique identifier for each object, and storing those objects in a flattened data structure"
- Direct Cache Access
- Read Query or Mutation
- Write Query or Mutation
- Updating the cache after a mutation
Apollo Client
Local state management @client.
{
isAdmin
}
{
isAdmin @client
}
Remote Root Query
Client Root Query
Apollo Client
Local state management @client.
const client = new ApolloClient({
cache: new InMemoryCache(),
link: new HttpLink({ uri: 'http://localhost:4000' }),
resolvers
});
Apollo client also works as an local Apollo Server with Resolvers!!!
Apollo Client
Local state management @client.
query currentAuthorPostCount($authorId: Int!) {
currentAuthorId @client @export(as: "authorId")
postCount(authorId: $authorId)
}
Nested as well
query currentAuthorPostCount($authorId: Int!) {
currentAuthor @client {
name
authorId @export(as: "authorId")
}
postCount(authorId: $authorId)
}
Apollo Client
Live demostration.
React Native App
In the last
but not the least
Apollo Engine
Features
Apollo Engine
Api manager.
Apollo Engine
Live Demonstration.
$ apollo service:push --endpoint=http://localhost:4000
That's all, thanks for coming!
Any questions?
Linzera
Apollo
By Italo Lino
Apollo
GraphQL. Esta API está ganhando mercado rapidamente por conta da sua escalabilidade e é o novo padrão de acesso a dados em aplicações modernas. Temos várias bibliotecas disponíveis para se trabalhar com React e GraphQL, dessa vez vamos dar uma olhada no Apollo GraphQL. Afinal, porque essa biblioteca caiu no gosto dos desenvolvedores? Nesse meetup, Ítalo Lino, engenheiro de software trainee no Jusbrasil vai responder essa pergunta e também
- 287