💡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
How to use Omit Utility type in TypeScript for React
More Relevant Posts
-
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
To view or add a comment, sign in
-
Why is it that in React we always have to wrap our elements into a single parent element or react fragment. I hope you learn something useful from me! inspired by @cosdensolutions ❤️ ---------------------------------------------------- I make content about reactjs on YouTube you can check out on my channel. #webdevelopment #mernstack #reactjs #typescript #javascript #reels #viral #developer #selflearning #sharing
To view or add a comment, sign in
-
🚀 Bun.js vs Node.js — The Next-Gen JavaScript Runtime ⚡ Bun is making waves in the JavaScript world — claiming to be faster, leaner, and simpler than Node.js. Here’s a quick comparison 👇 🔥 Key Highlights: Written in Zig for performance & safety Built-in TypeScript & transpiler (no extra setup) 29x faster package manager Hot reloading out of the box Minimal setup, lightning-fast execution 💡 Node.js still dominates in ecosystem maturity and stability — but Bun is quickly becoming the go-to for speed-focused developers. 👉 What do you think? Will Bun replace Node.js in the future? #BunJS #NodeJS #JavaScript #WebDevelopment #Performance #Backend #Developers
To view or add a comment, sign in
-
-
⚡ 𝗪𝗿𝗶𝘁𝗲 𝗦𝗺𝗮𝗿𝘁𝗲𝗿, 𝗡𝗼𝘁 𝗛𝗮𝗿𝗱𝗲𝗿 — 𝟭𝟬 𝗠𝘂𝘀𝘁-𝗛𝗮𝘃𝗲 𝗖𝘂𝘀𝘁𝗼𝗺 𝗛𝗼𝗼𝗸𝘀 Tiny hooks, massive impact ⚡ Instead of repeating logic — encapsulate it once, reuse it everywhere. These mini hooks will help you write cleaner, faster, and smarter React code. 💡 𝑆𝑎𝑣𝑒 𝑡ℎ𝑖𝑠 𝑝𝑜𝑠𝑡 — 𝑦𝑜𝑢’𝑙𝑙 𝑓𝑖𝑛𝑑 𝑦𝑜𝑢𝑟𝑠𝑒𝑙𝑓 𝑢𝑠𝑖𝑛𝑔 𝑡ℎ𝑒𝑠𝑒 ℎ𝑜𝑜𝑘𝑠 𝑖𝑛 𝑎𝑙𝑚𝑜𝑠𝑡 𝑒𝑣𝑒𝑟𝑦 𝑝𝑟𝑜𝑗𝑒𝑐𝑡! credit- Kushyar Rashidzadeh #React #ReactJS #ReactHooks #JavaScript #FrontendDevelopment #WebDevelopment
To view or add a comment, sign in
-
Why learning pure JavaScript matters Frameworks change, but JavaScript fundamentals—like closures, event loop, promises, and async/await—never go out of style. Mastering JS makes you a stronger React, Next.js, and even React Native developer. 👉 What’s your favorite JavaScript concept? #JavaScript #ReactJS #NextJS #Frontend #WebDevelopment
To view or add a comment, sign in
-
JavaScript Closures: It felt abstract — like some mysterious power functions had. 👉 Think of a closure like a backpack your function carries. Inside that backpack are all the variables it had access to when it was created — and even when it travels elsewhere (gets called later), it still remembers what’s inside. That means your function can “remember” things, even after its parent scope is gone. It’s not magic — it’s just JavaScript being smart about memory and context. #JavaScript #ReactJS #LearningInPublic #WebDevelopment
To view or add a comment, sign in
-
React vs Vanilla JS ⚔️ Should you learn Vanilla JS before React? My take: YES. Without a strong JS foundation, React is just “magic” that’s hard to debug. 👉 Example: Understanding closures helps you write better custom hooks. So if you’re new, spend time on JavaScript first → then React will click. Do you agree or not? #ReactJS #JavaScript #CareerAdvice
To view or add a comment, sign in
-
React vs Vanilla JS ⚔️ Should you learn Vanilla JS before React? My take: YES. Without a strong JS foundation, React is just “magic” that’s hard to debug. 👉 Example: Understanding closures helps you write better custom hooks. So if you’re new, spend time on JavaScript first → then React will click. Do you agree or not? #ReactJS #JavaScript #CareerAdvice
To view or add a comment, sign in
-
Daily tip: Use optional chaining in JavaScript to safely access nested properties. Example: const city = user?.address?.city ?? 'Unknown'. Small trick, big payoff. If you’re exploring React, remember to keep components focused and reusable. What's your current favorite JS trick? #JavaScript #React #WebDev
To view or add a comment, sign in
Explore content categories
- Career
- Productivity
- Finance
- Soft Skills & Emotional Intelligence
- Project Management
- Education
- Technology
- Leadership
- Ecommerce
- User Experience
- Recruitment & HR
- Customer Experience
- Real Estate
- Marketing
- Sales
- Retail & Merchandising
- Science
- Supply Chain Management
- Future Of Work
- Consulting
- Writing
- Economics
- Artificial Intelligence
- Employee Experience
- Workplace Trends
- Fundraising
- Networking
- Corporate Social Responsibility
- Negotiation
- Communication
- Engineering
- Hospitality & Tourism
- Business Strategy
- Change Management
- Organizational Culture
- Design
- Innovation
- Event Planning
- Training & Development