bunext-js - npm Package Compare versions

Comparing version 0.11.2 to 0.11.3

package.json

 {
   "name": "bunext-js",
-  "version": "0.11.2",
+  "version": "0.11.3",
   "repository": "shpaw415/bunext",
@@ -5,0 +5,0 @@ "bugs": "[e-mail]",

README.md

@@ -106,2 +106,117 @@
 
+# ⚙️ Server Components
+
+Bunext supports **Server Components**, which run **only at build time** and are re-executed only when `revalidate()` is triggered.
+
+---
+
+## ✅ How It Works
+
+- Any exported function without the `"use client"` directive is treated as a **Server Component**.
+- Must have **no props**.
+- Must be **exported** (not inline) and can be `async`.
+- `revalidate()` will re-run **all Server Components** used on the page.
+- Must not have hooks
+
+---
+
+### 📦 Example
+
+```tsx
+// index.tsx
+
+export default async function Page() {
+  return (
+    <div>
+      {await Components()}
+      <NotValid />
+    </div>
+  );
+}
+
+// ✅ Valid Server Component
+export async function Components() {
+  const res = await (await fetch("https://some-api.com/api")).json();
+  return <div>{JSON.stringify(res)}</div>;
+}
+
+// ❌ Invalid - has props
+export function NotValid({ someProps }: { someProps: string }) {
+  return <div>{someProps}</div>;
+}
+```
+---
+🧩 Nested Server Components
+You can also compose Server Components by nesting them.
+
+```tsx
+// index.tsx
+
+export default async function Page() {
+  return (
+    <main>
+      {await Parent()}
+    </main>
+  );
+}
+
+export async function Parent() {
+  return (
+    <section>
+      <h2>Parent Component</h2>
+      {await Child()}
+    </section>
+  );
+}
+
+export async function Child() {
+  const data = await (await fetch("https://some-api.com/stats")).json();
+  return <pre>{JSON.stringify(data, null, 2)}</pre>;
+}
+```
+
+---
+🔁 Revalidating Components
+Bunext allows scheduled and manual revalidation.
+
+⏱ Scheduled Revalidation
+
+```tsx
+// index.tsx
+import { revalidate } from "bunext-js/features/router/revalidate.ts";
+
+export default function Page() {
+  revalidateEvery("/", 3600); // revalidate this page every hour
+
+  return (
+    <div>
+      <button onClick={() => ServerRevalidate(["/"])}>Revalidate / path</button>
+    </div>
+  );
+}
+
+
+
+```
+---
+🔄 Manual Revalidation
+
+```tsx
+import { revalidate } from "bunext-js/features/router/revalidate.ts";
+
+export async function ServerRevalidate(...paths: string[]) {
+  revalidate(...paths);
+}
+```
+
+---
+
+📝 Rules to apply
+  - ✅ Keep Server Components pure – no side effects.
+  - ✅ Fetch data server-side with async/await.
+  - ❌ Avoid using props.
+  - ❌ Don't mutate state or use hooks like useState or useEffect.
+
+---
+
 ## 🚀 Static Pages with `"use static"`  
@@ -668,3 +783,3 @@
   <details>
-    <summary>📢 0.11.2</summary>
+    <summary>📢 0.11.3</summary>
     
@@ -674,5 +789,6 @@ - Upgraded Version of Link element now is a Anchor element and ctrl+click will open in a new tab.
     - BunextPlugin has onFileSystemChange new key (doc will follow)
-    - update Doc for missing section API endpoints
+    - update Doc for missing section API endpoints and server components
+    - Head component for setting dynamic head data
   </details>
 </details>
 

No alert changes

Improved metrics

Total package byte prevSize

3051649

707.83%

Number of package files

117

9.35%

Lines of code

9219

5.49%

Number of lines in readme file

792

17.16%

No dependency changes