آموزش Full-Stack React Development

دانلود Full-Stack React Development

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره:

این آموزش متوسط ​​Full-Stack React Development، فراگیران را برای کدنویسی و توسعه برنامه‌ها و صفحات وب در ReactJS آماده می‌کند که به طور کامل از back-end و front-end استفاده می‌کنند.

ReactJS کتابخانه جاوا اسکریپت منبع باز فیس بوک است که به ویژه برای توسعه برنامه های کاربردی مقیاس پذیر با رابط های کاربری ثابت که می توانند ورودی های پویا را در خود جای دهند خوب است. ReactJS یک اپلیکیشن فرانت‌اند است که می‌توانید چارچوبی بسازید که به‌روزرسانی و توسعه آن آسان باشد. با این آموزش، یاد می گیرید که چگونه قابلیت های back-end و توسعه را در توسعه ReactJS خود بگنجانید.

جاوا اسکریپتی را بیاموزید که ReactJS را ممکن می‌سازد و نحوه دستکاری آن برای افزایش عملکرد، استفاده بهتر از APIها و تست و مقیاس‌بندی کد خود را به راحتی بیاموزید. با این آموزش Full-Stack React Development آشنایی خود را با کتابخانه های جاوا اسکریپت و ReactJS کامل کنید.

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

Full-Stack React Development: آنچه شما باید بدانید

این آموزش Full-Stack React Development دارای ویدیوهایی است که موضوعات کتابخانه های تمام پشته جاوا اسکریپت را پوشش می دهد، از جمله:

  • توسعه و نوشتن برنامه‌ها در قسمت جلویی و پشتی‌اند
  • افزایش مقیاس یک برنامه در صورت نیاز
  • تست کد خود قبل از اجرا
  • نوشتن رابط های کاربری که با فیدهای داده زنده تعامل دارند
چه کسی باید در آموزش توسعه Full-Stack React شرکت کند؟

این آموزش Full-Stack React Development به عنوان آموزش React در سطح پایه در نظر گرفته می شود، به این معنی که برای شخصی طراحی شده است که اصلاً تجربه React ندارد.

آموزش واکنش. اگر با سایت یا هر برنامه‌ای که بر روی ReactJS ساخته شده‌اند، این دوره آموزشی Full-Stack React Development برای متخصصان غیر فنی مهم است. این دوره شما را با تمام اصطلاحات، فناوری و عملیاتی که در پشت صحنه برای امکان پذیر کردن اپلیکیشن یا صفحه شما در حال انجام است آشنا می کند. با این سطح از درک، برای شرکت در مکالمات درباره به‌روزرسانی‌ها و تغییرات مجهز خواهید بود.

توسعه دهندگان جدید یا مشتاق. از آنجایی که ReactJS یک کتابخانه جاوا اسکریپت توسعه رابط کاربری جلویی است، نوشتن React تنها یک تکه از پازل است. درک اینکه چگونه React با محیط زمان اجرا خود تعامل می کند، داده ها را از پایگاه داده خود بازیابی می کند و توسط سیستم کنترل نسخه شما به روز می ماند، همه مهارت های کلیدی برای اجرای برنامه های شما در شبکه هستند. این دوره آموزشی Full-Stack React Development اطمینان حاصل می کند که یک توسعه دهنده به طور کامل عملکرد داخلی برنامه ها و صفحات در حال اجرا در شبکه های خود را درک می کند.


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

اصول اولیه Firebase Auth Firebase Auth Basics

  • بررسی اجمالی Overview

  • معرفی Introduction

  • ایجاد صفحات Creating Pages

  • هدایت مجدد کاربران احراز هویت نشده Redirecting Unauthenticated Users

  • ورود به سیستم با Firebase Auth Signing In With Firebase Auth

  • گوش دادن به تغییرات Auth Listening for Auth Changes

  • نتیجه Conclusion

داده های سمت سرور را در React بارگیری کنید Load Server-Side Data in React

  • بررسی اجمالی Overview

  • معرفی Introduction

  • استراتژی اصلی تبدیل تمام پشته Basic Full-stack Conversion Strategy

  • راه اندازی سرور تمام پشته Full-stack Server Setup

  • "خواندن" نقاط پایانی سرور "Read" Server Endpoints

  • تبدیل صفحات به استفاده از داده های سرور Converting Pages to Use Server Data

  • تبدیل متن به استفاده از داده های سرور Converting Context to Use Server Data

  • نتیجه Conclusion

ایجاد و تغییر داده های سمت سرور در React Create and Modify Server-Side Data in React

  • بررسی اجمالی Overview

  • معرفی Introduction

  • "ایجاد" نقاط پایانی سرور "Create" Server Endpoints

  • ایجاد درخواست های "ایجاد" از فرانت اند Making "Create" Requests from the Front-End

  • "حذف" نقاط پایانی سرور "Delete" Server Endpoints

  • ایجاد درخواست های "حذف" از Front-End Making "Delete" Requests from the Front-End

  • "به روز رسانی" نقاط پایانی سرور "Update" Server Endpoints

  • ایجاد درخواست های "به روز رسانی" از Front-end Making "Update" Requests from the Front-end

  • نتیجه Conclusion

ایجاد حساب و مدیریت خطا در Firebase Auth Account-Creation and Error Handling in Firebase Auth

  • بررسی اجمالی Overview

  • معرفی Introduction

  • شی کاربر Firebase The Firebase User Object

  • اکانت های Firebase Auth ایجاد کنید Create Firebase Auth Accounts

  • مدیریت خطای احراز هویت Auth Error Handling

  • میله های ناوبری Auth-Conscious Auth-Conscious Navigation Bars

  • نتیجه Conclusion

الگوهای پیشرفته Firebase Auth Advanced Firebase Auth Patterns

  • بررسی اجمالی Overview

  • معرفی Introduction

  • ایجاد قلاب های سفارشی برای Auth Creating Custom Hooks for Auth

  • استفاده از قلاب های سفارشی در داخل اجزا Using Custom Hooks Inside Components

  • توابع داخل قلاب های سفارشی Functions Inside Custom Hooks

  • ایجاد حساب در قلاب های سفارشی Creating Accounts In Custom Hooks

  • خروج از سیستم در قلاب های سفارشی Logging Out In Custom Hooks

  • نتیجه Conclusion

Firebase Auth در برنامه های Full-Stack Firebase Auth in Full-Stack Apps

  • بررسی اجمالی Overview

  • معرفی Introduction

  • راه اندازی سرور اکسپرس Express Server Setup

  • React Front-end Setup React Front-end Setup

  • درخواست با توکن های Auth Making Requests with Auth Tokens

  • نتیجه Conclusion

امنیت نقطه پایانی با Firebase Auth Endpoint Security with Firebase Auth

  • بررسی اجمالی Overview

  • معرفی Introduction

  • محافظت از نقاط پایانی "به روز رسانی" و "حذف". Protecting "Update" and "Delete" Endpoints

  • محافظت از "ایجاد" نقاط پایانی Protecting "Create" Endpoints

  • استفاده از Auth Middleware Using Auth Middleware

  • نتیجه Conclusion

Firebase Auth را به برنامه‌های React موجود اضافه کنید Add Firebase Auth to Existing React Apps

  • بررسی اجمالی Overview

  • معرفی Introduction

  • افزودن صفحه ورود به برنامه های موجود Adding a Login Page to Existing Apps

  • محصور کردن منطق تأیید با زمینه Encapsulating Auth Logic with Context

  • افزودن Auth به نوار ناوبری Adding Auth to a Navigation Bar

  • ایجاد قلاب های سفارشی برای زمینه Creating Custom Hooks for Context

  • نتیجه Conclusion

Firebase Auth را به سرورهای Express موجود اضافه کنید Add Firebase Auth to Existing Express Servers

  • بررسی اجمالی Overview

  • معرفی Introduction

  • مالکیت داده در Back-end Data Ownership on the Back-end

  • گنجاندن خودکار توکن ها در درخواست ها Automatically Including Tokens In Requests

  • حفاظت از داده های کاربر در نقاط پایانی Protecting User Data in Endpoints

  • نتیجه Conclusion

ایجاد برنامه اشتراک‌گذاری یادداشت: اشتراک‌گذاری یادداشت را به قسمت پشتیبان اضافه کنید Build A Note-Sharing App: Add Note-Sharing to the Back-end

  • بررسی اجمالی Overview

  • معرفی Introduction

  • یک نقطه پایانی "Share Note" اضافه کنید Add a "Share Note" Endpoint

  • درخواست های "اشتراک گذاری" را از Front-end انجام دهید Make "Share" Requests from the Front-end

  • قابلیت "Unshare" را اضافه کنید Add "Unshare" Functionality

  • بارگیری یادداشت های مشترک Load Shared Notes

  • نتیجه Conclusion

ایجاد یک برنامه اشتراک گذاری یادداشت: مجوزهای کاربر را اضافه کنید Build A Note-Sharing App: Add User Permissions

  • بررسی اجمالی Overview

  • معرفی Introduction

  • پنهان کردن عناصر بر اساس مالکیت Hide Elements Based On Ownership

  • اضافه کردن سطوح مجوز به Back-end Add Permission Levels To the Back-end

  • سطوح مجوز را به Front-end اضافه کنید Add Permission Levels To the Front-end

  • به سایر کاربران اجازه ویرایش یادداشت ها را بدهید Allow Other Users to Edit Notes

  • نتیجه Conclusion

ایجاد یک برنامه Note-Share: یک Simple React Front-End ایجاد کنید Build a Note-Sharing App: Create a Simple React Front-End

  • بررسی اجمالی Overview

  • معرفی Introduction

  • نقشه از برنامه Map Out the App

  • ایجاد صفحات و تنظیم مسیرها Create Pages and Set Up Routes

  • صفحه و فهرست یادداشت ها را بسازید Build the Notes Page and List

  • صفحه جزئیات یادداشت را بسازید Build the Note Detail Page

  • نتیجه Conclusion

یک برنامه اشتراک‌گذاری یادداشت بسازید: مدیریت داده‌های فرانت‌اند Build a Note-Sharing App: Front-end Data Management

  • بررسی اجمالی Overview

  • معرفی Introduction

  • داده‌های یادداشت را در یک ارائه‌دهنده زمینه ذخیره کنید Store Note Data Inside A Context Provider

  • یک مودال ایجاد یادداشت اضافه کنید Add A Create Note Modal

  • ایجاد یادداشت های جدید در زمینه Creating New Notes in Context

  • حذف یادداشت ها در زمینه Deleting Notes in Context

  • به روز رسانی یادداشت ها در زمینه Updating Notes in Context

  • نتیجه Conclusion

یک برنامه اشتراک گذاری یادداشت بسازید: یک استایل اضافه کنید Build a Note-Sharing App: Add Styling

  • بررسی اجمالی Overview

  • معرفی Introduction

  • Styling را به برنامه اضافه کنید Add Styling to the App

  • یک جزء "X" قابل استفاده مجدد ایجاد کنید Create A Reusable "X" Component

  • یک نوار ناوبری ایجاد کنید Create A Navigation Bar

  • Markdown را در React رندر کنید Render Markdown in React

  • نتیجه Conclusion

ایجاد یک برنامه به اشتراک گذاری یادداشت: یک Back-end با Node و Express ایجاد کنید Build a Note-Sharing App: Create a Back-end with Node and Express

  • بررسی اجمالی Overview

  • معرفی Introduction

  • راه اندازی پروژه تمام پشته Full-Stack Project Setup

  • یک نقطه پایانی "خوانده" ایجاد کنید و داده ها را از سمت مشتری بارگیری کنید Create a "Read" Endpoint And Load Data From the Client-Side

  • یک نقطه پایانی "ایجاد" اضافه کنید و از سمت مشتری درخواست کنید Add a "Create" Endpoint And Make Requests From the Client-Side

  • نقاط پایانی "به روز رسانی" و "حذف" را اضافه کنید Add "Update" And "Delete" Endpoints

  • نتیجه Conclusion

ایجاد یک برنامه اشتراک گذاری یادداشت: یک پایگاه داده اضافه کنید Build A Note-Sharing App: Add a Database

  • بررسی اجمالی Overview

  • معرفی Introduction

  • MongoDB را به Back-end اضافه کنید Add MongoDB to the Back-end

  • نقاط پایانی را به استفاده از MongoDB تبدیل کنید Convert Endpoints to Use MongoDB

  • سرورهای اکسپرس را به چندین فایل تقسیم کنید Split Express Servers Into Multiple Files

  • MongoDB را در فایل های مختلف در دسترس قرار دهید Make MongoDB Available in Different Files

  • برای افزایش کارایی مسیرها را بازنویسی کنید Rewrite Routes To Increase Performance

  • نتیجه Conclusion

ایجاد یک برنامه اشتراک گذاری یادداشت: احراز هویت کاربر را به Front-end اضافه کنید Build A Note-Sharing App: Add User Authentication to the Front-end

  • بررسی اجمالی Overview

  • معرفی Introduction

  • ایجاد ورود و ایجاد فرم های حساب Create Login and Create Account Forms

  • اضافه کردن ورود و ایجاد صفحات حساب Add Login and Create Account Pages

  • طراحی صفحات ورود و ایجاد حساب کاربری Styling the Login and Create Account Pages

  • Firebase Auth را به Front-end اضافه کنید Add Firebase Auth to the Front-end

  • نتیجه Conclusion

ایجاد یک برنامه اشتراک گذاری یادداشت: احراز هویت کاربر را به Back-end اضافه کنید Build A Note-Sharing App: Add User Authentication to the Back-end

  • بررسی اجمالی Overview

  • معرفی Introduction

  • Firebase Admin را نصب و راه اندازی کنید Install and Set Up Firebase Admin

  • چگونه باید پایگاه داده خود را سازماندهی کنیم؟ How Should We Organize Our Database?

  • تبدیل نقاط پایانی برای مالکیت Convert Endpoints for Ownership

  • مالکیت داده در ایجاد و حذف نقاط پایانی Data Ownership in Create and Delete Endpoints

  • نتیجه Conclusion

ایجاد یک برنامه اشتراک‌گذاری یادداشت: Refactoring Front-end Build A Note-Sharing App: Front-end Refactoring

  • بررسی اجمالی Overview

  • معرفی Introduction

  • در Auth State Changes مشترک شوید Subscribe to Auth State Changes

  • از مسیرها با معیارهای دلخواه محافظت کنید Protect Routes with Arbitrary Criteria

  • یک userUser Hook ایجاد کنید Create a useUser Hook

  • توکن های کاربران را در درخواست ها لحاظ کنید Include Users' Tokens in Requests

  • نتیجه Conclusion

ایجاد یک برنامه اشتراک گذاری یادداشت: از داده های کاربران محافظت کنید Build A Note-Sharing App: Protect Users' Data

  • بررسی اجمالی Overview

  • معرفی Introduction

  • محافظت از داده های کاربران در برابر دسترسی ناخواسته Protect Users' Data from Unwanted Access

  • جلوگیری از حذف اطلاعات سایر کاربران توسط کاربران Prevent Users From Deleting Other Users' Data

  • جلوگیری از تغییر داده های غیرمجاز Prevent Unauthorized Data Modification

  • حفاظت را به نقطه پایانی Create Note اضافه کنید Add Protection to the Create Note Endpoint

  • از میان افزار برای کاهش تکرار استفاده کنید Use Middleware to Reduce Repetition

  • میان افزار بیشتر اضافه کنید Add More Middleware

  • نتیجه Conclusion

ایجاد یک برنامه اشتراک گذاری یادداشت: مدیریت حساب کاربری Build A Note-Sharing App: User Account Management

  • بررسی اجمالی Overview

  • معرفی Introduction

  • نمایش تفکیک داده ها Data Segregation Demonstration

  • ایجاد حساب کاربری User Account Creation

  • خطاهای ورود و ایجاد حساب کاربری را مدیریت کنید Handle Login and Create Account Errors

  • نتیجه Conclusion

ایجاد یک برنامه اشتراک گذاری یادداشت: اشتراک گذاری یادداشت را به Front-end اضافه کنید Build A Note-Sharing App: Add Note-Sharing to the Front-end

  • بررسی اجمالی Overview

  • معرفی Introduction

  • یک صفحه برای ویرایش تنظیمات اشتراک‌گذاری ایجاد کنید Create a Page for Editing Sharing Settings

  • یک لیست ایمیل های مشترک ایجاد کنید Create a Shared Emails List

  • منطق اشتراک گذاری اولیه Front-end Basic Front-end Sharing Logic

  • نتیجه Conclusion

ایجاد یک برنامه اشتراک گذاری یادداشت: اصول تأیید ایمیل Build A Note-Sharing App: Email Verification Basics

  • بررسی اجمالی Overview

  • معرفی Introduction

  • اصول تأیید ایمیل Email Verification Basics

  • یک صفحه «لطفاً تأیید ایمیل» ایجاد کنید Create a "Please Verify Email" Page

  • ایجاد جریان حساب را دوباره فاکتور کنید Refactor the Create Account Flow

  • ارسال ایمیل از یک Node Server Send Emails From A Node Server

  • نتیجه Conclusion

ایجاد یک برنامه اشتراک‌گذاری یادداشت: تأیید ایمیل پیشرفته Build A Note-Sharing App: Advanced Email Verification

  • بررسی اجمالی Overview

  • معرفی Introduction

  • یک صفحه فرود تأیید ایمیل ایجاد کنید Create an Email Verification Landing Page

  • یک مسیر سرور تأیید ایمیل ایجاد کنید Create an Email Verification Server Route

  • از مسیرهای سرور در برابر کاربران تایید نشده محافظت کنید Protect Server Routes from Unverified Users

  • جلوگیری از ورود کاربران تایید نشده Prevent Unverified Users from Logging In

  • نتیجه Conclusion

ایجاد یک برنامه اشتراک‌گذاری یادداشت: اشتراک‌گذاری لینک Build A Note-Sharing App: Link Sharing

  • بررسی اجمالی Overview

  • معرفی Introduction

  • یک بخش فعال/غیرفعال ایجاد کنید Create an Enable/Disable Section

  • یک نقطه پایانی برای فعال کردن اشتراک گذاری لینک ایجاد کنید Create an Endpoint for Enabling Link Sharing

  • یک نقطه پایانی برای غیرفعال کردن اشتراک گذاری لینک ایجاد کنید Create an Endpoint for Disabling Link Sharing

  • بارگیری یادداشت های پیوند مشترک از سرور Load Link-Shared Notes from the Server

  • نتیجه Conclusion

یک برنامه اشتراک گذاری یادداشت بسازید: ارتباطات بلادرنگ Build A Note-Sharing App: Real-Time Communication

  • بررسی اجمالی Overview

  • معرفی Introduction

  • Web-Sockets را به Express اضافه کنید Add Web-Sockets to Express

  • Web-Sockets را به React اضافه کنید Add Web-Sockets to React

  • ارسال داده از طریق سوکت وب Send Data Through a Web-Socket

  • درخواست های "بار" را به سوکت های وب تبدیل کنید Convert "Load" Requests to Web-Sockets

  • نتیجه Conclusion

ایجاد یک برنامه اشتراک‌گذاری یادداشت: محافظت از سوکت‌های وب Build A Note-Sharing App: Web-Socket Protection

  • بررسی اجمالی Overview

  • معرفی Introduction

  • میان افزار "User Can Edit Note" را ایجاد کنید Create "User Can Edit Note" Middleware

  • تبدیل Express Middleware به Socket.io Convert Express Middleware to Socket.io

  • میان افزار برای رویدادهای فردی Middleware for Individual Events

  • خطاهای سوکت در قسمت جلویی را مدیریت کنید Handle Socket Errors on the Front-end

  • یک هوک سفارشی برای سوکت های وب ایجاد کنید Create a Custom Hook for Web-Sockets

  • نتیجه Conclusion

ایجاد یک برنامه اشتراک گذاری یادداشت: استراتژی های سازمان وب سوکت Build A Note-Sharing App: Web-Socket Organization Strategies

  • بررسی اجمالی Overview

  • معرفی Introduction

  • منطق وب سوکت را به طور موثر سازماندهی کنید Organize Web-Socket Logic Effectively

  • کنترل کننده رویداد را در فایل های جداگانه تعریف کنید Define Event Handlers in Separate Files

  • منطق اتصال اولیه را تعریف کنید Define Initial Connection Logic

  • Socket Middleware را اضافه کنید Add Socket Middleware

  • نتیجه Conclusion

ایجاد یک برنامه اشتراک‌گذاری یادداشت: سوکت‌های وب در عمق Build A Note-Sharing App: Web-Sockets In-Depth

  • بررسی اجمالی Overview

  • معرفی Introduction

  • داده های مشتری را همزمان نگه دارید Keep Client Data In Sync

  • جلوگیری از حلقه های سوکت بی نهایت Prevent Infinite Socket Loops

  • نقش ها را به داده های وب سوکت اضافه کنید Add Roles to Web-Socket Data

  • از اتاق های وب سوکت استفاده کنید Use Web-Socket Rooms

  • نتیجه Conclusion

یک برنامه اشتراک‌گذاری یادداشت بسازید: سوکت‌های وب و نقاط پایانی را ترکیب کنید Build A Note-Sharing App: Combine Web-Sockets and Endpoints

  • بررسی اجمالی Overview

  • معرفی Introduction

  • چند نوع اتصال وب سوکت Multiple Web-Socket Connection Types

  • اتصالات جدید سوکت وب را مدیریت کنید Handle New Web-Socket Connections

  • بارگیری داده ها از طریق سوکت های وب Loading Data Via Web-Sockets

  • داده های سمت مشتری را فوراً به روز کنید Update Client-Side Data Immediately

  • نتیجه Conclusion

ملزومات پشته MERN Essentials of the MERN Stack

  • بررسی اجمالی Overview

  • معرفی Introduction

  • ساختار پشته اصلی MERN Basic MERN Stack Structure

  • تنظیم جلویی Front-end Setup

  • راه اندازی Back-end Back-end Setup

  • ساخت یک React Front-end Building a React Front-end

  • بارگیری داده ها از Back-end Loading Data from the Back-end

  • ایجاد منابع Creating Resources

  • به روز رسانی و حذف منابع Updating and Deleting Resources

  • نتیجه Conclusion

مبانی پایگاه داده پشته MERN MERN Stack Database Basics

  • بررسی اجمالی Overview

  • معرفی Introduction

  • مبانی MongoDB MongoDB Basics

  • بهبود جریان توسعه Development Flow Improvements

  • اتصال به MongoDB از Node Connecting to MongoDB from Node

  • بارگیری داده ها از MongoDB Loading Data from MongoDB

  • درج داده ها در MongoDB Inserting Data into MongoDB

  • حذف داده ها در MongoDB Deleting Data in MongoDB

  • به روز رسانی داده ها در MongoDB Updating Data in MongoDB

  • نتیجه Conclusion

نمایش نظرات

آموزش Full-Stack React Development
جزییات دوره
27h
174
CBTNuggets CBTNuggets
(آخرین آپدیت)
-
- از 5
ندارد
دارد
دارد
Shaun Wassell
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Shaun Wassell Shaun Wassell

توسعه دهنده نرم افزار Full-Stack Shaun Wassell یک توسعه دهنده نرم افزار کاملاً پشته ای است که در زمینه برنامه نویسی و اتوماسیون صنعتی تخصص دارد.

Shaun با امید به ساخت بازی های ویدیویی عالی برنامه نویسی را در دوره راهنمایی شروع کرد. وی در ادامه به دریافت مدرک علوم کامپیوتر و ادامه کار حرفه ای نرم افزار توسعه یافت. او از پیشرفت کامل و موبایل لذت می برد. علاوه بر رایانه ، شاون به موسیقی ، معماری ، باغبانی و آبجو دستی نیز علاقه دارد.