SECURITY FIRST
Never store API keys in the front-end. Use Environment variables (.env) for build time keys but sensitive keys should stay on a backend proxy.
Use HTTPS: never communicate over http.
Sanitize Inputs: Always validate data coming from the API before rendering it to prevent XSS(cross-Site Scripting).
FOR PERFORMANCE AND USER EXPERIENCE
Duplication: Don't fire the same request twice if two components need the same data at the same time.Libraries like SWR do this automatically.
To reduced perceived latency, use skeleton screens instead of generic loading spinners.
Use Error boundaries to catch API failures gracefully without crashing the entire app.
FOR CODE ORGANIZATION
Centralize API calls- create an api/ folder. Never call fetch directly inside a component's useEffect.
Use Typescript to define interfaces for API response. This prevents undefined errors.
Top comments (0)