SlideShare ist ein Scribd-Unternehmen logo
1 von 17
Downloaden Sie, um offline zu lesen
Bartosz Herba | Divante Senior Developer
GraphQL
are you sure you know when to use it?
Let’s talk about
eCommerce
Hi, my name is Bartosz Herba
I am a Magento 2 developer with a few years of experience in working on
e-commerce solutions
email: bherba@divante.co
mobile: +48 662 093 917
What is a GraphQL?
What is a GraphQL
● Invented and used by Facebook since 2012 to speed up
communication with a facebook API for a different kind of
devices.
● GraphQL is an Alternative, Elastic, Resource Effective,
Centralized and Strongly Typed way of a communication with
an API
What is a GraphQL?
Alternative
● Does not replace REST or SOAP in the “way” of communication with an API,
just gives another tool to achieve similar goal.
● Brings new structured approach of how we ask for a required resources
What is a GraphQL?
Alternative
Query Body Response
Endpoint Url
What is a GraphQL?
Elastic and Resource Effective
● You don’t have to ask for everything but exactly and only what you need
● Therefore requests and responses are lightweight because only necessary data are
transferred
● No more of under/over fetching problems
What is a GraphQL?
Elastic and Resource Effective
{"id":1,"sku":"simple_sku","name":"Test
Simple","attribute_set_id":4,"price":119,"status":1,"visibility":4,"type_id":"simple","created_at":"2019-09-19
10:02:25","updated_at":"2019-09-19
10:02:25","extension_attributes":{"website_ids":[1],"stock_item":{"item_id":1,"product_id":1,"stock_id":1,"qty":12,"is_in_stock":true,"i
s_qty_decimal":false,"show_default_notification_message":false,"use_config_min_qty":true,"min_qty":0,"use_config_min_sale_qty":1
,"min_sale_qty":1,"use_config_max_sale_qty":true,"max_sale_qty":10000,"use_config_backorders":true,"backorders":0,"use_config_
notify_stock_qty":true,"notify_stock_qty":1,"use_config_qty_increments":true,"qty_increments":0,"use_config_enable_qty_inc":true,"
enable_qty_increments":false,"use_config_manage_stock":true,"manage_stock":true,"low_stock_date":null,"is_decimal_divided":fals
e,"stock_status_changed_auto":0}},"product_links":[],"options":[],"media_gallery_entries":[],"tier_prices":[],"custom_attributes":[{"attri
bute_code":"pimcore_id","value":"0"},{"attribute_code":"is_active_in_pim","value":"0"},{"attribute_code":"options_container","value":
"container2"},{"attribute_code":"msrp_display_actual_price_type","value":"0"},{"attribute_code":"url_key","value":"test-simple"},{"attr
ibute_code":"gift_message_available","value":"2"},{"attribute_code":"required_options","value":"0"},{"attribute_code":"has_options",
"value":"0"},{"attribute_code":"meta_title","value":"Test Simple"},{"attribute_code":"meta_keyword","value":"Test
Simple"},{"attribute_code":"meta_description","value":"Test Simple
"},{"attribute_code":"tax_class_id","value":"2"},{"attribute_code":"category_ids","value":[]}]}
Rest - simplest possible response is full of unnecessary data
What is a GraphQL?
Elastic and Resource Effective
{
"data": {
"products": {
"items": [
{
"price": {
"regularPrice": {
"amount": {
"value": 119
}
}
},
"sku": "simple_sku",
"name": "Test Simple",
"image": {
"label": "Test Simple"
...
GraphQL - you get exactly what you want and nothing more
What is a GraphQL?
Elastic and Resource Effective
155
1600
What is a GraphQL?
Centralized
● There is just one endpoint for any request
● Difference is in request’s body structure
● It means that you can prepare just a single request instead of
many to get all necessary data for a view
REST ApiGraphQL Api
What is a GraphQL?
Centralized
/graphql
/products /cms /customer
What is a GraphQL?
Strongly Typed
● The most basic components of a GraphQL schema are object types, which just
represent a kind of object you can fetch from your service, and what fields it has.
● Every field on a GraphQL object type can have zero or more arguments
● A GraphQL object type has a name and fields, but at some point those fields
have to resolve to some concrete data. That's where the scalar types come in: they
represent the leaves of the query.
● Scalars, enums, lists, interfaces
● We always know what to expect.
What is a GraphQL?
When to use it?
● Building an API for different devices
● Building an open API
● Working with Model-View layers
● Working with multiple-resources-at-a-time scenarios
What is a GraphQL?
When not to use it?
● I would not recommend to use it with ERP integrations
● But, to be frankly, it is hard to give a general and true statement on such a
topic
What is a GraphQL?
GraphQL in Magento
Available from 2.3.x
Main target is PWA
What is a GraphQL?
GraphQL in Magento - coverage
● module-catalog-graph-ql
● module-bundle-graph-ql
● module-catalog-inventory-graph-ql
● module-catalog-url-rewrite-graph-ql
● module-cms-graph-ql
● module-configurable-product-graph-ql
● module-customer-graph-ql
● module-directory-graph-ql
● module-downloadable-graph-ql
● module-eav-graph-ql
● module-grouped-product-graph-ql
● module-inventory-graph-ql
● module-quote-graph-ql
● module-sales-graph-ql
● module-send-friend-graph-ql
● module-store-graph-ql
● module-swatches-graph-ql
● module-tax-graph-ql
● module-theme-graph-ql
● module-url-rewrite-graph-ql
● module-vault-graph-ql
● module-wee-graph-ql
● module-wishlist-graph-ql
LEARN MORE AT
DIVANTE.COM/BLOG

Weitere ähnliche Inhalte

Mehr von Divante

How to create a Vue Storefront theme
How to create a Vue Storefront themeHow to create a Vue Storefront theme
How to create a Vue Storefront themeDivante
 
Game changer for e-commerce - Vue Storefront - open source pwa
Game changer for e-commerce - Vue Storefront - open source pwa Game changer for e-commerce - Vue Storefront - open source pwa
Game changer for e-commerce - Vue Storefront - open source pwa Divante
 
Vue Storefront - Progressive Web App for Magento (1.9, 2.x) - MM18DE speech
Vue Storefront - Progressive Web App for Magento (1.9, 2.x) - MM18DE speechVue Storefront - Progressive Web App for Magento (1.9, 2.x) - MM18DE speech
Vue Storefront - Progressive Web App for Magento (1.9, 2.x) - MM18DE speechDivante
 
How to successfully onboard end-clients to a B2B Platform - Magento Imagine ...
How to successfully onboard  end-clients to a B2B Platform - Magento Imagine ...How to successfully onboard  end-clients to a B2B Platform - Magento Imagine ...
How to successfully onboard end-clients to a B2B Platform - Magento Imagine ...Divante
 
eCommerce trends from 2017 to 2018 by Divante.co
eCommerce trends from 2017 to 2018 by Divante.coeCommerce trends from 2017 to 2018 by Divante.co
eCommerce trends from 2017 to 2018 by Divante.coDivante
 
Designing for PWA (Progressive Web Apps)
Designing for PWA (Progressive Web Apps)Designing for PWA (Progressive Web Apps)
Designing for PWA (Progressive Web Apps)Divante
 
Why is crud a bad idea - focus on real scenarios
Why is crud a bad idea - focus on real scenariosWhy is crud a bad idea - focus on real scenarios
Why is crud a bad idea - focus on real scenariosDivante
 
vue-storefront - PWA eCommerce for Magento2 MM17NYC presentation
vue-storefront - PWA eCommerce for Magento2 MM17NYC presentationvue-storefront - PWA eCommerce for Magento2 MM17NYC presentation
vue-storefront - PWA eCommerce for Magento2 MM17NYC presentationDivante
 
Pimcore Overview - Pimcore5
Pimcore Overview - Pimcore5Pimcore Overview - Pimcore5
Pimcore Overview - Pimcore5Divante
 
Pimcore E-Commerce Framework - Pimcore5
Pimcore E-Commerce Framework - Pimcore5Pimcore E-Commerce Framework - Pimcore5
Pimcore E-Commerce Framework - Pimcore5Divante
 
The biggest stores on Magento
The biggest stores on MagentoThe biggest stores on Magento
The biggest stores on MagentoDivante
 
B2B Commerce - how to become successful
B2B Commerce - how to become successfulB2B Commerce - how to become successful
B2B Commerce - how to become successfulDivante
 
Budgeting in SCRUM by Divante
Budgeting in SCRUM by DivanteBudgeting in SCRUM by Divante
Budgeting in SCRUM by DivanteDivante
 
Omnichannel B2B Architecture
Omnichannel B2B ArchitectureOmnichannel B2B Architecture
Omnichannel B2B ArchitectureDivante
 
UX for eCommerce Fashion
UX for eCommerce FashionUX for eCommerce Fashion
UX for eCommerce FashionDivante
 
Microservices Architecture for e-Commerce
Microservices Architecture for e-CommerceMicroservices Architecture for e-Commerce
Microservices Architecture for e-CommerceDivante
 
UI elements in Magento 1.9 and 2
UI elements in Magento 1.9 and 2UI elements in Magento 1.9 and 2
UI elements in Magento 1.9 and 2Divante
 
Pimcore - Presentation
Pimcore - PresentationPimcore - Presentation
Pimcore - PresentationDivante
 
Divante eCommerce Design Studio
Divante eCommerce Design StudioDivante eCommerce Design Studio
Divante eCommerce Design StudioDivante
 
Pimcore - Content Management System and PIM
Pimcore  - Content Management System and PIMPimcore  - Content Management System and PIM
Pimcore - Content Management System and PIMDivante
 

Mehr von Divante (20)

How to create a Vue Storefront theme
How to create a Vue Storefront themeHow to create a Vue Storefront theme
How to create a Vue Storefront theme
 
Game changer for e-commerce - Vue Storefront - open source pwa
Game changer for e-commerce - Vue Storefront - open source pwa Game changer for e-commerce - Vue Storefront - open source pwa
Game changer for e-commerce - Vue Storefront - open source pwa
 
Vue Storefront - Progressive Web App for Magento (1.9, 2.x) - MM18DE speech
Vue Storefront - Progressive Web App for Magento (1.9, 2.x) - MM18DE speechVue Storefront - Progressive Web App for Magento (1.9, 2.x) - MM18DE speech
Vue Storefront - Progressive Web App for Magento (1.9, 2.x) - MM18DE speech
 
How to successfully onboard end-clients to a B2B Platform - Magento Imagine ...
How to successfully onboard  end-clients to a B2B Platform - Magento Imagine ...How to successfully onboard  end-clients to a B2B Platform - Magento Imagine ...
How to successfully onboard end-clients to a B2B Platform - Magento Imagine ...
 
eCommerce trends from 2017 to 2018 by Divante.co
eCommerce trends from 2017 to 2018 by Divante.coeCommerce trends from 2017 to 2018 by Divante.co
eCommerce trends from 2017 to 2018 by Divante.co
 
Designing for PWA (Progressive Web Apps)
Designing for PWA (Progressive Web Apps)Designing for PWA (Progressive Web Apps)
Designing for PWA (Progressive Web Apps)
 
Why is crud a bad idea - focus on real scenarios
Why is crud a bad idea - focus on real scenariosWhy is crud a bad idea - focus on real scenarios
Why is crud a bad idea - focus on real scenarios
 
vue-storefront - PWA eCommerce for Magento2 MM17NYC presentation
vue-storefront - PWA eCommerce for Magento2 MM17NYC presentationvue-storefront - PWA eCommerce for Magento2 MM17NYC presentation
vue-storefront - PWA eCommerce for Magento2 MM17NYC presentation
 
Pimcore Overview - Pimcore5
Pimcore Overview - Pimcore5Pimcore Overview - Pimcore5
Pimcore Overview - Pimcore5
 
Pimcore E-Commerce Framework - Pimcore5
Pimcore E-Commerce Framework - Pimcore5Pimcore E-Commerce Framework - Pimcore5
Pimcore E-Commerce Framework - Pimcore5
 
The biggest stores on Magento
The biggest stores on MagentoThe biggest stores on Magento
The biggest stores on Magento
 
B2B Commerce - how to become successful
B2B Commerce - how to become successfulB2B Commerce - how to become successful
B2B Commerce - how to become successful
 
Budgeting in SCRUM by Divante
Budgeting in SCRUM by DivanteBudgeting in SCRUM by Divante
Budgeting in SCRUM by Divante
 
Omnichannel B2B Architecture
Omnichannel B2B ArchitectureOmnichannel B2B Architecture
Omnichannel B2B Architecture
 
UX for eCommerce Fashion
UX for eCommerce FashionUX for eCommerce Fashion
UX for eCommerce Fashion
 
Microservices Architecture for e-Commerce
Microservices Architecture for e-CommerceMicroservices Architecture for e-Commerce
Microservices Architecture for e-Commerce
 
UI elements in Magento 1.9 and 2
UI elements in Magento 1.9 and 2UI elements in Magento 1.9 and 2
UI elements in Magento 1.9 and 2
 
Pimcore - Presentation
Pimcore - PresentationPimcore - Presentation
Pimcore - Presentation
 
Divante eCommerce Design Studio
Divante eCommerce Design StudioDivante eCommerce Design Studio
Divante eCommerce Design Studio
 
Pimcore - Content Management System and PIM
Pimcore  - Content Management System and PIMPimcore  - Content Management System and PIM
Pimcore - Content Management System and PIM
 

Kürzlich hochgeladen

Summary IGF 2013 Bali - English (tata kelola internet / internet governance)
Summary  IGF 2013 Bali - English (tata kelola internet / internet governance)Summary  IGF 2013 Bali - English (tata kelola internet / internet governance)
Summary IGF 2013 Bali - English (tata kelola internet / internet governance)ICT Watch - Indonesia
 
TRENDS Enabling and inhibiting dimensions.pptx
TRENDS Enabling and inhibiting dimensions.pptxTRENDS Enabling and inhibiting dimensions.pptx
TRENDS Enabling and inhibiting dimensions.pptxAndrieCagasanAkio
 
办理澳洲USYD文凭证书学历认证【Q微/1954292140】办理悉尼大学毕业证书真实成绩单GPA修改/办理澳洲大学文凭证书Offer录取通知书/在读证明...
办理澳洲USYD文凭证书学历认证【Q微/1954292140】办理悉尼大学毕业证书真实成绩单GPA修改/办理澳洲大学文凭证书Offer录取通知书/在读证明...办理澳洲USYD文凭证书学历认证【Q微/1954292140】办理悉尼大学毕业证书真实成绩单GPA修改/办理澳洲大学文凭证书Offer录取通知书/在读证明...
办理澳洲USYD文凭证书学历认证【Q微/1954292140】办理悉尼大学毕业证书真实成绩单GPA修改/办理澳洲大学文凭证书Offer录取通知书/在读证明...vmzoxnx5
 
IP addressing and IPv6, presented by Paul Wilson at IETF 119
IP addressing and IPv6, presented by Paul Wilson at IETF 119IP addressing and IPv6, presented by Paul Wilson at IETF 119
IP addressing and IPv6, presented by Paul Wilson at IETF 119APNIC
 
How to login to Router net ORBI LOGIN...
How to login to Router net ORBI LOGIN...How to login to Router net ORBI LOGIN...
How to login to Router net ORBI LOGIN...rrouter90
 
Cybersecurity Threats and Cybersecurity Best Practices
Cybersecurity Threats and Cybersecurity Best PracticesCybersecurity Threats and Cybersecurity Best Practices
Cybersecurity Threats and Cybersecurity Best PracticesLumiverse Solutions Pvt Ltd
 
Summary ID-IGF 2016 National Dialogue - English (tata kelola internet / int...
Summary  ID-IGF 2016 National Dialogue  - English (tata kelola internet / int...Summary  ID-IGF 2016 National Dialogue  - English (tata kelola internet / int...
Summary ID-IGF 2016 National Dialogue - English (tata kelola internet / int...ICT Watch - Indonesia
 
Company Snapshot Theme for Business by Slidesgo.pptx
Company Snapshot Theme for Business by Slidesgo.pptxCompany Snapshot Theme for Business by Slidesgo.pptx
Company Snapshot Theme for Business by Slidesgo.pptxMario
 
Unidad 4 – Redes de ordenadores (en inglés).pptx
Unidad 4 – Redes de ordenadores (en inglés).pptxUnidad 4 – Redes de ordenadores (en inglés).pptx
Unidad 4 – Redes de ordenadores (en inglés).pptxmibuzondetrabajo
 

Kürzlich hochgeladen (9)

Summary IGF 2013 Bali - English (tata kelola internet / internet governance)
Summary  IGF 2013 Bali - English (tata kelola internet / internet governance)Summary  IGF 2013 Bali - English (tata kelola internet / internet governance)
Summary IGF 2013 Bali - English (tata kelola internet / internet governance)
 
TRENDS Enabling and inhibiting dimensions.pptx
TRENDS Enabling and inhibiting dimensions.pptxTRENDS Enabling and inhibiting dimensions.pptx
TRENDS Enabling and inhibiting dimensions.pptx
 
办理澳洲USYD文凭证书学历认证【Q微/1954292140】办理悉尼大学毕业证书真实成绩单GPA修改/办理澳洲大学文凭证书Offer录取通知书/在读证明...
办理澳洲USYD文凭证书学历认证【Q微/1954292140】办理悉尼大学毕业证书真实成绩单GPA修改/办理澳洲大学文凭证书Offer录取通知书/在读证明...办理澳洲USYD文凭证书学历认证【Q微/1954292140】办理悉尼大学毕业证书真实成绩单GPA修改/办理澳洲大学文凭证书Offer录取通知书/在读证明...
办理澳洲USYD文凭证书学历认证【Q微/1954292140】办理悉尼大学毕业证书真实成绩单GPA修改/办理澳洲大学文凭证书Offer录取通知书/在读证明...
 
IP addressing and IPv6, presented by Paul Wilson at IETF 119
IP addressing and IPv6, presented by Paul Wilson at IETF 119IP addressing and IPv6, presented by Paul Wilson at IETF 119
IP addressing and IPv6, presented by Paul Wilson at IETF 119
 
How to login to Router net ORBI LOGIN...
How to login to Router net ORBI LOGIN...How to login to Router net ORBI LOGIN...
How to login to Router net ORBI LOGIN...
 
Cybersecurity Threats and Cybersecurity Best Practices
Cybersecurity Threats and Cybersecurity Best PracticesCybersecurity Threats and Cybersecurity Best Practices
Cybersecurity Threats and Cybersecurity Best Practices
 
Summary ID-IGF 2016 National Dialogue - English (tata kelola internet / int...
Summary  ID-IGF 2016 National Dialogue  - English (tata kelola internet / int...Summary  ID-IGF 2016 National Dialogue  - English (tata kelola internet / int...
Summary ID-IGF 2016 National Dialogue - English (tata kelola internet / int...
 
Company Snapshot Theme for Business by Slidesgo.pptx
Company Snapshot Theme for Business by Slidesgo.pptxCompany Snapshot Theme for Business by Slidesgo.pptx
Company Snapshot Theme for Business by Slidesgo.pptx
 
Unidad 4 – Redes de ordenadores (en inglés).pptx
Unidad 4 – Redes de ordenadores (en inglés).pptxUnidad 4 – Redes de ordenadores (en inglés).pptx
Unidad 4 – Redes de ordenadores (en inglés).pptx
 

GraphQL are you sure you know when to use it?

  • 1. Bartosz Herba | Divante Senior Developer GraphQL are you sure you know when to use it?
  • 2. Let’s talk about eCommerce Hi, my name is Bartosz Herba I am a Magento 2 developer with a few years of experience in working on e-commerce solutions email: bherba@divante.co mobile: +48 662 093 917
  • 3. What is a GraphQL? What is a GraphQL ● Invented and used by Facebook since 2012 to speed up communication with a facebook API for a different kind of devices. ● GraphQL is an Alternative, Elastic, Resource Effective, Centralized and Strongly Typed way of a communication with an API
  • 4. What is a GraphQL? Alternative ● Does not replace REST or SOAP in the “way” of communication with an API, just gives another tool to achieve similar goal. ● Brings new structured approach of how we ask for a required resources
  • 5. What is a GraphQL? Alternative Query Body Response Endpoint Url
  • 6. What is a GraphQL? Elastic and Resource Effective ● You don’t have to ask for everything but exactly and only what you need ● Therefore requests and responses are lightweight because only necessary data are transferred ● No more of under/over fetching problems
  • 7. What is a GraphQL? Elastic and Resource Effective {"id":1,"sku":"simple_sku","name":"Test Simple","attribute_set_id":4,"price":119,"status":1,"visibility":4,"type_id":"simple","created_at":"2019-09-19 10:02:25","updated_at":"2019-09-19 10:02:25","extension_attributes":{"website_ids":[1],"stock_item":{"item_id":1,"product_id":1,"stock_id":1,"qty":12,"is_in_stock":true,"i s_qty_decimal":false,"show_default_notification_message":false,"use_config_min_qty":true,"min_qty":0,"use_config_min_sale_qty":1 ,"min_sale_qty":1,"use_config_max_sale_qty":true,"max_sale_qty":10000,"use_config_backorders":true,"backorders":0,"use_config_ notify_stock_qty":true,"notify_stock_qty":1,"use_config_qty_increments":true,"qty_increments":0,"use_config_enable_qty_inc":true," enable_qty_increments":false,"use_config_manage_stock":true,"manage_stock":true,"low_stock_date":null,"is_decimal_divided":fals e,"stock_status_changed_auto":0}},"product_links":[],"options":[],"media_gallery_entries":[],"tier_prices":[],"custom_attributes":[{"attri bute_code":"pimcore_id","value":"0"},{"attribute_code":"is_active_in_pim","value":"0"},{"attribute_code":"options_container","value": "container2"},{"attribute_code":"msrp_display_actual_price_type","value":"0"},{"attribute_code":"url_key","value":"test-simple"},{"attr ibute_code":"gift_message_available","value":"2"},{"attribute_code":"required_options","value":"0"},{"attribute_code":"has_options", "value":"0"},{"attribute_code":"meta_title","value":"Test Simple"},{"attribute_code":"meta_keyword","value":"Test Simple"},{"attribute_code":"meta_description","value":"Test Simple "},{"attribute_code":"tax_class_id","value":"2"},{"attribute_code":"category_ids","value":[]}]} Rest - simplest possible response is full of unnecessary data
  • 8. What is a GraphQL? Elastic and Resource Effective { "data": { "products": { "items": [ { "price": { "regularPrice": { "amount": { "value": 119 } } }, "sku": "simple_sku", "name": "Test Simple", "image": { "label": "Test Simple" ... GraphQL - you get exactly what you want and nothing more
  • 9. What is a GraphQL? Elastic and Resource Effective 155 1600
  • 10. What is a GraphQL? Centralized ● There is just one endpoint for any request ● Difference is in request’s body structure ● It means that you can prepare just a single request instead of many to get all necessary data for a view
  • 11. REST ApiGraphQL Api What is a GraphQL? Centralized /graphql /products /cms /customer
  • 12. What is a GraphQL? Strongly Typed ● The most basic components of a GraphQL schema are object types, which just represent a kind of object you can fetch from your service, and what fields it has. ● Every field on a GraphQL object type can have zero or more arguments ● A GraphQL object type has a name and fields, but at some point those fields have to resolve to some concrete data. That's where the scalar types come in: they represent the leaves of the query. ● Scalars, enums, lists, interfaces ● We always know what to expect.
  • 13. What is a GraphQL? When to use it? ● Building an API for different devices ● Building an open API ● Working with Model-View layers ● Working with multiple-resources-at-a-time scenarios
  • 14. What is a GraphQL? When not to use it? ● I would not recommend to use it with ERP integrations ● But, to be frankly, it is hard to give a general and true statement on such a topic
  • 15. What is a GraphQL? GraphQL in Magento Available from 2.3.x Main target is PWA
  • 16. What is a GraphQL? GraphQL in Magento - coverage ● module-catalog-graph-ql ● module-bundle-graph-ql ● module-catalog-inventory-graph-ql ● module-catalog-url-rewrite-graph-ql ● module-cms-graph-ql ● module-configurable-product-graph-ql ● module-customer-graph-ql ● module-directory-graph-ql ● module-downloadable-graph-ql ● module-eav-graph-ql ● module-grouped-product-graph-ql ● module-inventory-graph-ql ● module-quote-graph-ql ● module-sales-graph-ql ● module-send-friend-graph-ql ● module-store-graph-ql ● module-swatches-graph-ql ● module-tax-graph-ql ● module-theme-graph-ql ● module-url-rewrite-graph-ql ● module-vault-graph-ql ● module-wee-graph-ql ● module-wishlist-graph-ql