إعادة استخدام المكونات

هنا تظهر فائدة المكونات (components): استخدم المكون بالعدد الذي تريده من المرات. كل <Star /> أدناه هي نسخة جديدة:

function Star() {
    return <span>★</span>;
}

export default function App() {
    return (
        <div>
            <Star />
            <Star />
            <Star />
        </div>
    );
}

ثلاث نجوم على الشاشة، وتعريف واحد في الكود. قم ببتغيير التعريف مرة واحدة، وستتحدث كل نسخة. هذه هي قوة إعادة الاستخدام الخارقة التي لم تكن موجودة في HTML أبدًا.