React setState in useEffect causes infinite loop

Tricky React Interview Question 🤔 Most developers get confused here… Question: What will happen if you update state directly in React? Example: const [count, setCount] = useState(0); count = count + 1; ❌ setCount(count + 1); ✅ Why is the first one wrong? Because React does NOT detect direct state changes. React only re-renders when you use the state setter function. Wrong way ❌ count = count + 1 Correct way ✅ setCount(count + 1) Reason: React tracks state updates using the setter function. If you change value directly, UI will not update correctly. This is one of the most common mistakes in React interviews. Tip: Always use setter function returned by useState. More React interview questions coming… 🚀 #ReactJS #FrontendDeveloper #JavaScript #WebDevelopment #CodingInterview #ReactInterview #NextJS #SoftwareDeveloper #UIDeveloper

Great resource for anyone preparing for React interviews. I’m currently learning and this gives me a clear idea of what to focus on next.

Interview preparation isn't just for beginners. Even as a Lead, I find that revisiting the core internals—like the React Fiber architecture and Memoization patterns—is essential for building high-performance UIs at scale. This guide looks like a fantastic structured roadmap for anyone in the React ecosystem. As I always say to beginners: 'If you can't explain it simply, you don't understand it well enough.' Checking this out today! 💻🔥 #ReactJS #FrontendEngineering #TechLeadership #InterviewPrep

❓ React Interview Question: Difference between State and Props? 💡 What are Props? Props are inputs passed from parent to child components - They are read-only (immutable) - Used to make components reusable function Greeting(props) { return <h1>Hello {props.name}</h1>; } 💡 What is State? State is data managed inside a component - It can change over time (mutable) - Used for dynamic UI updates const [count, setCount] = useState(0); 💡 Key Differences props → Passed from parent, cannot be modified state → Managed inside component, can be updated props → Used for communication between components state → Used for handling dynamic data Follow Tarun Kumar for tech content, coding tips, and interview prep 🚀 #ReactJS #ReactInterview #FrontendInterview #JavaScript #CodingInterview #InterviewPrep #WebDevelopment #Developers #TechContent

** Technical Interview Question ** Today I worked on a common but important interview question: 🔍 Find the first non-repeating element in an array 👉 Example: [4, 5, 1, 2, 0, 4] 👉 Output: 5 💡 My Approach: 1. First, I counted how many times each element appears 2. Then, I traversed the original array to find the first element that appears only once ⚡ Key Insights: Order matters — that’s why iterating over the original array is important Using a frequency map makes the solution efficient Time Complexity: O(n) Space Complexity: O(n) 🎯 Practicing these types of problems really helps in improving logic building and interview confidence, especially for Frontend / MERN Stack roles. Consistency is the key 🔥 #JavaScript #CodingInterview #ProblemSolving #MERNStack #FrontendDeveloper #ReactJS

If you’re preparing for React interviews, don’t skip these 👇 ⚡ useEffect (most misunderstood hook) – dependency array – cleanup function – when NOT to use it ⚡ State management – useState vs useReducer – when to lift state up ⚡ Re-rendering – why components re-render – how to prevent unnecessary renders ⚡ Performance basics – memoization (React.memo, useMemo, useCallback) – lazy loading ⚡ API handling – loading states – error handling – avoiding multiple calls Most interviews don’t ask advanced tricks. They test how well you understand basics. 💡 Go deep, not wide. 💬 Which topic do you find most confusing? #ReactJS #FrontendDevelopment #JavaScript #WebDevelopment #CodingInterview #GauravTiwari

🚨 Most Developers Get This Wrong in React Interviews 👉 Why does a component re-render even when nothing changed? If you can’t confidently answer this… You’re not ready for product-based interviews yet. 💡 React is not just about writing components. It’s about understanding: ⚡ How rendering works ⚡ Why performance issues happen ⚡ How to control re-renders 🔥 Real interview scenarios companies ask: • Why does a child re-render when parent updates? • Why do inline functions cause re-renders? • When does React.memo fail? • useMemo vs useCallback — real difference? • Why does useEffect run twice in React 18? ❌ Most people memorize hooks ✅ Top candidates understand behavior 📄 So I created: 👉 React Re-render & Performance – 30 Scenario-Based Questions This is NOT theory. These are the actual patterns interviewers test. 💬 Comment REACT and I’ll share the PDF #reactjs #frontenddeveloper #javascript #codinginterview #webdevelopment #softwareengineer #reactperformance #learnincode #techcareer #developers #react18 #programming 🚀

React.js Interview Prep Mode ON! Today, I focused on one of the most commonly asked interview topics in React Props vs State Let’s break it down with a simple coding example import React, { useState } from "react"; // Child Component function CounterDisplay(props) { return <h2>Count: {props.count}</h2>; } // Parent Component function CounterApp() { const [count, setCount] = useState(0); return ( <div> <CounterDisplay count={count} /> <button onClick={() => setCount(count + 1)}> Increment </button> </div> ); } export default CounterApp; Interview Insights: - Props → Read-only, passed from parent to child - State → Managed inside component, can change over time - useState Hook → Most important hook for managing state in functional components Most Asked Interview Questions: - Difference between Props and State? - Can we modify props inside a component? ( No) - When to use state vs props? Key Takeaway: Understanding data flow (Unidirectional Flow) is to cracking React interviews. Consistency + Interview Focus = Selection #ReactJS #FrontendDevelopment #InterviewPreparation #100DaysOfCode #JavaScript #WebDevelopment

🚀 Just Built Something Powerful for React Interview Prep! I noticed most React interview prep content is either too basic or repetitive… so I decided to fix that. I’ve created a PDF with 30 unique React.js output-based questions that actually test real understanding — not just theory. ✅ Covers real-world concepts • useState (async updates & batching) • useEffect (execution order & dependencies) • Closures & stale state • Memoization (useMemo, useCallback, React.memo) • Keys & reconciliation • Rendering behavior & performance 💡 Each question includes: ✔ Clean, readable code ✔ Exact output ✔ Clear explanation (why it works that way) This is the kind of practice that helps you think like React, not just memorize it. 📌 Perfect for: • Frontend developers preparing for product-based companies • Developers stuck at “I know React but can’t crack interviews” stage If you want the PDF 👉 Comment “React” and I’ll share it with you. #ReactJS #FrontendDevelopment #JavaScript #WebDevelopment #InterviewPreparation #CodingInterview #ReactDeveloper #LearnToCode

🚀 React Revision Notes for Interviews (PDF) After sharing my JavaScript notes, I created a React revision PDF to quickly revise important concepts before interviews. 📌 Topics Covered: ✔️ JSX & Components ✔️ Props vs State ✔️ Hooks (useState, useEffect, useMemo, useCallback) ✔️ React Router (Link, NavLink, useNavigate, Protected Routes) ✔️ Performance Optimization ✔️ Lifecycle & Virtual DOM 💡 Designed for quick revision (especially before interviews) 📄 Comment “REACT” and I’ll share the PDF OR Download here: https://lnkd.in/ddURrNSQ #reactjs #javascript #frontenddeveloper #webdevelopment #interviewprep #coding