پرووید
منو
آموزش ساخت وب اپلیکیشن با ASP.NET Core و React
دسته بندی: توسعه نرم افزارهای وب (Web Development)موضوعات: JavaScript | Node.js | React

آموزش ساخت وب اپلیکیشن با ASP.NET Core و React

زبان: فارسی (دوبله شده)مترجم: پروویددوبلر: پروویدسطح: پیشرفتهمدت زمان: 03:14:13تعداد ویدئوها: 54فایل های پروژه: ناموجود
قیمت:۳٬۹۹۹٬۰۰۰ تومان
ورود و افزودن به سبددانلود دمو
این آموزش بخشی از پکیج کامل آموزش ری اکت (React) است که می توانید از تمامی آموزش های آن دیدن کنید.

آموزش ساخت وب اپلیکیشن با ASP.NET Core و React یکی دیگر از آموزش های گروه آموزشی پرووید می باشد که در این قسمت آن را به شما معرفی می کنیم. این بسته ی آموزشی نیز یکی از دوره های آموزشی دیگر که در حوزه ی فارسی سازی آموزش های انگلیسی تنظیم شده است می باشد. عنوان این بسته ی آموزشی ساخت وب اپلیکیشن با ASP.NET Core و React است که با نام اصلی Building a Website with React and ASP.NET Core از شرکت Pluralsight منتشر شده است.

ASP.NET Core چیست؟

ASP.NET Core 1.0، که پیشتر با نام ASP.NET 5 معرفی شده بود، بازنویسی کامل ASP.NET است که با ایده‌ی کاملا ماژولار بودن، تهیه شده‌ است و از طریق آن، قابلیت به روز رسانی منظم و توزیع آسان از طریق NuGet، میسر خواهد شد. به علاوه در آن، بسیاری از الگوهای برنامه نویسی شیء‌گرا مانند Dependency Injection، به صورت built-in و از ابتدا پشتیبانی می‌شوند. ASP.NET Core 1.0 مدل برنامه نویسی ASP.NET MVC و Web API را به صورت یکپارچه ارائه می‌دهد و دیگر خبری از ارائه‌ی مجزای این‌ ها نخواهد بود و دقیقا بر مبنای مفاهیم برنامه نویسی این دو بنا شده‌ است.

Introducing Custom Webpack Integration - نمونه ای از بخش Building a Custom Webpack Configuration for React and Core در آموزش ساخت وب اپلیکیشن با ASP.NET Core و React
نمونه ای از بخش «Building a Custom Webpack Configuration for React and Core» در آموزش ساخت وب اپلیکیشن با ASP.NET Core و React

پیشتر فضای نام System.Web.MVC مخصوص ASP.NET MVC بود و فضای نام مجزای دیگری به نام System.Web.Http مخصوص ASP.NET Web API. اما اکنون تنها یک فضای نام مشترک و یکپارچه به نام Microsoft.AspNet.Mvc هر دوی این‌ها را پوشش می‌ دهد.

React چیست؟

React یک Libarary متن باز و البته رایگان جاوا اسکریپت برای طراحی رابط کاربری است. این کتابخانه جاوا اسکریپت در ماه مه سال ۲۰۱۳ به صورت عمومی منتشر شد. جالب است بدانید که این فریم ورک در ابتدا توسط یکی از مهندسین فعال در فیسبوک به وجود آمد. آقای جردن واک در سال ۲۰۱۱ این فریم ورک را تحت تاثیر XHP که یک کامپوننت HTML برای زبان برنامه نویسی PHP‌ است، ایجاد کرد. در همین سال React روی قسمت News Feed شبکه اجتماعی فیسبوک به کار گرفته شد و ۲ سال بعد، یعنی در سال ۲۰۱۳ هم استفاده از آن توسط فیسبوک به اینستاگرام تعمیم پیدا کرد.

Introduction - نمونه ای از بخش Making REST API Calls from React to ASP. NET Core در آموزش ساخت وب اپلیکیشن با ASP.NET Core و React
نمونه ای از بخش «Making REST API Calls from React to ASP. NET Core» در آموزش ساخت وب اپلیکیشن با ASP.NET Core و React

نکته مهم در کاربرد React این است که این کتابخانه صرفاً در الگوی طراحی MVC، عهده‌ دار بخش View است. View یا اینترفیس در واقع مرتبط با نمایش اجزا هستند و طبعاً React به جای پرداختن به الگوی MVC به وظایفی می‌ پردازد که مربوط به نمایش اجزا می‌ پردازد. از دیگر کاربردهای React استفاده در طراحی و ایجاد سایت تک صفحه‌ای است.

انتخاب روش اتصال React به ASP.NET Core در یک وب‌اپلیکیشن

در آموزش Building a Website with React and ASP.NET Core، ساخت یک وب‌اپلیکیشن به بررسی روش‌های مختلف ترکیب رابط کاربری React با Backend مبتنی بر ASP.NET Core پیوند می‌خورد. یکی از مسیرهای آموزش، ایجاد پیکربندی سفارشی Webpack است؛ مسیری که کنترل بیشتری بر فرایند آماده‌سازی و بسته‌بندی کدهای سمت کاربر فراهم می‌کند. در مقابل، شروع کار با create-react-app و استفاده از Template های ASP.NET Core نیز بررسی می‌شود. شناخت تفاوت این گزینه‌ها به توسعه‌دهنده کمک می‌کند بر اساس نیازهای پروژه، پیچیدگی تنظیمات و شیوه یکپارچه‌سازی را ارزیابی کند.

محتوای آموزش تنها به راه‌اندازی اولیه محدود نمی‌شود و ارتباط میان React و ASP.NET Core از طریق REST API Call ها را نیز پوشش می‌دهد. در چنین ساختاری، React می‌تواند رابط کاربری را مدیریت کند و برای دریافت داده به Backend درخواست بفرستد. درس‌های مربوط به ساخت Component و بارگذاری داده‌ها با Redux Action و Reducer، بخش‌هایی از این جریان را به‌صورت عملی نشان می‌دهند. برای توسعه‌دهنده‌ای که با هر دو فناوری آشنایی دارد، این مباحث به درک تصمیم‌های معماری مربوط به اتصال لایه نمایش، مدیریت State و سرویس‌های سمت سرور کمک می‌کنند.

Server-Side Rendering و مدیریت وضعیت در برنامه React

یکی از موضوعات متمایز این آموزش، بررسی Server-Side Rendering در کنار درخواست‌های REST است. با استفاده از ReactDOM.renderToString می‌توان خروجی HTML اولیه را در سمت سرور تولید کرد؛ رویکردی که با رندر کردن رابط کاربری صرفاً در مرورگر تفاوت دارد. آموزش همچنین Template های ASP.NET Core دارای قابلیت Server-Side Rendering را بررسی می‌کند و به این می‌پردازد که این روش در کنار سایر راهبردهای یکپارچه‌سازی چه مزایا و محدودیت‌هایی دارد. این مباحث برای زمانی کاربرد دارند که نحوه تولید HTML اولیه و تعامل میان سرور و کلاینت بخشی از تصمیم طراحی پروژه باشد.

در سمت کلاینت، آموزش ساخت Redux Action و Reducer برای بارگذاری داده و بررسی تغییرات State با Chrome DevTools را پوشش می‌دهد. این ابزارها به شما کمک می‌کنند جریان داده را دنبال کنید و هنگام تغییر وضعیت برنامه، علت رفتار رابط کاربری را بهتر بررسی کنید. اضافه کردن Session، Style و Interaction نیز بخش‌هایی از تکمیل تجربه کاربر را در بر می‌گیرد. علاوه بر این، استفاده از SASS به‌عنوان Preprocessor در پروژه مبتنی بر create-react-app مطرح می‌شود. در مجموع، این درس‌ها چند لایه از توسعه یک وب‌اپلیکیشن را کنار هم قرار می‌دهند: رندر سمت سرور، مدیریت State، سبک‌دهی و تعامل کاربر.

سرفصل مطالب آموزش ویدئویی ساخت وب اپلیکیشن با ASP.NET Core و React

فصل اول: مقدمه ی دوره ی آموزشی
  • مقدمه
فصل دوم: نحوه ی ساختن اپلیکیشن های Connected و Single Page با React
  • یادگیری React با ASP.NET Core به عنوان Backend
  • سه تکنیک برای Integrate کردن React با ASP.NET Core
  • بررسی سورس کد برنامه در GitHub
فصل سوم: ساخت یک Webpack Configuration سفارشی برای React و Core
  • معرفی Custom Webpack سفارشی
  • یادگیری Build Tool های جاوااسکریپت
  • یادگیری استفاده از webpack-dev-server
  • استفاده از React و ساختن اولین Component
  • اضافه کردن React Router به برنامه
  • به روزرسانی کردن مثال به یک Conference Web Site
  • چرا کار ما اینجا تمام نشده است و مبحث Server Side Rendering
  • شکستن WebPack Config به دو قسمت
  • پیاده سازی Server Side Render و URL Validation
  • استفاده از ReactDOM.renderToString برای تولید کردن Static HTML
  • Integrate کردن React با ASP.NET Core
  • جمع بندی
فصل چهارم: Integrate کردن create-react-app مربوط به Facebook با ASP.NET Core
  • معرفی کردن create-react-app
  • شروع به کار با create-react-app
  • بررسی مازول react-scripts
  • معایب استفاده از create-react-app
  • اضافه کردن SASS CSS به عنوان یک Preprocessor به create-react-app
  • تبدیل کردن یک برنامه React به create-react-app
  • Tight Couple کردن create-react-app به ASP.NET Core
  • جمع بندی
فصل پنجم: استفاده از Template های ASP.NET Core برای ساخت برنامه های React
  • دلیل استفاده از React Template های مایکروسافت
  • تغییر عمده مربوط به React Template ها در ASP.NET Core 2.1
  • چرا مایکروسافت به سمت create-react-app رفت؟
  • Template های مایکروسافت Server Side Rendering
  • جمع بندی
فصل ششم: انجام REST API Call ها از React به ASP.NET Core
  • مقدمه
  • یادگیری Axios برای انجام REST Call
  • پیاده سازی Axios برای به دست آوردن داده بر روی Speaker Component
  • ساختن Redux Action و Reducer ها برای Load کردن داده ها
  • یادگیری دقیق تر Redux Speaker Reducer
  • یادگیری اینکه یک Redux Action چگونه داده ی یک React Component به روز رسانی می کند
  • دیباگ کردن تغییرات Redux State با Chrome Dev Tools
  • اضافه کردن JSON Server به متدهای GET و PUT و POST و DELETE در REST
  • ارسال REST PUT برای انجام Update به JSON Server
  • اضافه کردن Session و Style و Interaction به وب اپلیکیشن
  • پیاده سازی Axios برای به دست آوردن داده بر روی Speaker Component
  • Integrate کردن یک سایت React که Decouple شده است به ASP.NET Core
  • اضافه کردن Development Time Only به عنوان یک Middleware به React Redux
  • جمع بندی
فصل هفتم: پیاده سازی Server Side Rendering که شامل REST Call باشند
  • معرفی کردن Integrate کردن داده های REST به درون Server Side Rendering HTML
  • برنامه ی اضافه کردن داده های REST به Server Rendered HTML
  • جایگزین کردن Route Element ها با Declarative Definition ها با استفاده از renderRoutes
  • انجام کارهای Node Server
  • Sync کردن HTML تولید شده در سمت سرور با جاوااسکریپت سمت کلاینت
  • جمع بندی
فصل هشتم: مزایا و معایب استفاده از Integration Strategy ها
  • نگاهی کلی به گزینه های Build کردن
  • راهکار React Template مایکروسافت
  • استفاده از create-react-app برای ساخت یک وب اپلیکیشن
  • اضافه کردن REST
  • جمع بندی

محصولات مرتبط

دیدگاه کاربران

دیدگاه ها

برای ثبت دیدگاه ابتدا وارد حساب کاربری شوید.
هنوز دیدگاهی برای این محصول تایید نشده است.