آموزش Next.JS (کاملا پروژه محور)

در دنیای ری‌اکت (React.JS)، یکی از فریم‌ورک‌های محبوب با موقعیت های شغلی فراوان نکست جی ای (Next.js) است. فریم ورک Next.js در واقع یک محیط توسعه ساده بر پایه ری‌اکت است که منحنی یادگیری کوچکی دارد. یعنی حتی برنامه نویس های تازه کار فرانت اند هم می‌توانند به سرعت آن را یاد بگیرند.

جالب است بدانید که Next.js توسط شرکت‌های بزرگی مانند Spotify و Nike مورد استفاده قرار گرفته و همچنان از نظر محبوبیت در حال رشد است. علاوه بر این سایت Stack Overflow با انجام یک نظرسنجی این فریم ورک را به عنوان چهارمین فریم‌ورک محبوب در بین تمامی فریم‌ورک‌ها و فناوری‌های موجود در وب معرفی کرده است.

در این دوره چه مباحثی آموزش داده شده است؟

ما در این دوره به آموزش Next.JS به صورت کاملا پروژه محور می پردازیم. در این دوره شما از 0 تا 100 فریم ورک محبوب نکست جی اس را می آموزید و می توانید به طور عملی از آن در پروژه های مختلف خود استفاده کنید. ما در این دوره برای یادگیری بیشتر شما به کمک Next.js و React.js یک وبسایت را به طور کاملا full-stack طراحی می کنیم.

سرفصل های دوره آموزش Next.JS (کاملا پروژه محور)

1- آشنایی با Next.JS و دوره

• مقدمه
• ساخت یک سایت فول‌استک با Next.js
• آنچه که باید بدانید
• تنظیمات اولیه و فایل‌های تمرینی
• معرفی پروژه

2- ساخت یک رابط کاربری React با Next.js

• Next.js چیست؟
• راه‌اندازی یک پروژه Next.js
• ساخت صفحات
• ساخت یک لیست محصول
• استفاده از لینک‌های Next.js
• سفارشی‌سازی محتوا با پارامترهای مسیر
• ساخت یک لیست سبد خرید
• ساخت صفحه 404
• استایل‌دهی برنامه‌های Next.js با Tailwind CSS
• چالش: ساخت نوار ناوبری
• راه‌حل: ساخت نوار ناوبری

3- ساخت مسیرهای API در Next.js

• مدیریت‌کننده‌های مسیر Next.js چیستند؟
• مدیریت‌کننده‌های مسیر Next.js چگونه کار می‌کنند؟
• آزمون مدیریت‌کننده‌های مسیر با Postman
• ساخت یک endpoint لیست محصولات
• استفاده از پارامترهای مسیر در مدیریت‌کننده‌های مسیر
• ساخت یک endpoint سبد خرید
• ساخت endpoint افزودن به سبد خرید
• چالش: ساخت endpoint حذف از سبد خرید
• راه‌حل: ساخت endpoint حذف از سبد خرید

4- افزودن MongoDB به Next.js

• MongoDB چیست؟
• راه‌اندازی هاستینگ برای MongoDB
• افزودن MongoDB به Next.js
• افزودن داده‌ها به MongoDB
• بازنویسی endpointهای لیست
• بازنویسی endpoint بارگذاری محصول
• بازنویسی endpoint سبد خرید
• بازنویسی endpoint افزودن به سبد خرید
• چالش: بازنویسی endpoint حذف از سبد خرید
• راه‌حل: بازنویسی endpoint حذف از سبد خرید

5- اتصال فرانت‌اند و بک‌اند

• مبانی بارگذاری داده‌ها در Next.js
• بارگذاری داده‌ها با Fetch
• بارگذاری تمامی محصولات
• بارگذاری محصولات تک به تک
• بارگذاری اقلام سبد خرید
• افزودن اقلام به سبد خرید
• بهبودهای سبد خرید
• چالش: حذف اقلام از سبد خرید
• راه‌حل: حذف اقلام از سبد خرید

6- هاستینگ یک برنامه Next.js

• آماده‌سازی برنامه برای انتشار
• انتشار یک برنامه Next.js
• بستن یک برنامه Next.js

7- نتیجه‌گیری

• مراحل بعدی در مسیر فول‌استک شما

حاصل دوره

دانشجویان عزیز با گذراندن این دوره آموزشی به طور کامل با فریم ورک Next.js و نحوه استفاده از آن برای طراحی سایت های مختلف آشنا می شوند و می توانند به یک توسعه دهنده نکست جی اس حرفه ای تبدیل شوند.