GraphQL has gained traction as a good solution for building APIs of all kind. It is especially developer friendly for building decoupled sites. The technology originates from Facebook, but is now an open standard that has multiple implementations in different languages. These slides describes the current state of GraphQL and eZ Platform, an enterprise grade Content Management System (CMS) , and what approaches are available for developers looking to use the powerful content management platform with the agile API format provided by the GraphQL specification. Slides also here: https://janit.iki.fi/ez-platform-graphql/

1. GRAPHQL APISGRAPHQL APIS
WITH EZ PLATFORMWITH EZ PLATFORM
SYMFONY CMSSYMFONY CMS
eZ Meetup Oslo
February 22nd 2018 - Jani Tarvainen

2. AgendaAgenda
GraphQL introduction
GraphQL with eZ Platform
GraphQL caveats
Headless site example using Next.js

3. GRAPHQLGRAPHQL
INTRODUCTIONINTRODUCTION

4. GraphQL introductionGraphQL introduction
Under the umbrella:
A communications protocol
A Query Language
Server implementations
Client implementations
Timeline:
Used at Facebook since 2012
Public release in 2015
Gaining momentum in 2017
Notable : GitHub, Pinterest, Neo4j,
Shopify, New York Times, Sky, Twitter, Yelp…
GraphQL
adopters

5. GraphQL introductionGraphQL introduction
An alternative to RESTful APIs
GraphQL independent of protocol,
Not using on HTTP verbs (POST, GET…)
REST is an architectural pattern
GraphQL is a specification
GraphQL APIs are strongly typed
Self-documenting
You WILL need to write descriptions ;)

6. GraphQL with PHP & SymfonyGraphQL with PHP & Symfony
Reference implementation in JavaScript
Two mature PHP implementations:
Both solid and feature complete
Symfony integrations:
More:
WebOnyx GraphQL library
Youshido GraphQL library
OverBlog GraphQL Bundle
Youshido GraphQL Bundle
GraphQL, PHP and Symfony

7. GraphQL client librariesGraphQL client libraries
You can use raw HTTP
Libs provide
Convenience
Client side caching
Security (Phear the dreaded GraphQL Injection)
Notable browser / Node.js libraries
Relay Modern
Apollo
Urql

8. GRAPHQL WITHGRAPHQL WITH
EZ PLATFORMEZ PLATFORM

9. GraphQL for CMSGraphQL for CMS
CMS has a lot of complexity (content types, permissions,
relations, content rendering…)
A generic protocol, not CMS specific
Queries are application specific
Developer friendly for queries (reads)
Colocation of queries and template

10. GraphQL and eZ PlatformGraphQL and eZ Platform
eZ Platform does not ship with GraphQL support
That won't stop you:
Use the eZ Platform GraphQL Bundle
Integrate using a Symfony GraphQL bundle
Roll your own GraphQL server (please don't!)

11. eZ Platform GraphQL BundleeZ Platform GraphQL Bundle
An experimental bundle from October 2016
Not maintained, but it's mostly glue code ¯(ツ)/¯
I to run with
Integrates the OverBlog GraphQL Bundle to repo
A decent feature list:
Query content, location and users
Search content, list location children…
forked it eZ Platform v2
GraphiQL shell

12. A simple example queryA simple example query
eZ Platform specific example
Gets location children's name property for location 2
{
locationChildren(id: 2) {
content {
name
}
}
}

13. Integrate usingIntegrate using
a Symfony GraphQL bundlea Symfony GraphQL bundle
Install a generic GraphQL Bundle
Both OverBlog and Youshido are solid
OverBlog focusing on Symfony 4 + Flex now
Similar functionality and lingo
You will need to:
Configure schema (with types)
Create resolver (to resolve queries from content repo)
Adding GraphQL API to your Symfony Flex app

14. My recommendationsMy recommendations
For tinkering:
Use the eZ Platform GraphQL Bundle
It works great, but there might be issues
You can
For production:
Create your own GraphQL Bundle integration
Exact control of what you expose
A generic framework to expose QueryTypes?
extend it with your queries

15. GraphQL CaveatsGraphQL Caveats
You're exposing an generic for users to query
Users may find things that they shouldn't
Users could cause load by
HTTP caching not trivial
Everything's a POST in most client libraries
Even GETs can be very different
Vulnerable to "GraphQL injections"
Client libraries sanitize input
It's just one tool - There's a time and place for it
complex or deep queries

16. HEADLESS SITEHEADLESS SITE
EXAMPLE USINGEXAMPLE USING
NEXT.JSNEXT.JS

17. A sample decoupled site built with the
universal JavaScript framework :Next.js
https://react.nu/
https://github.com/janit/decoupled-cms-nextjs-graphql
https://v1-11-hbgl5gq-oiiukjqgkij7e.eu.platform.sh/graphiql
https://janit.iki.fi/cms-graphql-nextjs/
https://www.youtube.com/watch?v=efoeIz9xTDs

18. THANK YOUTHANK YOU
Questions?