0 day streak
javascript / beginner
Snippet

Cleaner Code with Prop Destructuring

Destructuring allows you to extract properties from the props object directly in the function parameters. This avoids repeating 'props.' throughout your component code.

snippet.js
javascript
1
2
3
4
5
6
7
8
export default function UserCard({ title, email }) {
return (
<div className="card">
<h3>{title}</h3>
<p>{email}</p>
</div>
);
}
nextjs
Breakdown
1
({ title, email })
Unpacks specific properties from the first argument (props) into local variables.