قیمت این دوره : رایگانــ
  • مدرس دوره : محمد مطواعی ( رزومه )
  • تعداد دانشجویان این دوره : 1,493 نفر
  • تعداد ویدیوها : 18 ویدیو
  • مدت زمان دوره : 3:37:00
  • سطح دوره : پیشرفته
  • وضعیت دوره : در حال برگزاری
  • تاریخ آخرین بروزرسانی : 1399/04/23

دوره آموزش مقدماتی Next JS

سلام به ری اکت نویسای عزیز

محمد مطواعی هستم و یه سوپرایز دارم براتون آموزش یه فریم ورک دیگه از ری اکت جی اس

خب همه برنامه نویسای ری اکت میدونن که ری اکت کنار همه خوبی ها و قشنگیایی که داره این مشکل رو داره که رابطش با گوگل خیلی خوب نیست و seo خوبی نداره ینی سایتایی که با ری اکت زده میشن خیلی دیر تر توسط ربات های گوگل ایندکس میشن و توصفحات اول دیرتر میان بالا اینم بخاطر client side rendering بودن ری اکته

Client side rendering ینی چی ؟ ینی تقریبا همه محتواهایی که باید توسط گوگل ایندکس بشن داخل مرورگر کاربر رندر میشن و نه سمت سرور و اینجوری باعث میشه سایتی که ربات گوگل تحویل میگیره یه سایت خالی از محتوا باشه و اینجوری دیگه seo سایت خیلی خوب درنمیاد

اما راه حل چیه ؟ راه حل اینه که ما به عنوان برنامه نویس بیایم و اپمون رو ssr کنیم ssr ینی server side rendering کردن اپ

next js اومده تا این بار سنگین رو ب دوش بگیره این کتابخونه میاد و صفحات سایت مارو یه دور prerender میکنه ینی از قبل جاوااسکریپتایی ک نوشتیم رو رندر میگیره و به کاربر یه صفحه html  پر از محتوا تحویل میده و زحمت کاربر رو کم میکنه اینجوری سرعت لود سایت هم خیلی بیشتر میشه و پروفورمنس بالا میره.

ما تواین آموزش نکس جی اس رو از صفر شروع میکنیم و کامل مفاهیم بیسیک اون رو پوشش میدیم بعد که مفاهیم تموم شدن میریم سراغ اینکه دانشمون رو تثبیت کنیم و سایت کافه بازار رو با next js طراحی میکنیم سایتی که درحال حاضر با فریم ورک ویو جی اس زده شده و با کتابخانه همتای next js ینی nuxt js ssr شده

خب من از قبل طراحی های مربوط به صفحاتمون رو توی adobe xd انجام دادم و قراره تو آموزش یه همچین سایتی رو پیاده سازی کنم تو هرکدوم ازین صفحات با کلی چیز جدید و چالش روبرو میشیم که باهم دیگه اونارو حل میکنیم

لیست صفحاتمون به این صورته

صفحه فیلم و سریال

صفحه بازی ها

صفحه برنامه ها

لیست دسته بندی های بازی ها و برنامه ها

و صفحه جزییات هر برنامه که شامل اسکرین شات های برنامه و نظرات اون میشه

دو سه تا صفحه استاتیک ساده درباره ما و تماس با ما هم اضافه کردیم سایتمون همه جوره کامل باشه

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

اگرم هنوز دقیق متوجه نشدی که next js  چیه و به چه کارت میاد میتونی 4 5 قسمت اول دوره که رایگان هست رو ببینی بعدش روی ثبت نام دوره فک کنی

اوکی توضیح دیگه کافیه بریم سراغ مباحث فنی دوره

تو دوره میبینمتون

پیش نیاز این دوره آشنایی با ری اکت میباشد

لطفا سوالات خود را راجع به این آموزش در این بخش پرسش و پاسخ مطرح کنید به سوالات در قسمت نظرات پاسخ داده نخواهد شد.

فهرستـــ ویدیوها

مدت زمان دوره 03:43:40
راهنما ! جهت دریافت لینک دانلود تمامی قسمت ها بر روی این لینک .کلیک کنید.
1
  • معرفی دوره

  • 00:03:30
  • رایگانــ

معرفی دوره

2
  • آشنایی با مفهوم CSR و SSR

  • 00:17:00
  • رایگانــ

تو این قسمت یاد میگیریم که csr , ssr چین و روش کار هرکدوم به چه شکله

3
  • کانفیگ پروژه جدید Next JS

  • 00:10:30
  • رایگانــ

تو این قسمت یه پروژه next js رو ایجاد میکنیم و با بخش های مختلفش اشنا میشیم

4
  • صفحات در Next JS

  • 00:09:00
  • رایگانــ

تو این قسمت یادمیگیریم چطوری با صفحات کار کنیم و صفحه جدید ایجاد کنیم

5
  • جابجایی بین صفحات

  • 00:13:00
  • رایگانــ

تو این قسمت یاد میگیریم چطور میشه بین صفحات جابجا شد

6
  • Dynamic Routing

  • 00:17:00
  • رایگانــ

تو این قسمت یاد میگیریم چطور route های داینامیک بزنیم بین صفحات

7
  • کار کردن با asset ها

  • 00:05:30
  • رایگانــ

تو این قسمت یاد میگیریم چطور میتونیم عکس و فایل به پروژمون اضافه کنیم

8
  • Meta data in Next JS

  • 00:06:30
  • رایگانــ

تو این قسمت یاد میگیرم با متا دیتا هایی مث title تو صفحاتمون کار کنیم

9
  • استایل دهی گلوبال

  • 00:09:10
  • رایگانــ

تو این قسمت استایل دهی به شیوه گلوبال رو یاد خواهیم گرفت

10
  • استایل دهی کامپوننت بیس

  • 00:09:00
  • رایگانــ

تو این قسمت به کامپوننت هامون استایل میدیم بدون اینکه استایل ها باهم به تداخل بخورن

11
  • مدیریت تم با استفاده از کتابخانه متریال

  • 00:19:30
  • رایگانــ

تو این قسمت کتابخونه متریال رو به پروژه اضافه میکنیم و یک تم واحد رو به پروژه میدیم

12
  • لیوت کلی پروژه

  • 00:14:30
  • رایگانــ

تو این قسمت یاد میگیریم چطور میشه ی لیوت کلی واسه اپمون داشته باشیم

13
  • فلسفه Prerendering در در Next JS

  • 00:19:00
  • رایگانــ

تو این قسمت حسابی در مورد prerendering تو next js صحبت میکنیم

14
  • prerendering به روش static generation - قسمت اول

  • 00:18:30
  • رایگانــ

تو این قسمت ب معرفی روش اول prerendering همراه با کد زنی و مثال میپردازیم

15
  • prerendering به روش static generation -قسمت دوم

  • 00:13:00
  • رایگانــ

تو این قسمت ب معرفی روش اول prerendering همراه با کد زنی و مثال میپردازیم

16
  • Prerendering به شیوه SSR

  • 00:09:00
  • رایگانــ

تو این قسمت روش دوم prerendering که همون ssr هست رو یاد خواهیم گرفت

17
  • تلفیق Static Generation و Client Side Data fetch

  • 00:13:30
  • رایگانــ

تو این قسمت به طور همزمان دو شیوه دیتا فچ رو انجام خواهیم داد

18
  • دیتا فچ با استفاده از SWR

  • 00:10:30
  • رایگانــ

تو این قسمت با swr اشنا میشیم و یاد میگیریم چطور میشه باهاش دیتافچ رو انجام داد

نظرات کاربران در رابطه با این دوره

جهت ثبت نظر باید در سایت عضو شوید و یا وارد سایت شده باشید .