در دوره Building Scalable React Apps (ساخت برنامههای ری اَکت مقیاس پذیر) موسسه Pluralsight، شما گمانه زنیها را با استک React-Boilerplate کنار خواهید گذاشت تا بدون اینکه نیاز داشته باشید که استک خود را با هر افزودنی جدید تکامل دهید، بتوانید به ارائه ویژگیها ادامه دهید.
در این دوره، ابتدا نحوهی استفاده از redux-saga را یاد خواهید گرفت تا با ظرافت، اثرات جانبی به برنامهی خودتان اضافه کنید. در ادامه، شما بر یادگیری نحوه استفاده از انتخاب مجدد (reselect) برای محاسبه مقادیر بر فراز redux store خود تمرکز خواهید کرد. در نهایت، شما یاد میگیرید که چگونه کامپوننتهای خود را طوری طراحی کنید که تا حد امکان ساده، قابل حمل و قابل آزمایش باشند. پس از تماشای این دوره، میتوانید به تنهایی یا با یک تیم با برنامههای بزرگ React دست و پنجه نرم کنید.
Table of Contents:
- 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
- Loading Data from the Server with Redux-saga
- Introduction
- Defining Action Creators
- Dispatching an Action from a Container Component
- Intercepting Actions in a Saga to Execute Logic
- Fetching Server Data from a Saga
- Storing Data on the Redux Store from a Saga
- Summary
- Handling Events with Redux-saga
- Introduction
- Intercept User Events Inside of a Container Component
- 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
- Storing Data from the Server on the Redux Store
- Summary
- Styling Your Components with CSS
- Introduction
- Styling the AppBar Component
- Creating an Action to Toggle the Drawer Component's Visibility
- Creating the Drawer Component
- Adding Conditional Styling Based on State
- 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
- 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