Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
BFF com GraphQL e NodeJS
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Tais Duarte
August 04, 2024
Technology
41
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
BFF com GraphQL e NodeJS
Tais Duarte
August 04, 2024
More Decks by Tais Duarte
See All by Tais Duarte
Cuide bem do seu front-end: boas práticas para um código saudável
taisreisdev67
0
14
Monitoramento e Observabilidade no Frontend
taisreisdev67
0
140
Como tornar minha aplicação observável?
taisreisdev67
0
41
Construindo um BFF com PHP
taisreisdev67
0
47
GraphQL: A QUERY LANGUAGE FOR YOUR API
taisreisdev67
0
45
BOOTSTAP 4 TUDO O QUE VOCÊ PRECISA SABER
taisreisdev67
0
27
DESMISTIFICANDO O JAVASCRIPT
taisreisdev67
0
38
Other Decks in Technology
See All in Technology
⾮構造化データを価値に変える AI エージェント基盤とその組織
ivry_presentationmaterials
0
190
AI × アーキテクト 第1・2章|生成AIの課題とアーキテクトの素養
daidaidai
0
170
コンテナ運用におけるネットワーク・コンテナコストの削減方法/How to Reduce Network and Container Costs in Container Operations
masakiokuda
1
200
Metadata - Section 1: HTML Basics
mohab1
0
120
「Docker Desktop不要の時代」は 来たのか?
ueponx
0
770
OptunaHub: ブラックボックス最適化のためのプラットフォーム
pfn
PRO
0
140
アウトプット初心者、半年間のふりかえり
4o1sobblue
0
430
スキマバイトという雇用形態は存在しないので、雇用期間1日のアルバイト契約を事業者とワーカーが結ぶ手続きを支えるのがタイミーなんです
akitoshiga
0
200
Tofu-Controller lightning talk @ Containerday 2026
gionn
0
110
実践!Cloud Run ハンズオン!! / Cloud Run handson
y0hgi
2
280
Kiro Crewをはじめよう
kizawa2020
1
160
Refining Active Record
shugo
0
160
Featured
See All Featured
The Illustrated Children's Guide to Kubernetes
chrisshort
51
53k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
28
3.7k
Neural Spatial Audio Processing for Sound Field Analysis and Control
skoyamalab
0
570
エンジニアに許された特別な時間の終わり
watany
109
250k
Automating Front-end Workflow
addyosmani
1369
210k
The Illustrated Guide to Node.js - THAT Conference 2024
reverentgeek
1
570
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
helenjbeal
2
360
Exploring the relationship between traditional SERPs and Gen AI search
raygrieselhuber
PRO
4
4.4k
Fireside Chat
paigeccino
43
4.1k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Leveraging Curiosity to Care for An Aging Population
cassininazir
1
540
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
minecr
1
440
Transcript
BFF com GraphQL e NodeJS FRONTIN Elas Programam 2023
+10 anos como Desenvolvedora Graduada em Jogos Digitais Sênior Software
Engineer na Creditas Apoiadora do PHPWomenBR Esposa do Valter e Mãe do Joaquim sou a Tais Prazer, @taisreis67
BFF? O que é De onde veio, onde vive e
qual problema veio resolver? 🤔
Best Friends Forever
Best Friends Forever
O Backend For Frontend, ou BFF, é um padrão de
arquitetura que tem como objetivo facilitar a comunicação entre aplicações clientes e o backend. Ok, mas para o quê e como eu uso isso?
Monolito API Web
Temos uma comunicação direta entre uma API e um cliente.
Tudo bem por enquanto
Micro Serviços User API Web Books API Auth API
Temos uma comunicação direta, mas agora entre um cliente e
3 micro serviços. Agora o cliente precisar fazer várias requisições para compor uma página
E se tivermos mais clientes? User API Web Books API
Auth API Mobile Parceiro
É aqui que o BFF nos ajuda 😉 Temos 3
clientes se comunicando com os micro serviços e os clientes Parceiro e Mobile precisa de dados e comportamentos diferentes dos outros.
User API Web Books API Auth API Mobile Parceiro Backend
For Frontend BFF BFF BFF
Agora os clientes terão autonomia para poder utilizar os micro
serviços de acordo com o que eles precisam independente de outros clientes. Cada cliente agora tem seu backend personalizado 😉
Porém como desvantagens temos mais aplicações para dar manutenção, monitorar,
fazer o deploy… Devemos analisar se temos como manter 🤔
um BFF? Como criar Vamos ver um exemplo de BFF
com GraphQL e NodeJS
Quais tecnologias vamos usar?
É uma Query Language para APIs que permite com que
o cliente peça exatamente os dados que ele precisa. O que é GraphQL? fonte: graphql.org
É um servidor GraphQL que nos dá uma série de
ferramentas que nos ajuda a trabalhar com o GraphQL. O que é Apollo Server? fonte: apollographql.com
Nosso Service Web Nosso exemplo de caso de uso Nosso
BFF
Filme Produtora Como fica a nossa estrutura? Nome Site Id
Titulo
Bora ver o código!
Referências e para saber mais https://philcalcado.com/2015/09/18/the_back_end_for_front_end_pattern_bff.html https://philcalcado.com/2019/07/12/some_thoughts_graphql_bff.html https://medium.com/jeitosanar/backend-for-frontend-uma-estratégia-sob- demanda-para-a-entrega-de-microsserviços-2f12d4cb9e3f https://graphql.org/learn/
https://www.apollographql.com/docs/apollo-server/ https://developers.themoviedb.org/3/getting-started/introduction
Dúvidas? @taisreis67
Obrigada @taisreis67 Qualquer dúvida podem me procurar!