آموزش Next.js: ایجاد و میزبانی یک سایت Full-Stack

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

مقدمه Introduction

• معرفی پروژه Project introduction

• یک سایت تمام پشته با Next.js ایجاد کنید Create a full-stack site with Next.js

• فایل های راه اندازی و تمرین اولیه Basic setup and exercise files

• آنچه شما باید بدانید What you should know

1. ایجاد Next.js React Front End 1. Creating a Next.js React Front End

• سفارشی کردن محتوا با پارامترهای مسیر Customizing content with route parameters

• ایجاد لیست محصولات Creating a product list

• ایجاد صفحه 404 Creating a 404 page

• ایجاد صفحات Creating pages

• استایل کردن برنامه های Next.js با Tailwind CSS Styling Next.js applications with Tailwind CSS

• راه اندازی یک پروژه Next.js Setting up a Next.js project

• راه حل: ایجاد یک نوار ناوبری Solution: Creating a navigation bar

• چالش: ایجاد یک نوار ناوبری Challenge: Creating a navigation bar

• استفاده از پیوندهای Next.js Using Next.js Links

• ایجاد لیست سبد خرید Creating a shopping cart list

• Next.js چیست؟ What is Next.js?

2. ایجاد مسیرهای API Next.js 2. Creating Next.js API Routes

• ایجاد نقطه پایانی لیست برای محصولات Creating a list endpoint for products

• چالش: ایجاد نقطه پایانی حذف از سبد خرید Challenge: Creating a remove-from-cart endpoint

• راه حل: ایجاد یک نقطه پایانی حذف از سبد خرید Solution: Creating a remove-from-cart endpoint

• کنترلرهای مسیر Next.js چیست؟ What are Next.js route handlers?

• تست گردانندگان مسیر با Postman Testing route handlers with Postman

• ایجاد نقطه پایانی سبد خرید Creating a shopping cart endpoint

• ایجاد نقطه پایانی افزودنی به سبد خرید Creating an add-to-cart endpoint

• کنترلرهای مسیر Next.js چگونه کار می کنند؟ How do Next.js route handlers work?

• استفاده از پارامترهای مسیر در کنترلرهای مسیر Using route parameters in route handlers

3. افزودن MongoDB به Next.js 3. Adding MongoDB to Next.js

• بازنویسی نقطه پایان محصول بار Rewriting the load product endpoint

• راه اندازی هاست برای MongoDB Setting up hosting for MongoDB

• MongoDB چیست؟ What is MongoDB?

• بازنویسی نقاط پایانی لیست Rewriting the list endpoints

• بازنویسی نقطه پایانی سبد خرید Rewriting the shopping cart endpoint

• چالش: بازنویسی نقطه پایانی حذف از سبد خرید Challenge: Rewriting the remove-from-cart endpoint

• راه حل: بازنویسی نقطه پایانی remove-from-cart Solution: Rewriting the remove-from-cart endpoint

• افزودن MongoDB به Next.js Adding MongoDB to Next.js

• افزودن داده به MongoDB Adding data to MongoDB

• بازنویسی نقطه پایان افزودن به سبد خرید Rewriting the add-to-cart endpoint

4. اتصال Front End و Back End 4. Connecting the Front End and Back End

• بارگیری همه محصولات Loading all products

• بارگیری داده ها با Fetch Loading data with Fetch

• بارگیری محصولات جداگانه Loading individual products

• بارگیری اقلام سبد خرید Loading shopping cart items

• چالش: حذف اقلام از سبد خرید Challenge: Removing items from the cart

• بهبود سبد خرید Shopping cart improvements

• راه حل: حذف اقلام از سبد خرید Solution: Removing items from the cart

• اصول بارگیری داده ها در Next.js Data loading basics in Next.js

• افزودن اقلام به سبد خرید Adding items to the cart

5. میزبانی یک برنامه Next.js 5. Hosting a Next.js Application

• خاموش کردن برنامه Next.js Shutting down a Next.js app

• در حال آماده سازی یک برنامه برای انتشار Preparing an app for release

• انتشار یک برنامه Next.js Releasing a Next.js app

نتیجه گیری Conclusion

• مراحل بعدی در سفر کامل شما Next steps in your full-stack journey