Menu
Coddy logo textTech

Özet: Props

Coddy'nin React Journey'sinin Temeller bölümünün bir parçası — ders 21 / 42.

challenge icon

Görev

Kolay

Bölüm özeti: Props ve children kullanılarak oluşturulmuş küçük bir menü.

  1. Item bileşeninin name ve price prop'larını almasını ve kendi <li> etiketi içinde {name}: ${price} şeklinde render etmesini sağlayın.
  2. Card bileşeninin, children içeriğini gösteren className="card" ile bir <div> render etmesini sağlayın.
  3. App içinde, <ul id="menu"> öğesini sarmalamak için <Card>...</Card> kullanın ve içinde iki Item render edin: price değeri 3 olan Tea isimli öğe, ardından price değeri 5 olan Cake isimli öğe (fiyatlar sayı olmalıdır!).

Kendin dene

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="styles.css" />
    </head>
    <body>
        <div id="root"></div>
        <script type="module" src="main.jsx"></script>
    </body>
</html>

Temeller bölümündeki tüm dersler