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

نمایش نظرات

Udemy (یودمی)

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

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

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

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