From 1733d46d12ff79a24a0d12de8a593095d354ff0d Mon Sep 17 00:00:00 2001
From: Ali Najmabadi <alinajmabadizadeh2002@gmail.com>
Date: Sun, 8 Dec 2024 16:51:28 +0330
Subject: [PATCH] docs: update nextjs/isr

---
 src/pages/paas/nextjs/how-tos/use-isr.mdx | 92 ++++++++++++++++++++++-
 1 file changed, 91 insertions(+), 1 deletion(-)

diff --git a/src/pages/paas/nextjs/how-tos/use-isr.mdx b/src/pages/paas/nextjs/how-tos/use-isr.mdx
index d26c4801..87654e6d 100644
--- a/src/pages/paas/nextjs/how-tos/use-isr.mdx
+++ b/src/pages/paas/nextjs/how-tos/use-isr.mdx
@@ -22,10 +22,100 @@ import Head from "next/head";
 # استفاده از قابلیت ISR
 <hr className="mb-2" />
 
-ISR (Incremental Static Regeneration) یکی از قابلیت‌های  NextJS است که به شما اجازه می‌دهد تا صفحاتی را که به‌صورت استاتیک تولید شده‌اند، بدون نیاز به بازسازی کامل سایت، به‌روز کنید.
+<a href="https://nextjs.org/docs/pages/building-your-application/data-fetching/incremental-static-regeneration" className="text-[#2196f3]">ISR</a> یا Incremental Static Regeneration یک ویژگی در NextJS است که به شما اجازه می‌دهد تا صفحات استاتیک را به صورت انتخابی و بدون نیاز به بازسازی کل سایت، به‌روزرسانی کنید.
+ این قابلیت ترکیبی از مزایای Static Site Generation (SSG) و انعطاف‌پذیری Server-Side Rendering (SSR) را ارائه می‌دهد.
+در واقع، عملکرد ISR به شکل زیر است: 
 
+<div className="h-2" />
+<ul>
+
+<li ><b>ساخت تدریجی صفحات: </b>صفحات استاتیک می‌توانند پس از بیلد اولیه سایت، در صورت نیاز (با request کاربر)، build یا به‌روز شوند.</li>
+<div className="h-1" />
+<li ><b>پیکربندی از طریق revalidate: </b>شما می‌توانید زمان‌بندی به‌روزرسانی صفحات را با استفاده از ویژگی revalidate تعیین کنید. برای مثال، اگر مقدار revalidate را برابر با ۱۰ قرار دهید، صفحه هر ۱۰ ثانیه یک‌بار به‌روزرسانی می‌شود.</li>
+<div className="h-1" />
+<li ><b>پاسخ‌دهی سریع: </b>در زمان درخواست کاربر، نسخه موجود در کش به سرعت ارائه می‌شود و به‌روزرسانی‌ها به صورت پس‌زمینه انجام می‌شوند.</li>
+{/* <div className="h-1" />
+<li style={{ "padding-inline-start": 20}}><b></b></li> */}
+</ul>
+<div className="h-2" />
+
+همانطور که گفته شد، ISR امکان به‌روزرسانی صفحات استاتیک به‌صورت انتخابی و بدون نیاز به بازسازی کل سایت را فراهم می‌کند. این کار با استفاده از یک ویژگی کلیدی به نام revalidate در متد getStaticProps انجام می‌شود. مقدار revalidate تعیین می‌کند که یک صفحه استاتیک چه زمانی نیاز به بازسازی در پس‌زمینه دارد. زمانی که کاربران از صفحه‌ای بازدید می‌کنند، اگر زمان تعیین‌شده در revalidate گذشته باشد، یک نسخه جدید از صفحه ساخته می‌شود، در حالی که کاربران همچنان نسخه قدیمی را مشاهده می‌کنند.
+
+در این فرآیند، NextJS از کش (Cache) برای ارائه سریع نسخه موجود صفحه استفاده می‌کند. این باعث می‌شود تا کاربران تجربه سریعی داشته باشند، حتی اگر داده‌های صفحه در حال به‌روزرسانی باشد. هنگامی که فرآیند بازسازی کامل شد، نسخه جدید جایگزین نسخه قدیمی می‌شود و برای درخواست‌های بعدی ارائه خواهد شد. این ویژگی برای وب‌سایت‌هایی که شامل محتوای متغیر یا صفحات زیادی هستند، مانند فروشگاه‌های آنلاین یا سایت‌های خبری، بسیار ایده‌آل است.
+
+<Section id="enable-isr" title="نحوه استفاده" />
+مثال زیر نحوه پیاده‌سازی ISR را نشان می‌دهد. این کد داده‌ها را از یک API فرضی دریافت کرده و هر ۱۰ ثانیه، صفحه را به‌روز می‌کند:
+
+<div className="h-2" />
+<div dir='ltr'>
+<Highlight className="js">
+        {`// pages/isr-example.js
+
+export async function getStaticProps() {
+  const data = await fetch('https://jsonplaceholder.typicode.com/posts/1')
+    .then((res) => res.json());
+
+  return {
+    props: { data },
+    revalidate: 10, // updates every 10 seconds
+  };
+}
+
+const ISRExample = ({ data }) => {
+  return (
+    <div>
+      <h1>ISR Example</h1>
+      <p><strong>Title:</strong> {data.title}</p>
+      <p><strong>Body:</strong> {data.body}</p>
+    </div>
+  );
+};
+
+export default ISRExample;
+`}
+</Highlight>
+</div>
+<div className="h-2" />
+
+در پروژه‌های واقعی ممکن است داده‌ها ناقص باشند یا API به درستی پاسخ ندهد. در چنین مواردی، می‌توانید مانند قطعه کد زیر، عمل کنید: 
+
+<div className="h-2" />
+<div dir='ltr'>
+<Highlight className="js">
+        {`export async function getStaticProps() {
+  try {
+    const data = await fetch('https://jsonplaceholder.typicode.com/posts/1')
+      .then((res) => res.json());
+
+    if (!data) {
+      return {
+        notFound: true, // display 404 page
+      };
+    }
+
+    return {
+      props: { data },
+      revalidate: 10, // update every 10 seconds
+    };
+  } catch (error) {
+    console.error('Error fetching data:', error);
+    return {
+      props: { data: null },
+      revalidate: 10,
+    };
+  }
+}
+`}
+</Highlight>
+</div>
+<div className="h-2" />
+
+
+<Section id="enable-in-liara" title="نحوه استفاده در لیارا" />
 از آنجایی که فضای نوشتن در حالتِ پیش‌فرضِ Writable، متغیر است و در حالت فایل‌سیستم ReadOnly   فضایی برای نوشتن وجود ندارد؛ ممکن است که به افزایش فضا برای ذخیره‌سازی صفحات ساخته شده مبتنی بر ISR، نیاز داشته باشید. برای این کار کافیست تا طبق مراحل زیر، عمل کنید:
 
+<div className="h-4" />
+
 <Tabs 
     tabs={["Pages Router", "App Router"]} 
     content={[