I removed useEffect from my code… and my app got faster ⚡ Yes, seriously. For a long time, I was doing this in React: useEffect(() => { fetchUsers(); }, []); Seemed correct… right? ❌ But in real projects, this caused: • Multiple unnecessary API calls • Data mismatch bugs • Hard-to-control logic 💡 Then I changed my approach: Instead of auto-calling APIs inside useEffect, 👉 I started triggering APIs based on user actions Example: • Search → onChange • Button → onClick ✅ Result: • Better control over API calls • Cleaner component logic • Improved performance (~30% fewer calls) 🔥 What I learned: useEffect is powerful… but overusing it makes your code messy. 💬 Curious: Do you still rely on useEffect for API calls? #ReactJS #FrontendDeveloper #JavaScript #CodingTips #WebDevelopment

🚀 #Day60 #100DaysOfCode – React Todo App Today I built a Todo App using React to understand how state management and component-based UI work in modern web development. 🛠️ Tech Stack Used Frontend: ▪️ React.js ▪️ JavaScript ▪️ HTML ▪️ CSS Concepts Practiced: ▪️ useState Hook ▪️ useEffect Hook ▪️ Event Handling ▪️ Local Storage 📂 Project Overview This Todo App allows users to: ▪️ Add new tasks ▪️ Mark tasks as completed ▪️ Delete tasks ▪️ Clear all tasks ▪️ Tasks remain saved even after page refresh using Local Storage 💡 Key Learning Today I understood how React state works and how we can build interactive applications using reusable components. Building small projects like this helps strengthen the undamentals of React and frontend development. 🔗 GitHub Repository: https://lnkd.in/dBfWK3QH #ReactJS #JavaScript #FrontendDevelopment #WebDevelopment #100DaysOfCode #Day60Complete 🚀

I Finally Understood useEffect… Somehow A few days deeper into React, and things are starting to click, not perfectly, but enough to feel real progress. At first, hooks felt confusing. Especially useEffect. Why does it run? When does it run? Why does it run again? It didn’t make sense… until I stopped overthinking it and started building. Here’s what I’ve worked on so far: -> useState Understanding how state drives UI changes made everything feel more dynamic and controlled. -> useEffect Still not “mastered”, but now I understand how it handles side effects, especially API calls and controlled execution. -> Built small apps Counter app (state updates, re-rendering) Meme generator (API hit using useEffect, dynamic content, event handling) These small builds did more than tutorials ever could, they forced me to connect the dots. The biggest shift? I have stopped trying to memorize React… and started trying to think in React. Still early, but now it feels like direction instead of confusion. Next: Better structure, deeper hooks, and more real-world projects. For developers: How do you clearly decide when to use useEffect, and when not to? #ReactJS #FullStackDeveloper #WebDevelopment #BuildInPublic #JavaScript #LearningJourney

Every developer’s journey starts with HTML — learning how to build the structure. Then comes CSS — giving style and personality. Next is JavaScript — adding logic and interactivity. After that, React — building scalable and dynamic applications. And finally, Next.js — optimizing for performance and production-ready apps. From a simple structure to powerful applications — growth is built step by step. 💻🔥 #WebDevelopment #FrontendJourney #ReactDeveloper #NextJS #CodingLife

Most tutorials teach frontend and backend separately. But the real magic happens when they talk to each other. Today I finally connected my frontend and backend in a real project. Here’s what I worked on today: 🔹 Integrated frontend with backend APIs using Axios 🔹 Learned how CORS works and why browsers block some requests 🔹 Faced multiple CORS errors and debugged them step by step 🔹 Successfully connected everything and built a small image-posting web app Moments like this make development exciting - when everything finally works together. Next step: improving the project and adding more features. Building in public. Learning every day. 🚀 #BuildInPublic #WebDevelopment #FullStackDeveloper #JavaScript #ReactJS #NodeJS #LearningJourney

💡 React useEffect – Small Syntax, Big Impact useEffect is one of the most powerful hooks in React, but subtle changes can completely change your app's behavior: 🔹 useEffect(() => {}) Runs after every render – use when you need something to happen continuously. 🔹 useEffect(() => {}, []) Runs only once on mount – perfect for initializing data or fetching APIs. 🔹 useEffect(() => {}, [state]) Runs only when state changes – ideal for reacting to specific updates without extra renders. ⚡ Small dependency tweaks → big differences in performance and behavior. Mastering useEffect = fewer bugs ✅ cleaner code ✅ faster apps 🚀 #ReactJS #FrontendDevelopment #JavaScript #WebDev #CodingTips #ReactHooks

🚀 Understanding React.useEffect Hook — Simplified! If you're working with React, mastering useEffect is not optional — it’s essential. This single hook controls how your app interacts with the outside world 💡 What is useEffect? It’s a built-in hook that runs after your component renders, helping you manage side effects like: 🔹 API calls 🔹 Event listeners 🔹 Timers 🔹 DOM updates ⚙️ How it works 1️⃣ Runs after initial render 2️⃣ Re-runs when dependencies change 3️⃣ Cleans up before next run or unmount 🧠 Real-world use cases ✔ Fetching data from APIs ✔ Handling WebSocket subscriptions ✔ Managing intervals & timeouts ✔ Updating page title dynamically 🔥 Best Practices (Most developers miss this!) ✅ Always use dependency array correctly ✅ Include all dependencies (avoid bugs) ✅ Cleanup side effects to prevent memory leaks ✅ Split logic into multiple useEffects ❌ Don’t overuse useEffect unnecessarily 💬 Pro Insight: A clean useEffect = Better performance + Fewer bugs + Scalable code 📌 Save this post & follow for more practical frontend insights! #ReactJS #useEffect #FrontendDevelopment #JavaScript #WebDevelopment #ReactHooks #CodingTips #SoftwareEngineering #FrontendEngineer #FullStackDeveloper #LearnReact #100DaysOfCode 🚀

🚀 Just built a full-featured Todo App in React! ✅ Add, Edit & Update tasks ✅ Mark tasks as Complete / Pending ✅ Filter by All / Completed / Pending ✅ Persistent data with LocalStorage ✅ Clean UI with counters & interactive buttons This project helped me strengthen my React skills, state management, and UI handling. 🌟 Source Code: 👉https://lnkd.in/dSRsWdeM Muhammad Osama Saylani Mass I.T Training (S.M.I.T) #ReactJS #WebDevelopment #JavaScript #FrontendDevelopment #CodingJourney #ProjectShowcase #TodoApp

Day 15 #100DaysOfCode 💻 Today I learned how to set up React in VS Code and understood the basic idea of React Components. First, I installed React using Vite and ran the project in VS Code. Then I learned that in React, a function can act as a component and can be used like an HTML tag. Example: function Header() { return <h1>Hello React</h1>; } function App() { return ( <div> <Header /> </div> ); } This means React allows us to build reusable UI pieces using functions. Small step, but an important start in my React journey 🚀 #ReactJS #JavaScript #WebDevelopment #FrontendDevelopment #CodingJourney #Akbiplob

SpendWise — Smart Personal Expense Tracker Excited to share a project I recently built to improve my frontend development skills and gain more hands-on experience with modern React and Next.js. Tech Stack ▸ Next.js 14 (App Router) ▸ TypeScript ▸ Tailwind CSS ▸ localStorage ▸ Custom React Hooks Core Features ▸ Add & remove categorized expenses ▸ Monthly budget management with real-time progress tracking ▸ Category-wise spending insights ▸ Clean, responsive UI with smooth interactions Key Takeaways → Hands-on experience with App Router & file-based routing → Clear understanding of Server vs Client components → Stronger TypeScript fundamentals (interfaces & union types) → Writing optimized custom hooks using useEffect and useCallback Every project teaches something new, this one strengthened both my fundamentals and confidence in building production-ready apps. Live Demo: https://lnkd.in/eGC6iHnh GitHub: https://lnkd.in/e9_qFHa7 #NextJS #ReactJS #TypeScript #FrontendDevelopment #WebDev #BuildInPublic #JavaScript