LWC → Apex → REST API Architecture
By the end of this lesson, you'll be able to:
- Explain why LWC cannot call an external REST API directly
- Describe the standard LWC → Apex → external system architecture
- Understand why this layering keeps credentials out of client-side code
Prerequisites: Module 16: "Scalable Component Design and Code Review Standards"
Why LWC Can't Call External APIs Directly
Module 7's first lesson listed "a callout to an external HTTP API" as a clear signal that Apex is required, not LDS. This is enforced deliberately — Lightning Web Security (Module 12) and the platform's overall security model restrict direct external network calls from client-side JavaScript in a component. A browser is fundamentally not a trustworthy place to hold API credentials anyway, so the platform simply doesn't allow this path to exist.
The Standard Architecture
LWC (UI)
→ Apex (@AuraEnabled method)
→ HTTP callout to the external system
← Response mapped into a wrapper/DTO (Module 7)
← Returned to LWCThe component calls an @AuraEnabled Apex method exactly as it would for any other server-side operation (Module 7); that Apex method performs the actual HTTP callout, then maps the raw response into a clean wrapper class before returning it — the same DTO pattern already used throughout this course.
Why This Layering Makes Sense
This keeps credentials and endpoints entirely out of client-side code — a browser could never be trusted with a raw API secret regardless of platform restrictions. It also means the same Controller/Service/Selector-style layering from Module 16 applies naturally to an integration: a thin Controller, a Service that orchestrates the callout and response mapping, isolated from the LWC-facing contract.
Exercise
Explain, as a comment, why even without any platform restriction, having a browser hold a raw third-party API secret would be a bad idea.
Show hint
Think about who can inspect code running in a browser.
Exercise
Challenge: describe, as a comment, the three-step path data takes from an external API back to a rendered LWC component.
Show hint
Follow the architecture diagram in reverse.
LWC → Apex → REST API Architecture Quiz
My Notes
Log in to keep private notes on this lesson.
Questions about this lesson
No questions yet — be the first to ask.
Log in to ask a question about this lesson.
Summary
A component can never call an external API directly — every integration routes through Apex, which is exactly the "signal you need Apex" Module 7 first flagged, now explored in full.