کانال تلگرام پشتیبانی تلگرام شماره تماس پشتیبانی: 0930 395 3766
ورود ثبت نام

Next.js: چارچوب React

Next.js: The React Framework

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره: با Next.js برنامه کامل و آماده تولید بسازید. با انجام کار بیاموزید و تجربه عملی کسب کنید. React Developer شوید. ویژگی ها و مزایای اصلی Next js را نسبت به توسعه سنتی React درک کنید. پروژه های جدید Next js را به طور کارآمد تنظیم و ساختار دهید. پیاده سازی تکنیک های مسیریابی مختلف، از ابتدایی تا پیشرفته، از جمله مسیرهای تودرتو و موازی. مسلط بر رهگیری مسیرها برای کنترل بهتر روی ناوبری کاربر. روش‌های استایل‌سازی متنوع را در Next js کاوش کنید، مانند ماژول‌های CSS، Sass و styled-jsx. با نحوه مدیریت دارایی ها و بهینه سازی تصاویر برای بهبود عملکرد آشنا شوید. بهترین شیوه های متادیتا و سئو را برای افزایش دید وب سایت پیاده سازی کنید. روش های مختلف واکشی داده ها را در Next js (SSR، SSG، سمت مشتری) درک کنید. پروژه ها را با Prisma و SQLite بسازید و از کنترلرهای مسیر Next js برای مدیریت داده ها استفاده کنید. مسیرهای API را به طور موثر ایجاد و مدیریت کنید. از قدرت Middleware و Edge Runtime برای بهبود عملکرد استفاده کنید. برای تجربه کاربری روان تر، رابط کاربری بارگیری سفارشی را پیاده سازی کنید. یک صفحه 404 سفارشی برای راهنمایی بهتر کاربر ایجاد کنید. یاد بگیرید که چگونه خطاهای بخش زمان اجرا و خطاهای سراسری را به طور موثر مدیریت و مدیریت کنید. با ساختن پروژه های عملی با استفاده از Next js 14، مفاهیم آموخته شده را به کار ببرید. در استقرار برنامه های Next js در Vercel، از جمله ادغام GitHub، مهارت کسب کنید. سوالات متداول مصاحبه و مفاهیم ضروری Next js برای پیشرفت شغلی را مرور کنید. پیش نیازها: اشتیاق و عزم برای گذاشتن اثر خود در جهان!

یک خوش آمدگویی گرم به دوره Next.js توسط Uplatz.


Next.js یک فریم ورک محبوب React برای ساخت برنامه های کاربردی وب و وب سایت های ایستا رندر شده از سمت سرور (SSR) است. این نرم افزار که توسط Vercel توسعه یافته است، توسعه برنامه های React را با ارائه طیف وسیعی از ویژگی هایی که عملکرد، مقیاس پذیری و تجربه توسعه دهنده را افزایش می دهد، ساده می کند.


Next.js چگونه کار می کند

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

  1. رندر سمت سرور (SSR)

    • درخواست اولیه: وقتی کاربر صفحه ای را درخواست می کند، Next.js HTML را برای بارگذاری اولیه روی سرور ایجاد می کند. این باعث بهبود سئو و زمان بارگذاری صفحه می شود.

    • Hydration: پس از بارگیری اولیه، Next.js بسته جاوا اسکریپت را برای مشتری ارسال می کند که صفحه را "هیدراته" می کند و آن را تعاملی می کند.

  2. تولید سایت ایستا (SSG)

    • پیش رندر: برای صفحات استاتیک، Next.js در زمان ساخت HTML تولید می کند که مستقیماً از یک CDN ارائه می شود. این زمان بارگذاری سریع را فراهم می کند و عملکرد را بهبود می بخشد.

  3. مسیرهای API

    • توابع بدون سرور: Next.js به شما امکان می دهد مسیرهای API را مستقیماً در برنامه خود تعریف کنید. اینها توابع بدون سرور هستند که منطق پشتیبان را مدیریت می کنند و می توانند برای کارهایی مانند ارسال فرم یا واکشی داده ها استفاده شوند.

  4. مسیریابی مبتنی بر فایل

    • مسیرهای پویا: Next.js از یک سیستم مسیریابی مبتنی بر فایل استفاده می کند که در آن ساختار فایل در فهرست صفحات با مسیرهای موجود در برنامه مطابقت دارد. مسیرهای پویا را می توان با استفاده از نام فایل های محصور در پرانتز ایجاد کرد.

  5. تقسیم خودکار کد

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

  6. پشتیبانی از CSS و Sass

    • پشتیبانی داخلی: Next.js پشتیبانی داخلی برای CSS و Sass ارائه می دهد. می‌توانید استایل‌ها را مستقیماً به مؤلفه‌های خود وارد کنید یا از ماژول‌های CSS برای استایل‌بندی محدوده استفاده کنید.


ویژگی های کلیدی Next.js


  1. رندر سمت سرور (SSR)

    • تولید HTML در سرور را برای هر درخواست فعال می‌کند، SEO و زمان بارگذاری را بهبود می‌بخشد.

  2. تولید سایت ایستا (SSG)

    • اجازه می دهد تا صفحات را در زمان ساخت از قبل رندر کنید که در نتیجه عملکرد سریع و استقرار آسان را به همراه دارد.

  3. بازسازی استاتیک افزایشی (ISR)

    • به روز رسانی محتوای ثابت را پس از ساخت بدون بازسازی کل سایت فعال می کند. این اجازه می دهد تا صفحات استاتیک به صورت تدریجی به روز شوند.

  4. مسیریابی مبتنی بر فایل

    • از یک سیستم مسیریابی مبتنی بر فایل ساده استفاده می کند که در آن فایل های موجود در فهرست صفحات به طور خودکار به مسیرهایی در برنامه تبدیل می شوند.

  5. مسیرهای API

    • راهی برای ایجاد نقاط پایانی باطن به عنوان توابع بدون سرور، ساده‌سازی مدیریت منطق سمت سرور ارائه می‌دهد.

  6. تقسیم خودکار کد

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

  7. پشتیبانی داخلی CSS و Sass

    • از وارد کردن فایل‌های CSS و Sass به همراه ماژول‌های CSS برای سبک‌های محدوده پشتیبانی می‌کند.

  8. پشتیبانی از TypeScript

    • پشتیبانی خارج از جعبه TypeScript، ادغام TypeScript را در برنامه Next.js آسان می کند.

  9. بهینه سازی تصویر

    • یک جزء Image را برای بهینه سازی خودکار تصاویر، از جمله بارگذاری تنبل و اندازه پاسخگو ارائه می دهد.

  10. بازخوانی سریع

    • به‌روزرسانی سریع برای مؤلفه‌های React، ارائه بازخورد فوری در حین توسعه بدون از دست دادن حالت مؤلفه.

Next.js این ویژگی‌ها را ترکیب می‌کند تا یک چارچوب بسیار کارآمد و مناسب برای توسعه‌دهندگان برای ساخت برنامه‌های کاربردی وب مدرن ایجاد کند و مزایای رندر استاتیک و پویا را متعادل کند.


Next.js - برنامه درسی دوره


ماژول 1: مقدمه ای بر Next.js

  1. شروع به کار با Next.js: نمای کلی و مزایا

    • توضیحات: مقدمه ای بر Next.js، بررسی ویژگی های اصلی آن و مزایایی که برای توسعه وب مدرن ارائه می دهد.

  2. شروع پروژه Next.js شما: راه اندازی و ساختار

    • توضیحات: نحوه ایجاد یک برنامه Next.js با استفاده از دستور create-next-app و پیمایش ساختار پوشه پروژه را بیاموزید.

ماژول 2: مسیریابی در Next.js

  1. تسلط بر مسیریابی Next.js: از اصول اولیه تا تکنیک های پیشرفته

    • توضیحات: تکنیک‌های مسیریابی مختلف را در Next.js کشف کنید، از جمله مسیرهای اساسی، پویا، تودرتو و catch-all برای ساخت برنامه‌های پیچیده.

  2. ایجاد ناوبری کارآمد با مسیرهای موازی در Next.js

    • توضیحات: با توسعه یک برنامه کاربردی کوچک و کاربردی برای بهبود ناوبری، مسیرهای موازی را در Next.js پیاده سازی کنید.

  3. تکنیک های مسیریابی پیشرفته: رهگیری مسیرها در Next.js

    • توضیحات: تکنیک‌هایی را برای رهگیری مسیرها، از جمله رهگیری مسیرهای نرم و مستقیم، برای بهبود ناوبری و جریان کاربر کاوش کنید.

ماژول 3: استایل سازی در Next.js

  1. سبک دادن به برنامه Next.js: راهنمای جامع

    • توضیحات: یک بررسی عمیق در روش‌های استایل‌سازی موجود در Next.js 14، از جمله ماژول‌های CSS، Sass، styled-jsx، و سایر روش‌ها برای سبک‌سازی مؤثر برنامه شما.

ماژول 4: مدیریت دارایی و SEO

  1. بهینه سازی تصاویر، متادیتا و سئو در Next.js

    • توضیحات: نحوه مدیریت تصاویر و فایل های ثابت، پیکربندی ابرداده برای صفحات و پیاده سازی تکنیک های بهینه سازی SEO برای افزایش دید سایت خود را بیاموزید.

ماژول 5: مدیریت داده

  1. واکشی داده در Next.js: بهترین روش‌ها و تکنیک‌ها

    • توضیحات: روش‌های مختلف واکشی داده‌ها را در Next.js کاوش کنید، از جمله رندر سمت سرور (SSR)، ایجاد سایت استاتیک (SSG) و واکشی سمت مشتری برای بهبود عملکرد برنامه.

  2. پروژه Next.js با Prisma و SQLite: یک رویکرد عملی

    • توضیحات: یک پروژه با استفاده از Prisma برای مدیریت پایگاه داده و SQLite ایجاد کنید، با استفاده از آخرین کنترل‌کننده‌های مسیر Next.js برای مدیریت مؤثر داده‌ها.

ماژول 6: API Routes and Middleware

  1. ساخت و مدیریت مسیرهای API در Next.js

    • توضیحات: مروری جامع از ایجاد و مدیریت مسیرهای API در Next.js، از جمله استراتژی‌های مسیریابی مختلف و بهترین شیوه‌ها.

  2. استفاده از قدرت میان‌افزار در Next.js

    • توضیحات: بحث عمیق در مورد Next.js Middleware و Edge Runtime، با مثال‌های عملی از نحوه پیاده‌سازی آنها برای بهبود عملکرد برنامه.

ماژول 7: بهبود تجربه کاربر

  1. افزایش UX با رابط کاربری بارگیری سفارشی در Next.js

    • توضیحات: روش‌های مختلف را برای ایجاد حالت‌های بارگذاری مؤثر در برنامه خود، بهبود تجربه کاربر در حین واکشی داده یا انتقال صفحه، کاوش کنید.

  2. ایجاد یک صفحه سفارشی 404 در Next.js: افزایش تجربه کاربر

    • توضیحات: بیاموزید که چگونه یک صفحه سفارشی "Not Found" در Next.js طراحی کنید و اطلاعات مربوط به سایت را برای راهنمایی کاربران در هنگام مواجهه با صفحه گم شده نمایش دهید.

ماژول 8: رسیدگی به خطا

  1. مدیریت خطا در Next.js: مدیریت زمان اجرا و خطاهای جهانی

    • توضیحات: نحوه مدیریت و مدیریت خطاهای بخش زمان اجرا و خطاهای کلی را در برنامه های Next.js خود برای اطمینان از استحکام و قابلیت اطمینان بدانید.

ماژول 9: پروژه های ساختمانی

  1. پروژه عملی: ساخت با Next.js 14

    • توضیحات: با ساختن یک پروژه کوچک که دارای ویژگی های مختلف Next.js 14 است، مفاهیم آموخته شده را به کار ببرید و درک خود را از طریق کاربرد عملی تقویت کنید.

  2. ساخت یک پروژه با Prisma و SQLite: یک رویکرد عملی

    • توضیحات: با Prisma و SQLite در پروژه‌های ساختمانی عمیق‌تر غوطه‌ور شوید و از جدیدترین کنترل‌کننده‌های مسیر Next.js برای مدیریت داده‌ها و یکپارچه‌سازی باطن استفاده کنید.

ماژول 10: استقرار

  1. استقرار برنامه های Next.js: راهنمای کامل برای Vercel

    • توضیحات: راهنمای گام به گام در مورد استقرار برنامه Next.js خود در Vercel، از جمله ادغام با GitHub و مدیریت استقرارها برای به روز رسانی یکپارچه.

ماژول 11: آماده سازی مصاحبه

  1. مصاحبه‌های Ace Your Next.js: سوالات و مفاهیم کلیدی

    • توضیحات: سوالات متداول مصاحبه و مفاهیم ضروری مربوط به Next.js را مرور کنید تا به طور موثر برای مصاحبه های شغلی آماده شوید و تخصص خود را نشان دهید.

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

معرفی Next.js Introduction to Next.js

  • معرفی Next.js Introduction to Next.js

شروع پروژه Next.js Starting Next.js Project

  • شروع پروژه Next.js Starting Next.js Project

مسیریابی Routing

  • مسیریابی Routing

یک ظاهر طراحی شده Styling

  • یک ظاهر طراحی شده Styling

تصاویر، فایل های استاتیک، متادیتا و سئو Images, Static Files, Metadata, and SEO

  • تصاویر، فایل های استاتیک، متادیتا و سئو Images, Static Files, Metadata, and SEO

واکشی داده ها Data Fetching

  • واکشی داده ها Data Fetching

مسیرهای API API Routes

  • مسیرهای API API Routes

میان افزار Middleware

  • میان افزار Middleware

پروژه کوچک Small Project

  • پروژه کوچک Small Project

استقرار Deployment

  • استقرار Deployment

پروژه Prisma و SQLite Prisma and SQLite Project

  • پروژه Prisma و SQLite Prisma and SQLite Project

صفحه سفارشی 404 Custom 404 Page

  • صفحه سفارشی 404 Custom 404 Page

در حال بارگیری رابط کاربری Loading UI

  • در حال بارگیری رابط کاربری Loading UI

مسیرهای موازی Parallel Routes

  • مسیرهای موازی Parallel Routes

رسیدگی به خطاها Handling Errors

  • رسیدگی به خطاها Handling Errors

رهگیری مسیرها Intercepting Routes

  • رهگیری مسیرها Intercepting Routes

سوالات مصاحبه Next.js Next.js Interview Questions

  • سوالات مصاحبه Next.js Next.js Interview Questions

آزمون پایان دوره End of Course Quiz

  • آزمون پایان دوره End of Course Quiz

آموزش AWS Certified Solutions Architect - Associate (SAA-C02): 5 هویت و مدیریت دسترسی

آموزش AWS Certified Solutions Architect - Associate (SAA-C02): 5 هویت و مدیریت دسترسی

AWS Certified Solutions Architect - Associate (SAA-C02): 5 Identity and Access Management

آموزش من ستاره‌ها را می‌بینم - اشکال به شکل در Adobe Illustrator - طراحی گرافیکی برای کلاس ناهار

آموزش من ستاره‌ها را می‌بینم - اشکال به شکل در Adobe Illustrator - طراحی گرافیکی برای کلاس ناهار

I'm Seeing Stars - Shapes in Shapes in Adobe Illustrator - A Graphic Design for Lunch™ Class

آزمون آزمایشی حرفه ای Google Workspace Administrator

آزمون آزمایشی حرفه ای Google Workspace Administrator

Professional Google Workspace Administrator Mock Exam Test

نمایش نظرات

Udemy (یودمی)

یودمی یکی از بزرگ‌ترین پلتفرم‌های آموزشی آنلاین است که به میلیون‌ها کاربر در سراسر جهان امکان دسترسی به دوره‌های متنوع و کاربردی را فراهم می‌کند. این پلتفرم امکان آموزش در زمینه‌های مختلف از فناوری اطلاعات و برنامه‌نویسی گرفته تا زبان‌های خارجی، مدیریت، و هنر را به کاربران ارائه می‌دهد. با استفاده از یودمی، کاربران می‌توانند به صورت انعطاف‌پذیر و بهینه، مهارت‌های جدیدی را یاد بگیرند و خود را برای بازار کار آماده کنند.

یکی از ویژگی‌های برجسته یودمی، کیفیت بالای دوره‌ها و حضور استادان مجرب و با تجربه در هر حوزه است. این امر به کاربران اعتماد می‌دهد که در حال دریافت آموزش از منابع قابل اعتماد و معتبر هستند و می‌توانند به بهترین شکل ممکن از آموزش‌ها بهره ببرند. به طور خلاصه، یودمی به عنوان یکی از معتبرترین و موثرترین پلتفرم‌های آموزشی آنلاین، به افراد امکان می‌دهد تا به راحتی و با کیفیت، مهارت‌های مورد نیاز خود را ارتقا دهند و به دنبال رشد و پیشرفت شغلی خود باشند.

Next.js: چارچوب React
جزییات دوره
5 hours
17
Udemy (یودمی) Udemy (یودمی)
(آخرین آپدیت)
2,284
4.5 از 5
ندارد
دارد
دارد

https://donyad.com/d/e276dd

جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Uplatz Training Uplatz Training

سریعترین رشد ارائه دهنده آموزش جهانی فناوری اطلاعات Uplatz پیشرو در انگلستان است که ارائه دهنده خدمات آموزش فناوری اطلاعات به دانشجویان در سراسر جهان است. منحصر به فرد بودن ما از آنجا ناشی می شود که ما دوره های آموزشی آنلاین را با کسری از متوسط هزینه این دوره ها در بازار ارائه می دهیم. تخصص ما شامل SAP ، Oracle ، Salesforce ، AWS ، Microsoft Azure ، Google Cloud ، IBM Cloud ، Science data ، Python ، JavaScript ، Java ، Digital Marketing ، Agile و DevOps است. Uplatz که در مارس 2017 تاسیس شد ، شاهد افزایش خارق العاده ای در صنعت آموزش است که با یک دوره آنلاین SAP FICO شروع می شود و اکنون آموزش 500+ دوره را در 54 کشور جهان ارائه داده است که طی 10 سال به 10 هزار دانشجو خدمت کرده اند. آموزش Uplatz بسیار با ساختار ، موضوع محور و شغل محور است و تأکید زیادی بر تمرین و تکالیف در سرورهای زنده دارد. دوره های ما توسط بیش از هزار مربی بسیار ماهر و باتجربه طراحی و تدریس می شوند که در زمینه های خود اعم از SAP ، Cloud ، Oracle یا هر فناوری یا سیستم درخواستی تخصص کافی دارند.