React & Redux Hero: برنامه وب ایمن و مقیاس پذیر بسازید!!

React & Redux Hero: Build secured , scalable Web App !!

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره: ساختار برنامه React پیشرفته، الگوهای کدنویسی، بهینه سازی عملکرد، احراز هویت و امنیت را بیاموزید. نوشتن کد فرانت‌اند درجه تولید روش صحیح مدیریت احراز هویت و مجوز در فرانت‌اند استفاده از قلاب‌های پیشرفته و نوشتن قلاب‌های سفارشی در دنیای واقعی React موارد استفاده از Context API React بهبود ساختار کد شما برای ایجاد مقیاس‌پذیر و قابل حفظ برنامه ارائه عملکرد/انحراف/کاهش قدرت/خوش‌بینانه به روز رسانی/خطاهای حافظه پنهان و رسیدگی به موارد لبه مهمتر از همه: تفکر به عنوان یک توسعه دهنده ارشد پیشها: دانش اولیه React مورد نیاز خواهد بود کد همراه، تمام دستورالعمل ها گام به گام هستند

با این دوره جامع و عملی، پتانسیل کامل ReactJS و Redux را باز کنید. این دوره که برای توسعه دهندگان متوسط ​​تا پیشرفته طراحی شده است فراتر از اصول اولیه است تا شما را با مهارت های ساخت برنامه های React مقیاس پذیر، کارآمد و ایمن مجهز کند. ما یک مسیر روشن و سازمان یافته را دنبال خواهیم کرد که با موارد استفاده در دنیای واقعی سروکار دارد و راه حل هایی برای رسیدگی به آنها ایجاد می کنیم

موارد زیر موارد کلیدی هستند که در این دوره مورد توجه قرار خواهند گرفت.


  1. الگوهای کدنویسی برای کارایی: الگوها و تکنیک های قدرتمند کدنویسی را کشف کنید که گردش کار توسعه شما را ساده می کند. برای نوشتن کدهای تمیزتر و کارآمدتر، آخرین پیشرفت‌های React، از جمله قلاب‌ها، زمینه، و اجزای عملکردی را کاوش کنید.

  2. بهینه سازی عملکرد: یاد بگیرید که چگونه برنامه های React خود را برای سرعت و پاسخگویی بهینه کنید. به تنگناهای عملکردی بپردازید، از تکنیک‌های حافظه‌سازی استفاده کنید و بارگذاری تنبل را برای ایجاد تجربه‌های کاربر با سرعت فوق‌العاده اجرا کنید.

  3. پیاده سازی احراز هویت: در اجرای احراز هویت کاربر در برنامه های React تسلط پیدا کنید. پیچیدگی های OAuth، JWT، و احراز هویت مبتنی بر جلسه را بدانید و بیاموزید که چگونه آنها را به طور یکپارچه در پروژه های خود ادغام کنید.

  4. بهترین روش‌های امنیتی: برنامه‌های React خود را به بالاترین استانداردهای امنیتی ارتقا دهید. آسیب پذیری های رایج را کاوش کنید و اقدامات امنیتی قوی را اجرا کنید، مانند اعتبار سنجی ورودی، شیوه های ارتباطی ایمن، و محافظت در برابر حملات Cross-Site Scripting (XSS) و Cross-Site Request Forgery (CSRF).


چرا "Mastering React" را انتخاب کنید؟

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

  • دستورالعمل متخصص: از تخصص متخصصان صنعت که شما را از طریق پیچیدگی‌های مفاهیم پیشرفته React و بهترین شیوه‌ها راهنمایی می‌کنند، بهره ببرید.

  • مهارت‌های آماده برای شغل: مهارت‌ها و اعتماد به نفس برای مقابله با پروژه‌های پیچیده React را به دست آورید و در زمینه رقابتی توسعه وب متمایز شوید.

  • دسترسی مادام‌العمر: از دسترسی مادام‌العمر به مطالب دوره، به‌روزرسانی‌ها، و جامعه حمایتی از فراگیران لذت ببرید تا مهارت‌های خود را واضح و به‌روز نگه دارید.


نمونه بررسی دوره های دیگر من

--- مطالب را اینجا بنویسید


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

مقدمه Introduction

  • نحوه استفاده از دوره How to use the Course

  • منبع پروژه Github Github Project Resource

  • پروژه Github را دانلود کنید Download Github Project

  • اصول طراحی - اجزا و مدولاریت Design Principles - Components and Modularity

  • ساختار برنامه - شروع به کدنویسی Application Structure - Getting started to code

  • راه اندازی مسیریابی اولیه Basic routing setup

  • پیمایش به مسیرهای فرعی و مسیریابی پیش فرض Navigating to sub routes and default routing

راه اندازی پایه Base Setup

  • ایجاد مؤلفه ورود به سیستم Creating the Sign-in component

  • صفحه ثبت نام و پس زمینه را اضافه کنید Add Sign-up page and background

  • اصلاح ناوبری برنامه‌ای و استایل Programatic navigation and styling fixes

  • اجزای کنترل شده و کنترل نشده Controlled and Un-Controlled components

Redux Redux

  • اصل طراحی - مدیریت دولتی Design Principle - State management

  • شروع Redux Redux Getting Started

  • افزودن فروشگاه Redux و ایجاد Redux Slices Adding Redux store and creating Redux Slices

  • افزودن todo به فروشگاه Redux، Redux devtools Adding todo to Redux store , Redux devtools

  • افزودن، حذف و تغییر وضعیت Todos Add , Remove and Toggle Todos

  • استفاده از انتخابگرها در Redux، ویرایش Todos Using selectors in Redux , editing Todos

  • فرم‌های Redux، اصول اولیه Redux Forms , The basics

  • راه اندازی فرم Redux و React Redux and React form setup

  • ورود به سیستم را از طریق فرم Redux مدیریت کنید Manage Signin via Redux form

  • رفع Css در Signin Css fixes on Signin

  • اعتبار سنجی فرم، رسیدگی به خطا Form validation , error handling

  • پیوند فرم ثبت نام به فرم Redux Signup form link to Redux form

  • اصل طراحی - سازگاری کد Design Principle - Code Consistency

  • احراز هویت بر اساس اصل سازگاری کد Auth refactoring based on Code Consistency principle

لیست املاک Property Listings

  • شروع صفحه فهرست املاک Property Listing page starter

  • ساخت رابط کاربری AppBar Making the AppBar UI

  • اضافه کردن نوار دسته Adding category bar

  • افزودن جزء کارت ملک Adding property card component

  • افزودن دکمه FAB به لیست املاک Adding FAB button to Property Listing

  • افزودن انتخابگر زبان Adding Language Selector

  • اصل طراحی - مقیاس پذیری و زیرساخت کد Design Principle - Scalability and Code Infrastructure

  • نظریه زیرساخت مدال Modals Infrasturcture theory

  • اجرای زیرساخت مدال - قسمت 1 Modals infrastructure implementation - Part 1

  • اجرای زیرساخت مدال - قسمت 2 Modals infrastructure implementation - Part 2

  • افزودن فیلدهای رابط کاربری ویژگی Adding Add Property UI Fields

  • اضافه کردن ترجمه های زیر Adding Translations infra

  • جابجایی بین زبان ها Switching between languages

  • جای جای در ترجمه ها Placeholders in translations

  • مرز خطا در استفاده از اجزای کلاس Error Boundary using Class components

  • استفاده از کتابخانه مرزی خطا Using Error boundary library

پیاده سازی Backend Backend Implementation

  • شروع به کار Backend - راه اندازی MongoDB Getting Backend started - MongoDB setup

  • وارد کردن داده های نمونه، اتصال به DB Importing sample data , connecting to DB

  • کاوش اجرای Backend Exploring the backend implementation

  • رمزگذاری رمز عبور Encrypting the password

  • استاندارد کردن پاسخ موفقیت آمیز Backend Standardize Backend Success response

  • استاندارد کردن پاسخ خطای Backend Standardize Backend Error Response

پرس و جو RTK RTK Query

  • مقدمه پرس و جو RTK RTK Query introduction

  • تنظیم پرس و جو RTK - وارد شوید RTK query setup - Sign in

  • استفاده از پرس و جوی RTK در کامپوننت Sing in Using RTK query in Sing in component

  • تعمیر باطن - نمی توان به DB متصل شد Fixing backend - Cannot connect to DB

  • رفع خطاها هنگام ارسال درخواست به backend Fixing errors when sending request to backend

  • حل مسائل CORS Solving CORS issues

  • اتصال پرس و جو RTK به فروشگاه Redux Hooking RTK query to Redux store

  • تبدیل پاسخ سرور، مدیریت وضعیت رابط کاربری Transforming server response , UI State handling

  • به منطق ورود به سیستم در Backend به روز رسانی کنید Update to the Sign in logic on Backend

  • رسیدگی به خطاهای ورود به سیستم Handling Sign in errors

جریان JWT JWT Flows

  • درک نحوه عملکرد جریان JWT Understanding how JWT flow works

  • پیاده سازی JWT Signin در سرور JWT Signin implementation on Server

  • بازخوانی نشانه ها Refresh tokens

  • افزودن نشانه رفرش به ورود Adding refresh token to Sign in

  • اعتبار سنجی توکن JWT Validating the JWT token

  • افزودن سیاست های مسیر (Middlewares) Adding route polices ( Middlewares )

  • شناسه کاربری را از توکن JWT بگیرید Capture User ID from JWT token

  • نقطه پایان نشانه را بازخوانی کنید Refresh token endpoint

  • محدود کردن استفاده مجدد از نشانه Refresh Restricting reuse of Refresh token

  • اطلاعیه زیر در React Notification infra on React

  • افزودن جزئیات Auth به Redux User Slice Adding Auth details to Redux User Slice

  • افزودن سرصفحه auth به ایجاد ویژگی Adding auth headers to Create property

  • در حال واکشی لیست اموال در Frontend Fetching Property list on Frontend

  • Reducer Path، ارائه خواص از طریق API Reducer Path , rendering properties via API

  • رفع UI در فهرست اموال UI fixes on Property Listing

  • اضافه کردن redux persist برای ذخیره حالت Adding redux persist to save state

ذخیره سازی Caching

  • RTK Caching RTK Caching

  • RTK Caching در عمل در Todo RTK Caching in action on Todo

  • پرس و جو RTK مشروط، ابزارهای ویرایش Conditional RTK Query , Editing toods

  • واکشی خودکار جستارهای RTK Automatic fetch of RTK queries

  • برچسب های کش RTK RTK Cache tags

  • باطل کردن حافظه پنهان توسط Todo ID Invalidating cache by Todo ID

  • رفع اشکال برای به روز رسانی Todos Bug fix for updating Todos

  • پیش واکشی پرس و جوها با استفاده از RTK Pre-fetching queries using RTK

  • به روز رسانی خوش بینانه با استفاده از کش RTK Optimistic Update using RTK Cache

  • رفع ID در حین انجام آپدیت خوش بینانه Fixing ID while doing Optimistic Update

  • افزودن برچسب کش به برنامه Property Adding cache tags to Property app

  • Redux persist لیست سیاه Redux persist blacklist

  • رفع UI، Redux persist fix UI Fixes , Redux persist fix

  • اجرای توکن را در RTK به روز کنید Refresh token implementation in RTK

  • مدیریت خرابی توکن به‌روزرسانی Handling refresh token failure

  • پیمایش کاربر در مورد خرابی Reauth Navigating the user on Reauth failure

  • پیاده سازی Mutex برای جلوگیری از تماس های متعدد API Implementing Mutex for preventing multiple API calls

مجوز Authorization

  • مفهوم معماری مجوز Authorization architecture concept

  • مرتبط کردن نقش ها با کاربران Associating roles with users

  • اجرای سیاست مجوز Implementing Authorization policy

  • منطق مجوز اشکال زدایی Debugging authorization logic

  • منطق اجرای Frontend Auth Frontend Auth implementation Logic

  • Auth infra را برای عناصر UI پیاده سازی کنید Implement Auth infra for UI elements

  • محافظت از URL بر اساس مجوزهای Roles URL Protection based on Roles permissions

ارتباط زمان واقعی Real time communication

  • بخش. مقدمه - ارتباط بیدرنگ چیست؟ Section. introduction - What is realtime communication ?

  • نظرسنجی کوتاه Short polling

  • نظرسنجی طولانی Long polling

  • رویدادهای ارسال شده توسط سرور - پیاده سازی باطن Server sent events - backend implementation

  • رویدادهای ارسال شده توسط سرور - اجرای جلویی Server sent events - front-end implementation

  • رویدادهای ارسال شده توسط سرور - اعلان در مورد اضافه کردن کارها Server sent events - Notification on add todos

  • معرفی و راه اندازی اتصال سوکت Socket connection introduction and setup

  • پیام اتصال سوکت Socket connection messaging

  • اتصال سوکت IO در فرانت اند Socket IO connection on frontend

  • پخش جریانی Todos به Frontend Streaming Todos to frontend

  • راه اندازی مادون پشتیبان اعلان Notification backend infra setup

  • نظرسنجی کوتاه با استفاده از پرس و جو RTK Short polling using RTK query

  • پخش جریانی اعلان‌ها به جلو Streaming notifications to frontend

افزایش UX UX Enhancement

  • جستجوی ملک با استفاده از پرس و جو Searching property using query

  • استفاده از پرس و جوهای تنبل در RTK Using lazy queries in RTK

  • درخواست رد کردن Debouncing request

  • یادآوری اجزای React Memonizing React components

  • رفع عملکرد useCallback Fixing useCallback functionality

  • یادداشت کردن مقادیر با استفاده از useMemo Memonizing values using useMemo

  • رفع عملکرد جستجوی منحرف شده Fixing debounced search functionality

  • استفاده از لیست مجازی Using Virtualized list

  • نحوه مدیریت تم های رابط کاربری How to manage UI themes

  • HOC برای ردیابی حرکات ماوس HOC for tracking mouse movements

  • ردیابی اگر کاربر بیکار است Tracking if user is Idle

اضافی Extra

  • مقدمه ای بر بارگذاری تنبل و اسکرول بی نهایت Introduction to Lazy loading and Infinite Scroll

  • پیاده سازی صفحه بندی در لیست اموال Implementing pagination on property list

  • افزودن API تقاطع Adding intersection API

  • بارگیری داده های صفحه بندی شده از API Loading paginated data from API

  • ادغام داده ها در حافظه پنهان Redux Merging data in Redux Cache

  • اضافه کردن اسکلت لودرها Adding Skeleton Loaders

تنظیمات و امنیت Configs and Security

  • پرچم گذاری ویژگی Feature flagging

  • ارائه دهنده پرچم گذاری ویژگی (ارائه دهنده خارجی) Feature flagging provider ( External Provider )

  • اجرای سفارشی پرچم‌گذاری ویژگی Feature flagging custom implementation

  • ایمن سازی JWT با اثر انگشت دستگاه Securing JWT with device fingerprint

  • اضافه کردن اثر انگشت در Frontend Adding fingerprint on Frontend

  • تایید اثر انگشت از طریق JWT Validating fingerprint via JWT

  • حملات XSS XSS attacks

  • توکن های CSRF CSRF tokens

  • حملات SSRF SSRF Attacks

  • تزریق جاوا اسکریپت سمت سرور (SSJI) Server side Javascript injection ( SSJI )

افزودن انعطاف پذیری Adding Resiliency

  • عقب نشینی نمایی با RTK مجدد Exponential backoff with retry RTK

  • تلاش مجدد با خط مشی وجود Retries with exist policy

  • افزودن میان افزار Redux برای ورود به سیستم Adding Redux middleware for logging

نمایش نظرات

React & Redux Hero: برنامه وب ایمن و مقیاس پذیر بسازید!!
جزییات دوره
21 hours
140
Udemy (یودمی) Udemy (یودمی)
(آخرین آپدیت)
1,247
4.7 از 5
ندارد
دارد
دارد
Gaurav Soni
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Gaurav Soni Gaurav Soni

توسعه دهنده نرم افزار/مشاور کسب و کار/مربی