Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- modul:ffit:react:learningunits:lu01:using-variables [2024/12/05 07:27] – kdemirci
+++ modul:ffit:react:learningunits:lu01:using-variables [2024/12/18 16:11] (aktuell) – kmaurizi
@@ Zeile 1: / Zeile 1: @@
 ====== LU01b - Using Variables ======
-We can use variables to fill out our component dynamically. In JSX we have to use the curly brackets {} to display value. If we add the parameter "props" to our function, we can use it in our function to display value given to this component
+We can use variables to populate our component dynamically. In JSX we need to use the curly brackets {} to display the value. If we add the parameter "props" to our function, we can use it in our function to display the value given to this component.
 Product.js
-<code javascript>
+<file javascript Product.js >
 export default function Product(props) {
   return (
@@ Zeile 20: / Zeile 20: @@
   );
 }
-</code>
+</file>
 ProductsList.js
@@ Zeile 61: / Zeile 61: @@
 ===== Using children of component =====
-We can nest components and also use other element in our component brackets.
+We can nest components and also use other elements in our component brackets.
 Content.js
@@ Zeile 77: / Zeile 77: @@
 <code javascript>
 import Content from "./Content.js"
+import ProductsList from "./ProductsList.js"
 export default function App() {
@@ Zeile 83: / Zeile 84: @@
       <Content>
         This is my content.
+        <ProductsList />
       </Content>
     </div>