Star Rating Component

This example demonstrates a star rating system.

jsxCopy codeimport React, { useState } from 'react';
import ReactDOM from 'react-dom';

function StarRating() {
  const [rating, setRating] = useState(0);

  return (
<div>
  <h1>Star Rating</h1>
  {[1, 2, 3, 4, 5].map((star) => (
    <span
      key={star}
      onClick={() => setRating(star)}
      style={{ cursor: 'pointer', color: star <= rating ? 'gold' : 'gray' }}
    >
      ★
    </span>
  ))}
  <p>Your rating: {rating}</p>
</div>
  );
}

ReactDOM.render(<StarRating />, document.getElementById('root'));