آموزش Next.JS با Sanity CMS - برنامه بلاگ بدون سرور (به همراه Vercel)

سرفصل ها و درس ها

معرفی Introduction

• معرفی Introduction

• نکات دوره Course tips

راه اندازی پروژه Project Setup

• بخش مقدمه Section Introduction

• برنامه بعدی را راه اندازی کنید Init Next App

• اپلیکیشن Sanity Studio Sanity Studio App

• React Bootstrap Integration React Bootstrap Integration

• جداسازی Navbar Separation of Navbar

• مسیر مطلق به فایل ها Absolute path to files

• صفحه آرایی Page layout

با سلامت عقل شروع کنید Starting with Sanity

• بخش مقدمه Section Introduction

• انواع سلامتی Sanity Types

• مشتری سلامت Sanity client

• وبلاگ ها را دریافت کنید Get blogs

• فیلدهای وبلاگ و نمایش وبلاگ ها Blog fields & display blogs

• در زیر کاپوت Under the hood

• تاریخ و تصویر Date and image

• نویسندگان Authors

• نمایش نویسنده Display author

• اعتبار سنجی سلامت Sanity validation

• فونت ها + بهبودهای سبک جزئی Fonts + minor styling improvements

• لینک و صفحه جزئیات Link and detail page

• دریافت داده های وبلاگ Get blog data

• تابع getStaticPaths getStaticPaths function

• getStaticPaths قسمت 2 getStaticPaths part 2

• طرح بندی صفحه جزئیات وبلاگ Blog detail page layout

ویژگی های وبلاگ Sanity Sanity Blog Features

• بخش مقدمه Section Introduction

• محتوای سلامت و تصویر Sanity content and Image

• محتوای سلامت و کد Sanity content and Code

• بسته قفل packageLock

• مطالب وبلاگ Blog content

• سبک های کد Code stylings

• بهبود تصویر Image improvements

• اطلاعات بیشتر در مورد تصاویر More about images

• برش تصاویر Cropping of images

• موقعیت تصویر Image position

• اعمال موقعیت تصویر Apply image position

مشاهده فهرست وبلاگ و واکشی مشتری Blog List View & Client fetching

• بخش مقدمه Section Introduction

• شروع نمای فیلتر Filtering view start

• فیلتر کردن کار می کند Filtering working

• فونت عالی Font awesome

• داده های مورد فهرست List item data

• استفاده ازSWR useSWR

• مسیر Api برای دریافت وبلاگ ها Api route to get blogs

• به روز رسانی Update

• وبلاگ ها را از api دریافت کنید Get blogs from api

• مرتب سازی Ordering

صفحه بندی و مرتب سازی تاریخ Pagination & Date Sorting

• بخش مقدمه Section Introduction

• swr صفحه بندی swr Pagination

• دکمه برای بارگذاری Button to load

• پاس افست Passing offset

• وبلاگ های بیشتری را واکشی کنید Fetch more blogs

• واکشی وبلاگ های بیشتر را رفع کنید Fix fetching more blogs

• نماد فیلتر کردن تاریخ Date filtering icon

• مرتب سازی بر اساس تاریخ Sorting by date

• مرتب سازی بر اساس تاریخ را برطرف کنید Fix sorting by date

• تصویر خالی Blank image

• آیتم لیست خالی Blank list item

• لحظه و تصویر جلد Moment and cover image

بازگشت و پیش نمایش + ویژگی تم Fallback & Preview + Theme Feature

• بخش مقدمه Section Introduction

• بازگشت به عقب Fallback

• ارائه دهنده تم Theme provider

• تم را اعمال کنید Apply theme

• تعویض کننده Toggler

• پیش نمایش سلامتی Sanity preview

• پیش نمایش مسیر api Preview api route

• دریافت پیش نمایش به صفحه Get preview to page

• داده های پیش نمایش را دریافت کنید Get preview data

• خروج از پیش نمایش Exit preview

• رفع مشکل برای نمایش داده های پیش نمایش Fix issue to display preview data

گسترش Deployment

• بخش مقدمه Section Introduction

• استودیو Sanity به Github Sanity studio to Github

• استقرار سلامت Sanity deployment

• تست استودیو سلامت عقل Sanity studio testing

• استقرار وبلاگ Deployment of Blog

• رفع پیش نمایش در تولید Fixing preview in production

• تأیید مجدد تغییرات Revalidate Changes

• اعتبار مجدد ناپایدار Unstable revalidate

• بهبود استایل Styling Improvements

• بهبود صفحه بندی Pagination improvements

• رفع پیش نمایش Preview fix

• آزمایش کردن Testing

• پایان دوره End of the course

به روز رسانی ها Updates

• توجه داشته باشید Note

• صفحه بندی Pagination