Abdul Sammad’s Post

🚀 Understanding Streams and Buffers in Node.js Have you ever wondered how Node.js efficiently handles large files like videos, logs, or data transfers without running out of memory? 🤔 The answer lies in Streams and Buffers — the backbone of Node.js I/O operations. A Buffer temporarily holds chunks of binary data, while a Stream processes that data piece by piece instead of loading everything at once. This approach makes Node.js incredibly efficient when dealing with big files or real-time data. Whether it’s reading a large CSV, serving a video, or handling file uploads, Streams help you process data continuously and save resources. Once you master Streams and Buffers, you can build scalable applications that handle massive data effortlessly. ⚡ 💭 Have you ever worked with file streams or HTTP streams in your Node.js projects? How was your experience? #NodeJS #JavaScript #BackendDevelopment #Streams #Buffers #Performance #WebDevelopment #Learning

The code worked flawlessly for 7 years… until one innocent await brought everything down. 😅 We recently hit a strange production issue. A module that had been stable for years suddenly started producing inconsistent results — but only in production, under high load. Local? Fine. Staging? Perfect. Production? Absolute chaos. Logs started showing errors! I Panicked. The only change I had made: adding an await to call a new asynchronous function. After a rollback and some deep digging, I found the culprit... A variable named queryParams wasn’t declared inside any function — meaning it lived in global scope. So when one request paused on await, another concurrent request came in and modified the same object. When the first one resumed, it unknowingly worked with the mutilated data, to run a sql query, which started throwing errors. A true race condition, hiding in plain sight for 7 years — only revealed by a single async call. We replicated the behavior by bombarding the staging environment with concurrent requests, confirmed the theory, and fixed it by simply scoping the variable locally. Lesson learned: Even in single-threaded Node.js, async code can create concurrency issues if shared state isn’t handled carefully. Sometimes, one misplaced variable is all it takes to cause production chaos. The bug wasn’t new — it was just waiting 7 years for the right await to wake it up. 😅 #nodejs #backend #javascript #developer #expressjs

⚛️ That moment when I finally got my API call to work… and data appeared on the screen! 😍 When I first started learning React, I thought fetching data was simple — just call the API and show the data. But then… the re-renders, async calls, and errors started showing up like plot twists 😅 That’s when I learned the right way 👇 ✅ Using useEffect() for API calls: import React, { useEffect, useState } from "react"; function UserList() { const [users, setUsers] = useState([]); useEffect(() => { fetch("https://lnkd.in/gTcasaiP") .then(res => res.json()) .then(data => setUsers(data)) .catch(err => console.error(err)); }, []); return ( <ul> {users.map(user => <li key={user.id}>{user.name}</li>)} </ul> ); } 💡 Lesson learned: Always use useEffect() for API calls to avoid infinite loops. Handle loading and errors gracefully. Keep your data state clean and predictable. Once I understood this pattern, fetching data in React felt like second nature. ⚡ #ReactJS #WebDevelopment #FrontendDeveloper #MERNStack #JavaScript #API #useEffect #ReactHooks #LearningByDoing #CodingJourney

I spent my weekend adding mixin support to my TypeScript logging library, LogLayer (https://loglayer.dev), with the first mixin being StatD support - you can now use the "hot-shots" LogLayer mixin to add metrics APIs to LogLayer, making it super easy to send metrics as you write logs! (Mixins allows one to augment classes with new methods without extending the class itself by directly modifying the prototype in Javascript). At Airtop, there's been an initiative to improve our observability and metrics; while we do use tracing libraries that auto-instrument many parts of our systems, sometimes we want more pin-pointed metrics that auto-instrumentation cannot do. I felt that metrics is often an afterthought and that it should be as easy to access like writing log entries in your code. I also didn't want to pollute LogLayer itself with another domain-specific set of APIs that could potentially not have the right design (as I am not a domain expert in metrics). So I thought of the best way to accomplish this was through the use of mixins. I went through several revisions with the mixin architecture until I felt I hit the right spot in terms of developer experience - the methods added had to be easy to discover via TypeScript and also be mock-able with our existing LogLayer mock facilities that the library provides. LogLayer itself remains clean as a result - the base API remains logging-focused, but the API can now be extended easily with mixins. I then looked at what was popular in the node space for StatD clients, and "hot-shots" came out on top and decided to add the hot-shots API as a mixin to LogLayer. So now with this mixin, we now have the ability to easily define metrics as we write our logs! #typescript #node #metrics #logging

🚀 𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁 𝗗𝗲𝗲𝗽 𝗗𝗶𝘃𝗲: 𝗠𝗮𝘀𝘁𝗲𝗿𝗶𝗻𝗴 𝘁𝗵𝗲 𝗙𝗲𝘁𝗰𝗵 𝗔𝗣𝗜 💡 Say goodbye to old-school XMLHttpRequest! The Fetch API is the modern, promise-based way to make HTTP requests in JavaScript — simple, powerful, and elegant. ⚡ 🔹 𝗕𝗮𝘀𝗶𝗰 𝗙𝗲𝘁𝗰𝗵 𝗘𝘅𝗮𝗺𝗽𝗹𝗲: fetch('https://lnkd.in/gWKpgMrT') .then(response => response.json()) .then(data => console.log(data)) .catch(error => console.error('Error:', error)); ✅ fetch() returns a Promise ✅ response.json() converts response to JSON ✅ .catch() ensures error handling 🔹 𝗖𝗹𝗲𝗮𝗻𝗲𝗿 𝗦𝘆𝗻𝘁𝗮𝘅 𝘄𝗶𝘁𝗵 𝗔𝘀𝘆𝗻𝗰/𝗔𝘄𝗮𝗶𝘁: async function getData() { try { const response = await fetch('https://lnkd.in/gWKpgMrT'); const data = await response.json(); console.log(data); } catch (error) { console.error('Error:', error); } } getData(); ✨ No more nested .then() chains — just clean, readable async code! 💡 𝗣𝗿𝗼 𝗧𝗶𝗽𝘀: 🔸 Always handle network errors 🔸 Add headers for authentication & content-type 🔸 Supports GET, POST, PUT, DELETE and more Credit 💳 🫡 Sameer Basha Shaik 🚀 The Fetch API is a must-know tool for every frontend developer — perfect for fetching data, integrating APIs, and building modern web applications! 🌐 #JavaScript #FetchAPI #WebDevelopment #AsyncAwait #Frontend #CodingTips #CleanCode #DeveloperCommunity #Promises #LearnToCode #jsdeveloper

💡 structuredClone() vs JSON.parse(JSON.stringify()) Both are used for deep copying objects in JavaScript, but they’re not the same. 🧠 structuredClone() Creates a true deep copy (recursively copies nested data). Supports complex types: Date, Map, Set, Blob, etc. Handles circular references safely. Faster and more reliable. const clone = structuredClone(obj); ⚠️ JSON.parse(JSON.stringify()) Works only for simple JSON-safe data. Loses functions, Dates, Maps, Sets, and Symbols. Crashes on circular references. ✅ Use structuredClone() whenever available (modern browsers & Node 17+). Use the JSON trick only for plain, simple data. #JavaScript #WebDevelopment #Frontend #DeepCopy #CodingTips

I’ve been rebuilding one of my personal projects with #Next.js and #TypeScript, and it’s been a great way to get a proper feel for how it works beyond plain #React. Over the last two weeks, I’ve been diving deeper into a few areas: ⏺️ File-based routing – creating routes by adding files and folders feels cleaner and straightforward than manually managing routes. ⏺️ <Link> and <Image> – these built-in components handle a lot behind the scenes. Links prefetch automatically, and images are optimised on the server. No more fiddling with lazy loading or formats. ⏺️ Fetching data from my own database – I’ve been handling data fetching inside server components using async functions, which lets me query data directly without setting up separate API routes. Still plenty to learn (and probably refactor 😆), but I’m starting to see why so many devs are working with #Next.js.

What is the Event Loop in Node.js? If you’ve ever wondered how Node.js handles thousands of requests even though JavaScript is single-threaded, the answer is: The Event Loop. 👉 The Event Loop is the core mechanism that allows Node.js to perform non-blocking, asynchronous operations without creating multiple threads. 💡 How it works: Sync code runs first Heavy tasks (file read, DB calls, API requests) go to background workers Node.js doesn’t wait — it continues executing Once tasks finish, callbacks are pushed back into the queue The Event Loop processes them one by one 🧠 Why it’s powerful: ✔ Handles thousands of connections ✔ Makes Node.js extremely fast ✔ Enables real-time apps (chat, notifications) ✔ Prevents the server from freezing Simple example: console.log("Start"); setTimeout(() => console.log("Timeout"), 0); console.log("End"); Output: Start End Timeout Even with 0ms delay, the callback runs later — thanks to the Event Loop ✔ Explanation: https://lnkd.in/g6Tm4G2K #NodeJS #JavaScript #EventLoop #WebDevelopment #BackendDevelopment #Programming #TechCommunity #CodingCommunity #SoftwareEngineering #LearnToCode

🌟 Day 53 of JavaScript 🌟 🔹 Topic: Fetch API 📌 1. What is the Fetch API? The Fetch API allows JavaScript to make HTTP requests (like GET, POST, PUT, DELETE) to servers — used to retrieve or send data 🌐 💬 Think of it as JavaScript’s way to talk to web servers asynchronously. ⸻ 📌 2. Basic Syntax: fetch("https://lnkd.in/gXUzR2fM") .then(response => response.json()) .then(data => console.log(data)) .catch(error => console.error("Error:", error)); ✅ Step-by-step: 1️⃣ Fetch sends the request 2️⃣ Waits for the response 3️⃣ Converts it (like .json()) 4️⃣ Handles the data or errors ⸻ 📌 3. Using async/await: async function getData() { try { const response = await fetch("https://lnkd.in/gXUzR2fM"); const data = await response.json(); console.log(data); } catch (err) { console.error("Fetch failed:", err); } } getData(); ⚙️ Cleaner, more readable syntax for async operations. ⸻ 📌 4. POST Example: fetch("https://lnkd.in/gJ4WB7DB", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ name: "Pavan", age: 25 }) }); ⸻ 📌 5. Why Use Fetch API? ✅ Simpler than XMLHttpRequest ✅ Promise-based ✅ Works with async/await ✅ Built-in for browsers ⸻ 💡 In short: The Fetch API makes calling APIs in JavaScript simple, powerful, and modern — the go-to tool for all web requests 🚀 #JavaScript #100DaysOfCode #FetchAPI #WebDevelopment #FrontendDevelopment #CodingJourney #JavaScriptLearning #CleanCode #AsyncJS #Promises #DevCommunity #CodeNewbie #WebDev