03-frontend

Security

03-frontend/security

Security

Overview

Frontend security is about protecting users, sessions, and data handling at the client boundary.


Why It Matters

Frontend mistakes can expose tokens, leak data, or weaken trust even if the backend is secure.


Core Concepts

  • Do not trust client input.
  • Treat sensitive data carefully in memory and logs.
  • Understand the security implications of redirects, auth, and third-party scripts.

Mental Models

Think about what the attacker can see, modify, or replay from the browser.


Best Practices

  • Keep secrets off the client when possible.
  • Sanitize or escape untrusted content.
  • Review dependencies and script sources.

Common Mistakes

  • Putting secrets in frontend code.
  • Trusting client-side validation alone.
  • Overlooking XSS, CSRF, or open redirect issues.

Trade-offs

More security checks can slow development slightly, but the cost of a leak or exploit is much higher.


Decision Framework

RiskResponse
Sensitive tokenKeep server-side if possible
User-generated contentSanitize and escape
Third-party scriptReview and limit scope

Examples

  • Never expose API secrets in client-side code.
  • Validate redirect targets to avoid open redirect bugs.

Checklists

  • Are secrets excluded from the client bundle?
  • Are untrusted inputs sanitized or escaped?
  • Are auth and redirect flows reviewed for abuse?

Senior Engineer Notes

Senior engineers assume the browser is not a trusted environment. They minimize exposure instead of trying to patch everything after the fact.


Further Reading