Day 27 of my JavaScript journey 🚀 Built a GitHub User Finder using HTML, CSS, and JavaScript, powered by the GitHub API. This application allows users to search for any GitHub profile and view detailed information in real-time. Features: 🔍 Search GitHub users dynamically 👤 Display profile details (avatar, bio, followers, following) 📦 View latest repositories with descriptions 🌙 Responsive UI with dark theme ⚠️ Error handling for invalid users This project helped me strengthen my understanding of API integration, asynchronous JavaScript, and building real-world applications with dynamic data. 🔗 Live Demo: https://lnkd.in/gps5WPFQ 💻 GitHub Repo: https://lnkd.in/gN9jiFtX Focused on building projects that are practical, interactive, and closer to real-world applications. 💻 #JavaScript #WebDevelopment #FrontendDeveloper #100DaysOfCode #CodingJourney #API #GitHub

Installs one npm package node_modules: “We brought friends… and their friends too.” 😂 This is why understanding dependencies is so important. As developers, it’s not just about writing code but also managing what runs behind it. #webdevloper #fullstackdeveloper #developer #javascript #node.js

🧠 Building My Own Mini React (from scratch) 🚀 Today I went beyond just using React — I tried to understand how it actually works under the hood. So I built a custom version of React’s rendering system using plain JavaScript. Instead of relying on the library, I recreated the core idea behind it: ✨ A virtual “React element” object ✨ A custom render function ✨ DOM manipulation using createElement, setAttribute, and appendChild 💡 What I built: A simple React-like object: { type: "a", props: { href: "https://google.com", target: "_blank" }, children: "Click me to visit Google" } And a custom renderer that converts it into real DOM elements. 🔥 Key Takeaways: ✔ React is basically an abstraction over DOM manipulation ✔ JSX ultimately becomes React.createElement() ✔ Virtual DOM starts from simple JavaScript objects ✔ Frameworks are just layers over core fundamentals 🧩 What I realized: When you strip React down, it’s just: 👉 JavaScript objects + functions + DOM APIs This made React feel far less “magical” and much more logical. 🚀 What’s next: I’m planning to take this further by adding: Component support Re-rendering logic 🔗 GitHub Repo: https://lnkd.in/ggFVNmuC 💬 Would love your feedback! Have you ever tried building something like this from scratch? Or do you think this is the best way to truly learn frameworks? #React #JavaScript #WebDevelopment #Frontend #LearningInPublic #100DaysOfCode #GitHub

Spent today diving deep into some of the most crucial concepts in JavaScript and frontend development. Building interactive applications requires a solid understanding of how the browser manages events and data, and today's session covered exactly that. Here are the key takeaways from today's learning: 𝐇𝐢𝐠𝐡𝐞𝐫-𝐎𝐫𝐝𝐞𝐫 𝐅𝐮𝐧𝐜𝐭𝐢𝐨𝐧𝐬: Explored how to write cleaner, more declarative code using functions that accept other functions as arguments or return them (like map, filter, and reduce). 𝐅𝐨𝐫𝐦 𝐇𝐚𝐧𝐝𝐥𝐢𝐧𝐠: Looked into best practices for capturing, validating, and managing user inputs efficiently within the DOM. 𝐃𝐎𝐌 𝐄𝐯𝐞𝐧𝐭 𝐇𝐚𝐧𝐝𝐥𝐢𝐧𝐠: Broke down the mechanics of user interactions and how the browser listens for and responds to them. 𝐄𝐯𝐞𝐧𝐭 𝐏𝐫𝐨𝐩𝐚𝐠𝐚𝐭𝐢𝐨𝐧 (𝐁𝐮𝐛𝐛𝐥𝐢𝐧𝐠 & 𝐂𝐚𝐩𝐭𝐮𝐫𝐢𝐧𝐠): Mapped out the exact journey of an event—from the window down to the target element (capturing) and back up the DOM tree (bubbling). 𝐄𝐯𝐞𝐧𝐭 𝐃𝐞𝐥𝐞𝐠𝐚𝐭𝐢𝐨𝐧: Learned how to optimize performance and write cleaner code by attaching a single event listener to a parent element rather than binding multiple listeners to individual child nodes. Mastering these core mechanics is definitely a game-changer for writing scalable and performant frontend code. Looking forward to implementing these patterns in my upcoming web projects! #JavaScript #FrontendDevelopment #WebDevelopment #DOM #SoftwareEngineering #CodingJourney

📦 Vite is all you need VoidZero announced Vite+, an all-in-one development platform for the JavaScript ecosystem. It brings its Vite bundler and integrate with other common tools common in JavaScript ecosystem. - Oxlint: ESLint compatible linter written in Rust - Oxfmt: Prettier compatible formatter written in Rust - vp env: Nodejs version manager replacing nvm Architecturally it has replaced Rollup bundler with their rust based implementation called Rolldown #Vite #SoftwareDevelopment #Javascript https://lnkd.in/egNg3M7t

🚀 GitHub Performance Finder Project Excited to share my latest project — a GitHub Performance Finder built using HTML, CSS, and JavaScript. 🔍 This tool helps analyze a GitHub profile by displaying: • 📦 Repository Count • ⭐ Top Repository • 👥 Followers & Following • 📊 Overall profile insights 💡 This project helped me strengthen my skills in: • API integration • JavaScript DOM manipulation • Responsive UI design 🔗 Live Demo (Vercel):  https://lnkd.in/gbu7SjXs 🔗 GitHub Repo: https://lnkd.in/gXpGtijU Would love your feedback and suggestions! 😊 #WebDevelopment #JavaScript #GitHub #FrontendDevelopment #Projects #LearningJourney

I spent 3 months confused by React. Then I learned Hooks — and everything finally clicked. Most tutorials throw you into class components and lifecycle methods. It's overwhelming. But Hooks changed everything — they made React actually fun to write. Here's the complete mental map I wish I had on day one: ⚡ useState — add local state to any function component ⚡ useEffect — handle side effects (API calls, subscriptions) 🔵 useRef — access DOM elements & persist values without re-rendering 🔵 useContext — share data across the component tree 🟡 useMemo — cache expensive calculations 🟡 useCallback — memoize functions to prevent unnecessary re-renders 🟢 useReducer — manage complex state with reducer logic 🟢 useLayoutEffect — like useEffect, but fires before paint 5 tips to go from beginner → advanced: Master useState & useEffect DEEPLY before moving on Build custom hooks — extract logic you reuse (e.g. useWindowSize) Think in data flow — hooks work best when you understand how state moves Optimize wisely — reach for useMemo/useCallback only when you actually need them Keep building. Real projects teach what tutorials can't. Hooks aren't just syntax — they're a new way of thinking about UI logic. If you're just starting out: be patient with yourself. The mental model takes time. Once it lands, you'll wonder how you ever coded without them. Save this post — it'll make sense in ways it doesn't yet. 🔖 Which Hook was the hardest for you to wrap your head around? Drop it below 👇 #ReactJS #WebDevelopment #JavaScript #Frontend #ReactHooks #Coding #LearnToCode #SoftwareEngineering #100DaysOfCode

🚀 JavaScript Simplified Series — Day 40 🎉 40 Days… 40 Posts… 1 Goal → Master JavaScript from scratch 🚀 If you’ve followed till here… You didn’t just learn JS — 👉 You built discipline 👉 You built consistency 👉 You built a developer mindset 🔥 What You’ve Covered From basics to advanced 👇 ✔ Variables, Data Types ✔ Operators, Conditions ✔ Loops ✔ Functions ✔ Arrays & Objects ✔ DOM & Events ✔ Async JavaScript ✔ Promises & Async/Await ✔ Event Loop ✔ Closures, Scope, Hoisting ✔ Prototypes & Classes ✔ Inheritance & Modules ✔ Debounce & Throttle 👉 This is not beginner level anymore 😎 🔥 Realization Moment At the start: 👉 “JavaScript is confusing” Now: 👉 “I can build things with JavaScript” That’s the real transformation 💯 🎁 Bonus for You I’ve also created complete JavaScript notes 📒 covering everything from this series 👉 Clean 👉 Beginner-friendly 👉 Quick revision ready If you want the notes 👇 💬 Comment “JS NOTES” or DM me — I’ll share it with you 🔥 What Next? Don’t stop here ❌ Start building: 👉 Projects (Todo App, Weather App) 👉 Frontend (React) 👉 Backend (Node.js) 👉 Full Stack Apps 🔥 Final Advice 👉 Don’t just watch tutorials 👉 Build projects 👉 Break things 👉 Fix them That’s how real developers grow 💡 Programming Rule Learning ends when you stop building. Keep building. Keep growing.** 🙌 If this series helped you 👉 Like ❤️ 👉 Share 🔁 👉 Comment your learning 👇 Let’s grow together 🚀 --- 📌 Series Completed 🎯 Day 1 → What is JavaScript ... Day 40 → Complete JavaScript Journey Follow for more 🚀 #JavaScriptSimplified #javascript #webdevelopment #coding #programming #learninpublic #100DaysOfCode #frontenddevelopment #devcommunity #codingjourney #softwaredeveloper #techcommunity #dailylearning #LeetCode #DSA #CodingJourney #Consistency #ProblemSolving #SoftwareEngineering #KeepGoing #codeeveryday

😵💫 “Why is my setTimeout running AFTER my Promise?” This question confused me for a long time while working with JavaScript. I thought: 👉 setTimeout(0) = runs immediately 👉 Promise = async → should run later But I was WRONG. I tested this 👇 console.log("Start"); setTimeout(() => console.log("Timeout"), 0); Promise.resolve().then(() => console.log("Promise")); console.log("End"); 👉 Output shocked me: Start → End → Promise → Timeout Then I saw this diagram 👇 …and everything clicked. 💡 The truth: JavaScript doesn’t just run “async code” randomly. It follows a strict priority system: ⚡ Microtasks (Promises) → HIGH priority ⏳ Macrotasks (setTimeout) → LOW priority 🔄 What actually happens: Run all sync code → Start, End Clear Microtask Queue → Promise Then Macrotask Queue → Timeout 🔥 The moment I understood this: Debugging async code became 10x easier No more guessing execution order My React apps felt more predictable 📌 One line to remember: 👉 “Promises beat setTimeout. Always.” If you’re learning frontend, this is one concept you can’t ignore. What was your “wait… what?!” moment in JavaScript? 👇 #JavaScript #FrontendDevelopment #Coding #WebDevelopment #LearnInPublic

I didn't just build a project. I built something I actually use. 🛠️ DevBoard is a GitHub Profile Dashboard — search any developer and instantly see: 📊 Their contribution heatmap 🧩 Language breakdown across repos 📌 Pinned repositories ⭐ Top repos ranked by stars But the features aren't what I'm most proud of. It's what I had to figure out along the way: → GitHub's API rate limits hit fast. I had to handle errors gracefully so users never see a broken screen. → Dark mode isn't just aesthetic — it taught me how to architect CSS theming properly. Stack: React + CSS3 + GitHub REST API, deployed on Vercel. Every bug I fixed made me a better developer. Every feature I shipped gave me a new idea for the next one. If you're learning frontend — build real things. APIs, edge cases, deployment. That's where the growth happens. 🔗 Try it live: https://lnkd.in/gSHxayUm 🔗 GitHub: https://lnkd.in/gG5KPu4Z #React #FrontendDevelopment #JavaScript #GitHub #WebDev #BuildInPublic #OpenSource #100DaysOfCode