Gaurav Tiwari’s Post

Frontend Interview Experience – A Small but Interesting Redux Debate Recently attended a frontend interview where the discussion covered HTML, CSS, JavaScript, React, GraphQL, and Microfrontends. During the React round, I was asked about the core pillars of Redux. I explained: • Store – holds the application state • Actions – plain JavaScript objects describing what happened • Reducers – pure functions that return the new state • Dispatch – sends actions to the store • Selectors – used to read data from the store Then came an interesting moment The interviewer mentioned that "Actions are functions, not objects." I respectfully shared my understanding that: In Redux, an Action is a plain JavaScript object with a mandatory type field. After the interview, I double-checked — and yes, Redux defines actions as plain objects. The likely confusion: What the interviewer referred to was Action Creators, which are functions that return action objects. Example: const addTodo = (text) => ({ type: "ADD_TODO", payload: text }); Key takeaway: • Action = Object • Action Creator = Function 🎯 Interviews are not just about right or wrong — they’re about clarity of concepts and communication. Curious to know — have you ever faced a situation where both perspectives were technically correct but misunderstood in interviews? #Frontend #React #Redux #JavaScript #InterviewExperience #Learning

💡 React Interview Questions I Prepared as a Developer While preparing for interviews, I compiled a list of important React questions into a PDF 📄 Instead of keeping it to myself, I thought of sharing a quick summary here 👇 🔹 What is React? A JavaScript library for building UI using reusable components. 🔹 What is Virtual DOM? React creates a virtual copy of the DOM and updates only the changed parts → faster performance. 🔹 What are Hooks? Functions like "useState", "useEffect" that let you use state and lifecycle features in functional components. 🔹 What is State vs Props? State → managed inside component Props → passed from parent to child 🔹 What is useEffect? Used for side effects like API calls, subscriptions, timers. 🔹 What is conditional rendering? Displaying UI based on conditions (if/else, ternary). 🔹 What is key in React? Unique identifier for list items → helps React optimize rendering. 🔹 What is lifting state up? Sharing state between components by moving it to a common parent. --- 📄 I’ve attached my full PDF with more questions and explanations. Feel free to check it out! #ReactJS #FrontendDevelopment #WebDevelopment #MERNStack #InterviewPrep #LearnToCode

Top 10 React Hooks Interview Questions 1. What are the benefits of using Hooks in React? 2. What are the rules of React Hooks? 3. What is the difference between useEffect and useLayoutEffect in React? 4. What does the dependency array of useEffect affect? 5. What is the useRef hook and when should you use it? 6. What is useCallback? 7. What is the useMemo hook in React and when should it be used? 8. What is the useReducer hook in React and when should it be used? 9. What is the useId hook in React and when should it be used? 10. How to create and use Custom Hooks in React? Connect/Follow Tarun Kumar for more tech content and interview prep #ReactJS #FrontendDevelopment #JavaScript #WebDevelopment #ReactHooks #CodingInterview

🚀 React Interview Question Breakdown – Can You Spot the Issues? Recently, I came across some interesting React interview questions focused on debugging and code optimization. Sharing them here 👇 🔍 Question 1: Find the issues and fix them const items = useSelector(state => state.items); const [filtered, setFiltered] = useState(items); useEffect(() => { setFiltered(items.filter(i => i.name.includes(search))); }, []); 🔍 Question 2: Find the issues and fix them const handleLike = async () => { const newCount = likes + 1; setLikes(newCount); await api.updateLikes(newCount); if (condition) { setLikes(likes + 1); // Review point } }; #ReactJS #FrontendDevelopment #JavaScript #WebDevelopment #InterviewQuestions #ReactHooks

🚀 Top 50 React Interview Questions – Must Prepare! 🔹 Preparing for a React interview? Focus on the fundamentals + real-world concepts: • What is React & how it works (Virtual DOM) • Functional vs Class components • Hooks (useState, useEffect, useContext) • Props vs State • Controlled vs Uncontrolled components • Lifecycle methods • Conditional rendering & lists • Forms & event handling 🔹 Level up with advanced topics recruiters love: • useMemo, useCallback & performance optimization • Context API vs Redux • Code splitting & lazy loading • Custom hooks • Error boundaries • React Router & navigation • API handling (fetch/axios) • Testing basics (Jest) 🔹 Pro tip: Don’t just memorize—build projects! • Create real apps • Explain your decisions • Be confident with debugging 💡 Master these, and you’re interview-ready! Source:- Respected owner ✨ Follow Asif Ali Quraishi ♞for web dev insights. #ReactJS #WebDevelopment #FrontendDeveloper #CodingInterview #JavaScript

💼 Top 5 Frontend Interview Questions I Got Here are some questions I recently came across as a Frontend Developer 👇 1️⃣ What is the difference between == and === in JavaScript? 2️⃣ How does Angular change detection work? 3️⃣ What is trackBy in ngFor and why is it important? 4️⃣ Difference between Promises and Observables? 5️⃣ How do you improve performance in a frontend application? These questions made me realize how important fundamentals are 👀 Still learning and improving every day 🚀 What’s a question you’ve been asked in interviews? #FrontendDeveloper #Angular #JavaScript #InterviewPrep #WebDevelopment

🧵 Day 1 of 40 — React System Design Series I've used React for 3 years. Spent 2 years in Lit.js. Now back to React for senior interviews. And I realized — I never actually knew how React works under the hood. Today I broke it down properly: → What the Virtual DOM actually is (it's just a JS object) → How reconciliation and diffing work step by step → What actually triggers a re-render (hint: it's not just props) → The one thing React 18 changed that interviewers love to ask about Full breakdown 👇 https://lnkd.in/g79jJhYj #ReactJS #SystemDesign #Frontend #LearningInPublic #WebDevelopment

💡 **Daily React/JavaScript Interview Tip** Debouncing vs Throttling isn’t just theory—it’s about **controlling performance under rapid user input**. 👉 Weak answer: “Debounce delays execution, throttle limits execution.” ✅ Stronger answer: “Debouncing ensures a function only runs after a pause in events—perfect for search inputs. Throttling ensures a function runs at a fixed interval—useful for scroll or resize events where continuous execution would hurt performance.” ⚡ Key difference: * Debounce → executes **after user stops** triggering events * Throttle → executes **at a controlled rate** during events 🧠 Real-world examples: * Debounce → API calls on search input (avoid spamming requests) * Throttle → scroll tracking, window resize (maintain performance) 📌 Tip: In interviews, always connect this to **performance optimization and user experience**, not just definitions. #JavaScript #ReactJS #WebPerformance #FrontendDevelopment #TechInterviews 🔁 Repost if you find this insightful

❓ React Interview Question: What is useEffect? ✅ Answer: useEffect is a React Hook used to handle side effects in functional components. Side effects include operations like API calls, subscriptions, timers, and DOM updates. It runs after the component renders and can be controlled using a dependency array to decide when it should execute. 💡 Why we use useEffect? React components are meant to be pure, but real-world applications need to: --> fetch data from APIs --> set up event listeners --> work with timers useEffect allows us to perform these operations safely after rendering. #ReactJS #FrontendDevelopment #WebDevelopment #JavaScript #SoftwareEngineering #InterviewPreparation #CodingInterview

🚀 Top 50 React Interview Questions – Must Prepare! 🔹 Preparing for a React interview? Focus on the fundamentals + real-world concepts: • What is React & how it works (Virtual DOM) • Functional vs Class components • Hooks (useState, useEffect, useContext) • Props vs State • Controlled vs Uncontrolled components • Lifecycle methods • Conditional rendering & lists • Forms & event handling 🔹 Level up with advanced topics recruiters love: • useMemo, useCallback & performance optimization • Context API vs Redux • Code splitting & lazy loading • Custom hooks • Error boundaries • React Router & navigation • API handling (fetch/axios) • Testing basics (Jest) 🔹 Pro tip: Don’t just memorize—build projects! • Create real apps • Explain your decisions • Be confident with debugging 💡 Master these, and you’re interview-ready! Source:- Respected owner ✨ Learn more from w3schools.com ✨ #ReactJS #WebDevelopment #FrontendDeveloper #CodingInterview #JavaScript