more starting code fixes

attachments/25b RSC, Suspense, Server Actions/ClientDemo.js

@@ -0,0 +1,12 @@
+export default function ClientDemo({ children }) {
+  console.log('ClientDemo rendered');
+  return (
+    <div className='client-cmp'>
+      <h2>A React Client Component</h2>
+      <p>
+        Will be rendered on the client <strong>AND</strong> the server.
+      </p>
+      {children}
+    </div>
+  );
+}

attachments/25b RSC, Suspense, Server Actions/DataFetchingDemo.js

@@ -0,0 +1,22 @@
+import fs from 'node:fs/promises';
+
+export default async function DataFetchingDemo() {
+  const data = await fs.readFile('dummy-db.json', 'utf-8');
+  const users = JSON.parse(data);
+
+  return (
+    <div className='rsc'>
+      <h2>RSC with Data Fetching</h2>
+      <p>
+        Uses <strong>async / await</strong> for data fetching.
+      </p>
+      <ul>
+        {users.map((user) => (
+          <li key={user.id}>
+            {user.name} ({user.title})
+          </li>
+        ))}
+      </ul>
+    </div>
+  );
+}

attachments/25b RSC, Suspense, Server Actions/RSCDemo.js

@@ -0,0 +1,14 @@
+export default async function RSCDemo() {
+  console.log('RSCDemo rendered');
+  return (
+    <div className='rsc'>
+      <h2>A React Server Component</h2>
+      <p>
+        Will <strong>ONLY</strong> be rendered on the server or at build time.
+      </p>
+      <p>
+        <strong>NEVER</strong> on the client-side!
+      </p>
+    </div>
+  );
+}

attachments/25b RSC, Suspense, Server Actions/dummy-db.json

@@ -0,0 +1,4 @@
+[
+  { "id": "u1", "name": "Max Schwarzmüller", "title": "Instructor" },
+  { "id": "u2", "name": "Manuel Lorenz", "title": "Instructor" }
+]