﻿{"id":681,"date":"2022-06-15T18:30:41","date_gmt":"2022-06-15T13:00:41","guid":{"rendered":"https:\/\/blogs.infosys.com\/digital-experience\/?p=681"},"modified":"2022-06-15T18:30:41","modified_gmt":"2022-06-15T13:00:41","slug":"backend-for-front-end-architectural-pattern","status":"publish","type":"post","link":"https:\/\/blogs.infosys.com\/digital-experience\/web-ui-ux\/backend-for-front-end-architectural-pattern.html","title":{"rendered":"Backend for Front End-Architectural Pattern"},"content":{"rendered":"<p>A Back end for frontend (BFF) is a new architectural pattern for microservices and domain-driven design. BFF will simplify the communication between\u00a0 the frontend and backend and make front end development easier.<\/p>\n<p><strong>What is a BFF?<\/strong><br \/>\nBFF Architecture is used to improve and enhance user experience. A BFF layer consists of multiple backend services developed to address the needs .Basically it is a server responsible for communicating between services and front end.<\/p>\n<p><strong>Advantages\u00a0<\/strong><\/p>\n<p>It simplifies the communication between the frontend and backend. This is especially valuable when you have an architecture with many microservices as the frontend only needs to communicate with one service that has an interface tailored to the use cases in the frontend.<\/p>\n<p>Simplifies the\u00a0 communicati0n between the front end and backend\u00a0 when you have a architecture with my many microservices.<\/p>\n<p>Multiple front end applications interfaces can call BFF backends in parallel and dedicated backend services respond faster.<\/p>\n<p>Improved latency\u00a0 when your BFF is on the same network\u00a0 and the downstream services ensure low latency between them.<\/p>\n<p>All the\u00a0 business logic and infrastructure details are stored on BFF. Only Front end communicates to BFF.<\/p>\n<p>In BFF we can have server caching logic\u00a0 by caching the headers with cache database like Redis.<\/p>\n<p>BFF backend systems can use any protocol like FTP, SOAP,REST or GraphQL to request data from microservices<\/p>\n<p><strong>Challenges in BFF<\/strong><\/p>\n<p>In BFF, a break down of single service can bring entire BFF system down.<\/p>\n<p>Not Following best deployment practices can lead to unwanted deployments that will lead to slow response time and occupy more resources in the cloud.<\/p>\n<p><strong>Technologies\u00a0 use for the BFF :<\/strong><\/p>\n<p>Express<br \/>\nNestJS<br \/>\nGraphQL\/Apollo<br \/>\nExpress<\/p>\n<p>&nbsp;<\/p>\n<p><strong>Conclusion<\/strong><br \/>\nIn this post, we looked at what a BFF is and how it can benefit your architecture.<br \/>\nBasically, it is most beneficial when you have a microservice architecture and you want to simplify the frontend by only having it communicate with the BFF.<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>A Back end for frontend (BFF) is a new architectural pattern for microservices and [&hellip;]<\/p>\n","protected":false},"author":248,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[2],"tags":[],"coauthors":[88],"class_list":["post-681","post","type-post","status-publish","format-standard","hentry","category-web-ui-ux"],"acf":[],"_links":{"self":[{"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/posts\/681","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/users\/248"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/comments?post=681"}],"version-history":[{"count":4,"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/posts\/681\/revisions"}],"predecessor-version":[{"id":699,"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/posts\/681\/revisions\/699"}],"wp:attachment":[{"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/media?parent=681"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/categories?post=681"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/tags?post=681"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/blogs.infosys.com\/digital-experience\/wp-json\/wp\/v2\/coauthors?post=681"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}