آموزش ساخت اپلیکیشن های مقیاس پذیر React

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

بررسی اجمالی دوره Course Overview

• بررسی اجمالی دوره Course Overview

شروع شدن Getting Started

• مقدمه Introduction

• نگاهی سریع به آنچه در پشته است A Quick Look at What's in the Stack

• بالا آمدن پشته و اجرا بر روی دستگاه شما Getting the Stack up and Running on Your Machine

• نگاهی سریع به برخی از ویژگی های خوب در پشته A Quick Look at Some of the Nifty Features in the Stack

• بررسی انواع مختلف خطاها Inspecting Different Types of Errors

• آنچه در این دوره خواهیم ساخت What We'll Build in This Course

• افزایش تا شروع کدنویسی Ramping up to Start Coding

مقدمه‌ای بر ساخت اجزاء با راکت-بویلرپلیت An Introduction to Building Components with react-boilerplate

• مقدمه Introduction

• استفاده از داربست برای تولید کامپوننت Using Scaffolding to Generate Components

• دریافت کامپوننت کانتینر برای رندر در مسیر Getting a Container Component to Render on a Route

• دریافت داده ها از فروشگاه به کامپوننت شما Getting Data from the Store on to Your Component

بارگیری داده ها از سرور با Redux-saga Loading Data from the Server with Redux-saga

• مقدمه Introduction

• تعریف Action Creators Defining Action Creators

• ارسال یک اقدام از یک جزء کانتینر Dispatching an Action from a Container Component

• رهگیری اقدامات در حماسه برای اجرای منطق Intercepting Actions in a Saga to Execute Logic

• واکشی داده های سرور از یک حماسه Fetching Server Data from a Saga

• ذخیره داده ها در فروشگاه Redux از یک Saga Storing Data on the Redux Store from a Saga

• خلاصه Summary

مدیریت رویدادها با Redux-saga Handling Events with Redux-saga

• مقدمه Introduction

• رهگیری رویدادهای کاربر در داخل یک جزء کانتینر Intercept User Events Inside of a Container Component

• ذخیره ورودی کاربر در فروشگاه Redux Storing User Input on the Redux Store

• افزودن یک جزء کانتینر اضافی به یک مسیر موجود Adding an Additional Container Component to an Existing Route

• دریافت اطلاعات از سرور بر اساس ورودی کاربر Get Data from the Server Based on User Input

• ذخیره داده ها از سرور در فروشگاه Redux Storing Data from the Server on the Redux Store

• خلاصه Summary

استایل دادن به اجزای خود با CSS Styling Your Components with CSS

• مقدمه Introduction

• سبک دادن به مؤلفه AppBar Styling the AppBar Component

• ایجاد یک اکشن برای تغییر حالت دید جزء کشو Creating an Action to Toggle the Drawer Component's Visibility

• ایجاد کامپوننت کشو Creating the Drawer Component

• افزودن یک ظاهر طراحی شرطی بر اساس حالت Adding Conditional Styling Based on State

• حفظ حالت باز کشو در فروشگاه Redux Maintaining the Drawer's Open State on the Redux Store

• نمایش یا پنهان کردن مؤلفه کشو بر اساس وضعیت Show or Hide the Drawer Component Based on State

• ایجاد کامپوننت لینک Creating the Link Component

• سبک دادن به مؤلفه پیوند Styling the Link Component

• خلاصه Summary

اضافه کردن مسیرها به برنامه شما Adding Routes to your Application

• مقدمه Introduction

• رهگیری یک اقدام برای تغییر مسیر Intercepting an Action to Change the Route

• دریافت کامپوننت برای نمایش در مسیر کودک Getting a Component to Display on a Child Route

• استفاده از Reselect برای دسترسی به پارامترهای مسیر Using Reselect to Access Route Parameters

• بارگیری داده برای یک مؤلفه هنگامی که توسط یک مسیر بارگیری می شود Loading Data for a Component When It's Loaded by a Route

• جلوگیری از تزریق کد از طریق پارامترهای مسیر Preventing Code Injection Through Route Parameters

• هدایت مجدد به یک مسیر بر اساس داده های سرور هنگام بارگیری برنامه Redirecting to a Route Based on Server Data When the App Loads

• خلاصه Summary

ساخت فرم ها برای جمع آوری ورودی کاربر Building Forms to Gather User Input

• مقدمه Introduction

• دریافت یک مؤلفه جدید برای نمایش در مسیر خودش Getting a New Component to Show on Its Own Route

• چیدمان یک فرم Laying out a Form

• سیم کشی فرم با اعتبارسنجی Wiring a Form with Validation

• ارائه یک پیام اعتبار سنجی در یک فرم Presenting a Validation Message on a Form

• دریافت مقادیر فرم به حالت Getting Form Values onto State

• بازگشت به مسیر قبلی Navigating Back to the Previous Route

• انتخاب داده ها از قسمت حالت یک جزء کانتینر دیگر Selecting Data from Another Container Component's Part of State

• خلاصه Summary

دستیابی به استفاده مجدد از کامپوننت Achieving Component Reuse

• مقدمه Introduction

• دریافت کامپوننت فرم پیوند برای رندر در یک مسیر Getting the Link Form Component to Render on a Route

• شکل دادن به مؤلفه فرم پیوند Fleshing out the Link Form Component

• نمایش یک جزء در یک گفتگو Displaying a Component in a Dialogue

• ایجاد یک مؤلفه عمومی جدید برای ورودی متن Creating a New Generic Component for Text Input

• استفاده از مؤلفه ورودی متن عمومی جدید Using the New Generic Text Input Component

• تغییر مؤلفه ورود به سیستم برای استفاده از مؤلفه ورودی متن Changing the Login Component to Use the Text Input Component

• خلاصه Summary

مقابله با یک ویژگی پیچیده واقع گرایانه با مهارت های جدید خود Tackling a Realistically Complex Feature with Your New Skills

• مقدمه Introduction

• ایجاد کامپوننت دکمه آیکون Creating an Icon Button Component

• گسترش مؤلفه دکمه نماد جدید با سبک Extending the New Icon Button Component with Style

• راه اندازی یک اقدام برای نمایش مسیر افزودن Triggering an Action to Show the Add Route

• وصل کردن اعتبارسنجی برای فرم پیوند Hooking up Validation for the Link Form

• دریافت یک اقدام برای آتش زدن حاوی پیوند جدید Getting an Action to Fire Containing a New Link

• ذخیره لینک جدید در سرور Saving the New Link to the Server

• نمایش یک شی تازه ایجاد شده در داخل برنامه Showing a Newly Created Object Inside the App

• رد کردن گفتگوی افزودن پیوند Dismissing the Add Link Dialogue

• خلاصه Summary