Bird
Raised Fist0
Microservicessystem_design~10 mins

Backend for Frontend (BFF) pattern in Microservices - Interactive Code Practice

Choose your learning style10 modes available

Start learning this pattern below

Jump into concepts and practice - no test required

or
Recommended
Test this pattern10 questions across easy, medium, and hard to know if this pattern is strong
Practice - 5 Tasks
Answer the questions below
1fill in blank
easy

Complete the code to define a BFF service that handles client requests.

Microservices
def bff_service(request):
    response = [1](request)
    return response
Drag options to blanks, or click blank then click option'
Astart_microservice
Bsend_to_database
Chandle_client_request
Dlog_error
Attempts:
3 left
💡 Hint
Common Mistakes
Choosing a function that sends data to the database instead of handling the client request.
2fill in blank
medium

Complete the code to forward a request from BFF to the appropriate microservice.

Microservices
def forward_request_to_service(request):
    service_response = [1](request)
    return service_response
Drag options to blanks, or click blank then click option'
Aprocess_locally
Blog_request
Cignore_request
Dcall_microservice_api
Attempts:
3 left
💡 Hint
Common Mistakes
Choosing to process requests locally when the BFF should delegate to microservices.
3fill in blank
hard

Fix the error in the BFF code that aggregates responses from multiple microservices.

Microservices
def aggregate_responses(responses):
    combined = {}
    for response in responses:
        combined.update([1])
    return combined
Drag options to blanks, or click blank then click option'
Aresponse.items()
Bresponses
Cresponse
Dresponse.keys()
Attempts:
3 left
💡 Hint
Common Mistakes
Passing the whole dictionary without .items(), causing a TypeError.
4fill in blank
hard

Fill both blanks to create a BFF function that filters and transforms data from a microservice.

Microservices
def process_data(data):
    filtered = [item for item in data if item [1] 10]
    transformed = [item[2]2 for item in filtered]
    return transformed
Drag options to blanks, or click blank then click option'
A>
B*
C<
D+
Attempts:
3 left
💡 Hint
Common Mistakes
Using addition instead of multiplication for transformation.
5fill in blank
hard

Fill all three blanks to define a BFF caching mechanism that stores and retrieves data.

Microservices
cache = {}
def get_data(key):
    if key in cache:
        return cache[[1]]
    data = fetch_from_service(key)
    cache[[2]] = data
    return cache[[3]]
Drag options to blanks, or click blank then click option'
Akey
Bdata
Ckey_value
Dcache_key
Attempts:
3 left
💡 Hint
Common Mistakes
Using different variable names for cache keys causing KeyError.

Practice

(1/5)
1. What is the main purpose of the Backend for Frontend (BFF) pattern in microservices architecture?
easy
A. To directly connect frontends to databases without backend logic
B. To replace all microservices with a single monolithic backend
C. To create a backend service tailored specifically for each frontend client
D. To merge all frontend code into one application

Solution

  1. Step 1: Understand BFF role

    BFF acts as a specialized backend that serves the needs of a specific frontend, like mobile or web.
  2. Step 2: Compare with other options

    Options B, C, and D do not describe BFF but other unrelated or incorrect architectures.
  3. Final Answer:

    To create a backend service tailored specifically for each frontend client -> Option C
  4. Quick Check:

    BFF = tailored backend for frontend [OK]
Hint: BFF means backend made just for one frontend [OK]
Common Mistakes:
  • Thinking BFF replaces microservices
  • Confusing BFF with frontend code merging
  • Assuming BFF connects frontend directly to database
2. Which of the following is the correct way to describe the BFF pattern's interaction with microservices?
easy
A. BFF aggregates data from multiple microservices for frontend use
B. BFF sends frontend code to microservices
C. BFF replaces microservices with a single service
D. BFF directly modifies microservices' databases

Solution

  1. Step 1: Identify BFF's role with microservices

    BFF collects and combines data from various microservices to serve frontend needs efficiently.
  2. Step 2: Eliminate incorrect options

    Options A, B, and C describe incorrect or impossible interactions.
  3. Final Answer:

    BFF aggregates data from multiple microservices for frontend use -> Option A
  4. Quick Check:

    BFF aggregates microservices data [OK]
Hint: BFF collects data from many microservices [OK]
Common Mistakes:
  • Assuming BFF changes microservices' databases
  • Thinking BFF replaces microservices
  • Believing BFF sends frontend code to backend
3. Consider a BFF that calls two microservices: User Service and Order Service. If User Service returns {"name": "Alice"} and Order Service returns {"orders": 3}, what will the BFF likely return to the frontend?
medium
A. {"name": "Alice"}
B. {"orders": 3}
C. {"name": "Alice", "orders": 3}
D. {"user": {"name": "Alice"}, "order": {"orders": 3}}

Solution

  1. Step 1: Understand BFF data aggregation

    BFF combines data from multiple microservices into a single response for frontend simplicity.
  2. Step 2: Analyze the combined response

    The best practice is to namespace responses to avoid key collisions, resulting in {"user": {"name": "Alice"}, "order": {"orders": 3}}.
  3. Final Answer:

    {"user": {"name": "Alice"}, "order": {"orders": 3}} -> Option D
  4. Quick Check:

    BFF namespaces microservices data to avoid conflicts [OK]
Hint: BFF namespaces microservices responses [OK]
Common Mistakes:
  • Merging keys without namespaces causing conflicts
  • Returning only one microservice's data
  • Confusing keys or data structure
4. A developer wrote a BFF that calls multiple microservices but the frontend receives slow responses. What is the most likely cause?
medium
A. BFF is making synchronous calls to microservices one after another
B. BFF caches all responses aggressively
C. BFF uses asynchronous calls to microservices
D. BFF compresses responses before sending

Solution

  1. Step 1: Identify cause of slow response

    Making synchronous calls one after another causes delays as each waits for the previous to finish.
  2. Step 2: Evaluate other options

    Caching and compression usually improve speed; asynchronous calls also improve speed.
  3. Final Answer:

    BFF is making synchronous calls to microservices one after another -> Option A
  4. Quick Check:

    Synchronous calls cause slow BFF responses [OK]
Hint: Synchronous calls slow down BFF responses [OK]
Common Mistakes:
  • Assuming caching slows down responses
  • Confusing async with sync calls
  • Ignoring network latency impact
5. You are designing a BFF for a mobile app and a web app. The mobile app needs minimal data for fast loading, while the web app needs detailed data. How should you design your BFFs?
hard
A. Use a single BFF that returns all data to both frontends
B. Create separate BFFs for mobile and web, each tailoring data to its frontend
C. Let frontends call microservices directly to get needed data
D. Create one BFF that returns minimal data for both frontends

Solution

  1. Step 1: Understand frontend needs

    Mobile requires less data for speed; web requires more detailed data.
  2. Step 2: Apply BFF pattern best practice

    Separate BFFs allow tailoring responses to each frontend's needs, improving performance and simplicity.
  3. Final Answer:

    Create separate BFFs for mobile and web, each tailoring data to its frontend -> Option B
  4. Quick Check:

    Separate BFFs tailor data per frontend [OK]
Hint: Use separate BFFs for different frontend needs [OK]
Common Mistakes:
  • Using one BFF for all frontends ignoring needs
  • Letting frontends call microservices directly
  • Returning minimal data to all frontends