Majid Abbasi’s Post

⚡ JavaScript & TypeScript Daily Refresher #79 👉 What’s your main use case for interfaces in TypeScript? 💡 I use interfaces to define protocols and contracts — they’re super useful when applying architectures like Ports and Adapters, or when working with frameworks such as NestJS and Angular. ✨ I post daily JS/TS refreshers — follow for the next one! #JavaScript #TypeScript #CleanArchitecture #WebDevelopment

🎉 Excited to share that I recently published my npm package — time-helper-js 🕒 💡 What it does: Working with date and time differences in JavaScript can get messy — so I built a lightweight utility that helps you easily format, compare, and manipulate times with just a few lines of code. 📦 Install it in seconds: npm i time-helper-js 🧠 Key Features: ✅ Simple APIs for date/time formatting ✅ Human-readable time differences ✅ Lightweight & dependency-free 👉 Try it out on npm: 🔗 https://lnkd.in/gs9SXb8M Built with Node.js and TypeScript. #npm #javascript #opensource #webdevelopment #react #nodejs #developer

Switching from Angular or old-school React class components to modern React, where almost every component is functional? You might be wondering: "Where did my lifecycle methods go?" Don't worry, they're still here, just in a new form. In functional components, you won't use componentDidMount or ngOnDestroy, but you can replicate their behavior using one powerful hook: useEffect! Check out the carousel below to see how React Hooks replace traditional lifecycle methods. #React #ReactHooks #FrontendDevelopment #JavaScript #TypeScript #WebDevelopment #LearnToCode #useEffect

⚡ JavaScript & TypeScript Daily Refresher #62 👉 When do you use export default and when export in TypeScript? 💡 Use export for named exports when a file contains multiple items. Use export default for a single main value — like React components or utility modules with one primary function. ✨ I post daily JS/TS refreshers — follow for the next one! #JavaScript #TypeScript #React #WebDevelopment

⚡ JavaScript & TypeScript Daily Refresher #73 👉 I have a User type where all properties are required, but for a patch operation, I want to make all properties optional except id. How would you do this? 💡 Use utility types — Partial<User> makes all properties optional, and you can combine it with Pick or & to keep id required: type PatchUser = Partial<User> & Pick<User, "id"> ✨ I post daily JS/TS refreshers — follow for the next one! #JavaScript #TypeScript #UtilityTypes #WebDevelopment

Understanding Hoisting in JavaScript Have you ever wondered how JavaScript can use variables or functions even before they’re declared in the code? 🤔 That’s because of a concept called Hoisting. Hoisting means JavaScript moves variable and function declarations to the top of their scope before code execution. Example 👇 console.log(x); // undefined var x = 10; Here, the variable x is hoisted, but only its declaration, not its value. That’s why you get undefined — not an error. However, let and const behave differently. They are also hoisted but remain uninitialized until their declaration is reached — this period is called the Temporal Dead Zone (TDZ). 📘 Quick Tip: Always declare your variables at the top of their scope to keep your code predictable and clean. #JavaScript #FrontendDevelopment #WebDevelopment #FrontendCountdown #ReactJS #NextJS #TypeScript

Excited to share the latest in my GenZ JavaScript Series! 🚀 In today's video, we're tackling the absolute foundation of ReactJS: Your First Component. Whether you're new to React or need a solid refresher, this lesson covers functional components, JSX, and best practices for building reusable UI. It's crucial for anyone looking to master modern web development. https://lnkd.in/gUwD-mUq #GenZJavaScript #ReactJS #WebDevelopment #Frontend #Coding #JavaScript #Tutorial #LinkedInLearning #Developer"

💡React + TypeScript Tip💡 Did you know? You can use the Omit Utility type to remove specific properties from a type when working with TypeScript. Let's say you have a ButtonProps type like this: type ButtonProps = { label: string; onClick: () => void; disabled?: boolean; } and want to create a new type without the onClick prop, then, instead of defining a new type without the onClick property, you can use the Omit type like this: type DisabledButtonProps = Omit<ButtonProps, "onClick">; ✨ Why this isuseful: ✅ Keeps your code DRY (Don’t Repeat Yourself) ✅ Automatically stays in sync if ButtonProps changes ✨Need to exclude multiple props? No problem! You can join them using union operator like this: type NewButton = Omit<ButtonProps, "onClick" | "disabled"> 𝗙𝗼𝗿 𝗺𝗼𝗿𝗲 𝘀𝘂𝗰𝗵 𝘂𝘀𝗲𝗳𝘂𝗹 𝗰𝗼𝗻𝘁𝗲𝗻𝘁, 𝗱𝗼𝗻'𝘁 𝗳𝗼𝗿𝗴𝗲𝘁 𝘁𝗼 𝗳𝗼𝗹𝗹𝗼𝘄 𝗺𝗲. #javascript #reactjs #nextjs #typescript #webdevelopment

My journey from JavaScript to TypeScript When I first switched from JavaScript to TypeScript, it felt like a slowdown. Type definitions were mysterious, and sometimes my JavaScript logic was correct—but the program failed because types weren’t clearly defined. I had to spend extra time just to get the type system to cooperate. Now, I start every project with type definitions. They’re no longer mysterious—they’re foundational. And there’s a shortcut: I only need to define types for the variables I create. Everything else—frameworks, libraries—already comes with its own type definitions. TypeScript gives me confidence. With clear types and sound logic, I know the program will run. That clarity is worth the upfront effort. #TypeScript #JavaScript #ProgrammingJourney #DevTools #SoftwareEngineering

🎯 Practiced JavaScript DOM today learned how to manipulate multiple elements and how JS interacts with each node in real time. It’s amazing how small scripts can change an entire webpage dynamically! 💻 Check it out here 👉 https://lnkd.in/g9cWfhaH #JavaScript #WebDevelopment #Frontend #LearningJourney