🔐 What security features should be taken while designing APIs?
- Authentication & Authorization: Use OAuth 2.0, JWTs, or API keys properly.
- Rate Limiting & Throttling: Protect from abuse (e.g., DDoS).
- Input Validation & Sanitization: Prevent SQL Injection, XSS, etc.
- HTTPS Only: Always encrypt data in transit.
- CORS Configuration: Only allow trusted origins.
- Avoid Sensitive Data in URLs: Use headers/body instead.
- Logging & Monitoring: Track suspicious activity.
-
Use Secure Headers: Like
Content-Security-Policy
,X-Frame-Options
, etc.
💠 What is API throttling?
API Throttling is the process of limiting the number of API requests a user/client can make within a specific time frame to prevent abuse and manage load.
Example:
Only allow 100 requests per minute per user.
⚡ How to improve the performance in React Application?
-
Code-splitting using
React.lazy
+Suspense
-
Memoization: Use
React.memo
,useMemo
, anduseCallback
- Avoid unnecessary re-renders
-
Virtualization: Libraries like
react-window
for large lists - Lazy loading images/components
- Efficient state management: Don’t overuse global state
- Use production builds (
npm run build
)
⏱️ What is debouncing in React?
Debouncing is a performance optimization technique where a function (e.g., API call) is delayed until a specified time has passed since the last time it was invoked.
Example:
When typing in a search input, only call API after the user stops typing for, say, 500ms.
Use:
import debounce from 'lodash.debounce';
💾 What if in a React app we need to develop a feature of auto-save the inputs of a form?
You can use:
useEffect
with debounce-
localStorage
or API POST inside the debounce - Change tracking to only save when data changes
Example logic:
useEffect(() => {
const timeout = setTimeout(() => {
saveData(formData); // API call
}, 1000);
return () => clearTimeout(timeout);
}, [formData]);
📊 Which React library is used to represent JSON data into charts/graphs for better visualization and performance?
- Recharts (based on D3.js, best for React)
- Victory
- Chart.js with react-chartjs-2
- Nivo
- Highcharts (commercial)
For performance & customization, Recharts is often preferred.
📣 If you have to inform backend developers about some APIs are failing, how will you do that?
- Use error logging tools (Sentry, LogRocket)
- Maintain a shared Slack/Discord/Notion channel
- Document API issue with:
- Endpoint name
- Expected vs. actual response
- Status code
- Reproduction steps
- Screenshots (if needed)
- Bonus: Automate alerts using tools like Postman Monitors, Pingdom, PagerDuty
🧰 Which tool is used to improve code standards in React to show warnings?
- ESLint (with React-specific plugins)
- Prettier (for formatting consistency)
- Stylelint (for CSS-in-JS or SCSS)
These show warnings during development and can be integrated with CI/CD.
🧪 What are the unit testing tools used in React Application?
- Jest (test runner + assertion)
- React Testing Library (focuses on user interactions)
- Enzyme (older, less recommended now)
- Cypress (for E2E testing, but also supports component tests)
🧱 How do you handle API test case scenarios in React Application?
-
Mock APIs using
msw
(Mock Service Worker) - Use
jest
to spy on fetch/axios - Test cases include:
- Successful API call
- Loading state
- Error handling (network or validation)
- Retry logic (if any)
- Response rendering
⏳ Give me an estimation of completing an auto-save functionality with unit testing?
Let’s break it down:
Task | Time Estimate |
---|---|
Form design & state setup | 1-2 hours |
Debounced auto-save logic | 2 hours |
API integration | 1 hour |
Unit tests (Jest + RTL) | 2-3 hours |
Bug fixing + polish | 1 hour |
Total | 7–9 hours (1 working day) |
☁️ Which cloud is used in your app development?
Depends on the stack. Common ones:
- Firebase (Firestore, Auth, Storage) for serverless apps
- AWS (EC2, Lambda, RDS, S3, etc.)
- Vercel (for hosting Next.js apps)
- GCP or Azure for enterprise apps
You can mention the specific services you're using in your project if you want it to be more tailored.
If you’d like, I can help you prep this as a doc or interview cheat sheet!