Beginning of dialog window. Escape will cancel and close the window.
End of dialog window.
نکته:
آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
در حال بارگزاری، لطفا صبر کنید...
توضیحات دوره:
استاد MERN Stack، AWS، و TypeScript برای ایجاد یک برنامه اشتراکگذاری ویدیو MERN با ویژگیهای دانلود، اشتراکگذاری ویدیو و تأیید اعتبار نحوه ساختن یک برنامه وب اشتراکگذاری ویدیوی تمام پشته با استفاده از پشته MERN (MongoDB، Express، React، Node JS). از TypeScript برای توسعه Frontend و Backend، اطمینان از ایمنی نوع و کد قابل نگهداری استفاده کنید. احراز هویت کاربر امن را با استفاده از JWT (JSON Web Token) پیاده سازی کنید. با استفاده از Tailwind CSS یک رابط کاربری کاملاً پاسخگو ایجاد کنید تا مطمئن شوید که برنامه در همه دستگاهها عالی به نظر میرسد. با AWS S3 برای محتوای ویدئویی و تصویری، آپلود فایل ها را مدیریت کنید و فضای ذخیره سازی را به طور موثر مدیریت کنید. قابلیت دانلود و اشتراک گذاری ویدیو را در برنامه وب تنظیم کنید. عملیات CRUD (ایجاد، خواندن، بهروزرسانی، حذف) را برای ویدیوها و نمایههای کاربر مدیریت کنید. برای یافتن و پخش ویدیوهای خاص از برنامه، عملکرد جستجو را اجرا کنید. کنترلهای حریم خصوصی را به پستهای ویدیویی اضافه کنید، به کاربران اجازه دهید بین تنظیمات عمومی و خصوصی انتخاب کنند. بازیابی رمز عبور و مکانیسم های بازنشانی را با استفاده از ایمیل تنظیم کنید. به کاربران اجازه دهید اطلاعات نمایه خود مانند نام و ایمیل را به روز کنند. از مولتر برای مدیریت بارگذاری فایل در برنامه های Node JS استفاده کنید. با استفاده از Express و MongoDB یک Backend مقیاس پذیر و قابل نگهداری بسازید. بهترین روش ها برای استقرار برنامه های وب تمام پشته در Vercel را بیاموزید. با روشهای توسعه در دنیای واقعی، از جمله استفاده از خدمات AWS برای ذخیرهسازی ابری و مدیریت ویدیو، تجربه عملی کسب کنید. پیش نیازها:دانشجویان برای شرکت در این دوره نیازی به داشتن دانش قبلی ندارند. آنها همه چیز را از آن یاد خواهند گرفت.
در این دوره جامع MERN Stack، یاد خواهید گرفت که چگونه یک برنامه کاربردی وب اشتراک گذاری ویدیوی کاملاً کاربردی از ابتدا بسازید، با یکپارچه سازی فناوری های پیشرفته مانند AWS، TypeScript، Tailwind CSS و غیره. چه مبتدی یا یک توسعهدهنده متوسط باشید، این دوره شما را در کل فرآیند ایجاد یک برنامه وب تمام پشته که به کاربران امکان میدهد ویدیوها را آپلود، اشتراکگذاری و دانلود کنند، راهنمایی میکند. شما بر پشته MERN (MongoDB، Express، React، Node.js) تسلط خواهید داشت و در عین حال به ویژگیهای ضروری مانند احراز هویت، پخش ویدیو، و آپلود فایل امن میپردازید.
در طول دوره، شما روی یک پروژه عملی کار خواهید کرد: یک پلتفرم اشتراکگذاری ویدیو کاملاً پاسخگو که در آن کاربران میتوانند ثبتنام کنند، ویدیوهای خود را آپلود کنند، نمایههای خود را مدیریت کنند و تنظیمات حریم خصوصی را کنترل کنند. شما یاد خواهید گرفت که چگونه از AWS برای ذخیره سازی ویدئو و تصویر استفاده کنید و برنامه خود را مقیاس پذیر و ایمن کنید. علاوه بر این، نحوه پیادهسازی عملیات ضروری CRUD، مدیریت احراز هویت با JWT (JSON Web Token) و ارائه ویژگیهایی مانند بازیابی رمز عبور، عملکرد جستجو، و بهروزرسانیهای نمایه کاربر را بررسی خواهید کرد.
این دوره بر ایجاد مهارتهای دنیای واقعی از طریق تجربه عملی تأکید دارد و در پایان پروژه، یک برنامه وب قابل استقرار خواهید داشت که تخصص شما را در توسعه وب مدرن نشان میدهد. همچنین یاد خواهید گرفت که چگونه برنامه خود را در Vercel مستقر کنید و مطمئن شوید که پروژه شما زنده و آماده اشتراک گذاری با جهان است.
پروژه برنامه وب اشتراک گذاری ویدیو:
کاربران می توانند ثبت نام کنند، وارد سیستم شوند و نمایه های خود را مدیریت کنند، از جمله به روز رسانی نام و ایمیل.
آپلودهای ویدئویی در AWS با Multer، امکان ذخیرهسازی فایلهای مقیاسپذیر و امن را فراهم میکند.
ویژگیهای دانلود و اشتراکگذاری ویدیو، به کاربران امکان میدهد ویدیوها را دانلود کنند یا پیوندهای ویدیویی را به اشتراک بگذارند.
تنظیمات حریم خصوصی برای پستهای ویدیویی عمومی یا خصوصی.
عملیات کامل CRUD برای مدیریت محتوای تولید شده توسط کاربر.
گزینههای بازیابی و بازنشانی رمز عبور از طریق ایمیل.
احراز هویت مبتنی بر JWT برای دسترسی ایمن به پلتفرم.
عملکرد جستجوی ویدیویی که به کاربران امکان می دهد ویدیوها را پیدا و پخش کنند.
طراحی کاملاً پاسخگو با استفاده از Tailwind CSS برای نمایش بهینه در هر دستگاه.
استقرار در Vercel برای میزبانی برنامه وب شما.
در پایان این دوره، تمام مهارتهایی را که برای ساختن و استقرار یک برنامه وب اشتراکگذاری ویدیوی کامل با استفاده از پشته MERN و AWS نیاز دارید، به دست خواهید آورد و در به کارگیری این مهارتها مطمئن خواهید بود. به پروژه های آینده.
سرفصل ها و درس ها
پروژه برنامه وب اشتراک گذاری ویدیو - 1
Video Sharing Web App Project - 1
پروژه برنامه وب اشتراک گذاری ویدیو - کد منبع
Video Sharing Web App Project - Source Code
پروژه برنامه وب اشتراک گذاری ویدیو - نسخه نمایشی زنده
Video Sharing Web App Project - Live Demo
دانلود Node Part - 1
Downloading Node Part - 1
راه اندازی The Vite Ts Part - 2
Setting Up The Vite Ts Part - 2
نصب Tailwind Css Part - 3
Installing Tailwind Css Part - 3
پیکربندی و بررسی Tailwind Css قسمت - 4
Configuring and Checking Tailwind Css Part - 4
پیکربندی Ts در Back-end با Ts قسمت - 5
Configuring Ts in Back-end With Ts Part - 5
راه اندازی سرور بک-اند قسمت - 6
Setting Up Back-end Server Part - 6
راه اندازی قسمت GitHub - 7
Setting Up The GitHub Part - 7
راه اندازی MongoDB Atlas در مرورگر قسمت - 8
MongoDB Atlas Setup in Browser Part - 8
اتصال DB با Mongoose Part - 9
Connecting DB With Mongoose Part - 9
Improvident DB Connectivity and Port Part - 10
Improvident DB Connectivity and Port Part - 10
تعریف اولین طرحواره ما قسمت - 11
Defining Our First Schema Part - 11
شروع بخش کنترل ثبت نام ما - 12
Starting Our Sign Up Controller Part - 12
درک و ارسال پاسخ قسمت - 13
Understanding and Sending Response Part - 13
درک مسیریابی در قسمت Back-end - 14
Understanding Routing in The Back-end Part - 14
بررسی API ما با استفاده از Postman Part - 15
Checking Our API Using Postman Part - 15
ذخیره ایمن رمز عبور در DB قسمت - 16
Saving Password Securely in DB Part - 16
در نهایت قسمت 17 کنترلر ثبت نام خود را تکمیل می کنیم
Finally Completing Our Sign Up Controller Part - 17
شروع قسمت کنترل ورود - 18
Starting The Sign in Controller Part - 18
راه اندازی بخش استراتژی JWT پاسپورت - 19
Setting Up The Passport JWT Strategy Part - 19
تکمیل قسمت کنترل کننده ورود - 20
Completing The Sign in Controller Part - 20
بخش احراز هویت JWT - 21 را درک کنید
Understand The JWT Authentication Part - 21
ایجاد طرح بندی قسمت - 22
Creating Layout Part - 22
React Icons and Complete Layout Part - 23
React Icons and Completing Layout Part - 23
ایجاد صفحه ثبت نام قسمت - 24
Creating Sign Up Page Part - 24
ایجاد قسمت ورود به سیستم - 25
Creating Sign in Page Part - 25
گرفتن ایمیل و رمز عبور از فرم ثبت نام قسمت 26
Capturing Email and Password From Sign Up Form Part - 26
درک The Form Data and useState Part - 27
Understanding The Form Data and useState Part - 27
راه اندازی Cors قسمت - 28
Setting Up Cors Part - 28
راه اندازی Redux Store قسمت - 29
Setting Up Redux Store Part - 29
پیکربندی فروشگاه قسمت - 30
Configuring Store Part - 30
ضربه زدن به Back-end API از قسمت Front-end - 31
Hitting Back-end API From Front-end Part - 31
ثبت نام کاربر از قسمت Front-end - 32
Signing Up The User From Front-end Part - 32
اجرای ابلاغ بخش - 33
Implementing Notification Part - 33
وارد بخش کاربری - 34 شوید
Sign in The User Part - 34
راه اندازی توکن در محل ذخیره سازی قسمت - 35
Setting Up The Token in Local Storage Part - 35
تکمیل ورود به قسمت - 36
Completing Sign in Part - 36
بازدید مجدد از فروشگاه قسمت - 37
Revisit Store Part - 37
API Back-end برای دریافت جزئیات کاربر قسمت - 38
Back-end API for Getting User Details Part - 38
درک مسیر مجاز در قسمت Back-end - 39
Understanding Authorized Route in Back-end Part - 39
ساخت نوار کناری قسمت - 40
Making Sidebar Part - 40
ساخت پروفایل کاربری قسمت - 41
Making User Profile Part - 41
تکمیل قسمت نوار کناری و نمایه - 42
Completing The Side Bar and Profile Part - 42
تنظیم جزئیات کاربر قسمت - 43
Setting The User Details Part - 43
پیاده سازی مسیر محافظت شده در قسمت جلویی - 44
Implementing Protected Route in Front-end Part - 44
تکمیل نمایه کاربری قسمت کاربر - 45
Completing User Profile of User Part - 45
خروج از سیستم کاربر - 46
Log Out User Part - 46
رفع اشکال در نمایه کاربر قسمت - 47
Fixing The Bug in User Profile Part - 47
Back-end API برای به روز رسانی قسمت کاربر - 48
Back-end API for Updating User Part - 48
یکپارچه سازی Back-end API برای به روز رسانی کاربر در قسمت Front-end - 49
Integrating The Back-end API for Updating User in Front-end Part - 49
به روز رسانی کاربر در Local State Part - 50
Updating User in Local State Part - 50
تعریف قلاب سفارشی برای ارسال رمز تأیید قسمت - 51
Defining Custom Hook for Sending Auth Token Part - 51
پیکربندی Node-mailer Part - 52
Configuring Node-mailer Part - 52
ارسال ایمیل استاتیک قسمت - 53
Sending Static Mail Part - 53
ایجاد انتقال دهنده برای ارسال ایمیل قسمت - 54
Creating Transporter to Send Email Part - 54
طراحی اولین صفحه ejs ما - قسمت 55
Designing Our First ejs Page Part - 55
پیکربندی ejs قسمت - 56
Configuring ejs Part - 56
درک جریان به روز رسانی رمز عبور - قسمت 57
Understanding The Flow of Update Password Part - 57
API Back-end را برای بهروزرسانی قسمت 58 رمز عبور تکمیل کنید
Complete The Back-end API to Update Password Part - 58
حل مشکل به روز رسانی رمز عبور - قسمت 59
Solving The Bug of The Updating Password Part - 59
طراحی صفحه بازنشانی رمز عبور - 60
Design The Reset Password Page Part - 60
یکپارچه سازی Back-end برای ارسال ایمیل بازنشانی رمز عبور - قسمت 61
Integrating The Back-end to Send Reset Password Email Part - 61
تکمیل Reset Password Front-end Part - 62
Completing The Reset Password Front-end Part - 62
یکپارچه سازی منطق برای به روز رسانی رمز عبور از قسمت Back-end - 63
Integrating The Logic for Updating The Password From Back-end Part - 63
تکمیل به روز رسانی رمز عبور - قسمت 64
Completing The Updating of Password Part - 64
راه اندازی اعتبارنامه AWS قسمت - 65
Setting Up AWS Credentials Part - 65
پیکربندی کلاینت AWS در قسمت Back-end - 66
Configuring AWS Client in Back-end Part - 66
ابزار میانافزار را برای آپلود مستقیم در AWS Bucket Part - 67 مولتر کنید
Multer Middle-ware to Directly Upload in AWS Bucket Part - 67
تعریف طرحواره ویدئو قسمت - 68
Defining Video Schema Part - 68
تعریف نوع طرحواره ویدیو قسمت - 69
Defining Type of Video Schema Part - 69
درک کار آپلود قسمت - 70
Understanding The Working of Uploading Part - 70
تکمیل آپلود کنترلر ویدیو قسمت - 71
Completing Uploading Video Controller Part - 71
تست API برای آپلود ویدیو قسمت - 72
Testing API for The Uploading of Video Part - 72
پیکربندی APIها برای آپلود قسمت ویدیو - 73
Configuring APIs for The Uploading of Video Part - 73
تکمیل آپلود API ویدیو در قسمت Back-end - 74
Completing Upload Video API in The Back-end Part - 74
رفع خط مشی سطل - 75
Fixing The Bucket Policy Part - 75
طراحی قسمت آپلود صفحه - 76
Designing Upload Page Part - 76
تکمیل قسمت آپلود صفحه - 77
Completing The Upload Page Part - 77
طراحی اولین ویرایشگر متن ما - قسمت 78
Designing Our First Text Editor Part - 78
گرفتن داده ها از قسمت جلویی - 79
Capturing The Data From The Front-end Part - 79
ایجاد URL برای تصویر کوچک و فایل های آپلود شده قسمت - 80
Creating Url for Thumbnail and Files Uploaded Part - 80
آشنایی با نحوه ارسال فایل ها به قسمت Back-end - 81
Understanding How to Send Files to The Back-end Part - 81
ارسال فایل ها و سایر جزئیات به قسمت Back-end - 82
Sending The Files and Other Details to The Back-end Part - 82
تست آپلود ویدیو از قسمت جلویی - 83
Testing of Uploading The Video From Front-end Part - 83
Back-end API برای واکشی آخرین ویدیوها قسمت - 84
Back-end API For Fetching Latest Videos Part - 84
Back-end API برای واکشی قسمت تک ویدیو - 85
Back-end API for Fetching Single Video Part - 85
Back-end API برای حذف قسمت تک ویدیو - 86
Back-end API for Deleting The Single Video Part - 86
Back-end API برای دانلود قسمت ویدیو - 87
Back-end API for Downloading Video Part - 87
درک نحوه عملکرد دانلودها قسمت - 88
Understanding How Downloads Worked Part - 88
API Back-end برای به روز رسانی جزئیات ویدیو قسمت - 89
Back-end API for Updating Video Details Part - 89
تست Back-end API برای به روز رسانی قسمت ویدیو - 90
Testing Back-end API for Updating The Video Part - 90
بازبینی قسمت Git - 91
Revisit Git Part - 91
تعریف انواع ویدیو در قسمت کاهش دهنده ویدیو - 92
Defining Types of Video in The Video Reducer Part - 92
یکپارچه سازی API Back-end برای فیلم های عمومی قسمت - 93
Integrating The Back-end API for The Public Videos Part - 93
انتخاب قسمت فیلم عمومی - 94
Selecting The Public Video Part - 94
طراحی قسمت کارت گرافیک قهرمان - 95
Designing Hero Video Card Part - 95
درک React Player Part - 96
Understanding React Player Part - 96
طراحی قسمت اشتراک و سایر آیکون ها - 97
Designing The Share and Other Icons Part - 97
قالب بندی قسمت مدت زمان ویدیو - 98
Formatting The Video Duration Part - 98
طراحی قسمت صفحه همه ویدیوها - 99
Designing The All Videos Page Part - 99
طراحی صفحه ویدیوی خانگی قسمت - 100
Designing The Home Video Page Part - 100
تکمیل بخش ویدیوی خانگی - 101
Completing The Home Video Section Part - 101
درک قسمت اسلایدر - 102
Understanding The Slider Part - 102
رفع اشکال طراحی قسمت - 103
Fixing The Design Bug Part - 103
یکپارچه سازی Back-end API برای دانلود قسمت ویدیو - 104
Integrating The Back-end API for Downloading The Video Part - 104
ادغام عملکرد دانلود در قسمت جلویی - 105
Integrating The Download Functionality to The Front-end Part - 105
طراحی قسمت تک صفحه ویدیو - 106
Designing The Single Video Page Part - 106
تکمیل قسمت تک صفحه ویدیو - 107
Completing The Single Video Page Part - 107
نمایش دادهها در صفحه ویدیوی واحد - 108
Showing Data on Single Video Page Part - 108
اضافه کردن لودر در صفحه ویدیوی تک قسمت - 109
Adding Loader on Single Video Page Part - 109
API Back-end برای واکشی ویدیوهای آپلود شده توسط کاربران وارد شده قسمت - 110
Back-end API To Fetch Videos Uploaded by Logged in Users Part - 110
API Back-end برای واکشی ویدیوها برای کاربران وارد شده به قسمت Front-end - 111
Back-end API to Fetch Videos for Logged in User to The Front-end Part - 111
درک آپدیت قسمت ویدیو - 112
Understanding Update of Video Part - 112
Styling Active Link Part - 113
Styling Active Link Part - 113
ادغام حذف ویدیو در قسمت جلویی - 114
Integrating The Delete of Video to The Front-end Part - 114
تکمیل حذف قسمت ویدیو - 115
Completing Deleting of Video Part - 115
طراحی قسمت آپدیت ویدیو صفحه - 116
Designing The Update Video Page Part - 116
از قبل جمعآوری دادهها برای صفحه ویدیوی بهروزرسانی بخش - 117
Pre Populating The Data for The Update Video Page Part - 117
یکپارچه سازی API Back-end برای به روز رسانی ویدیو به قسمت Front-end - 118
Integrating The Back-end API for Update of the Video to The Front-end Part - 118
درک عملکرد به روز رسانی بخش - 119
Understanding The Update Functionality Part - 119
تکمیل تمام صفحات ویدیو قسمت - 120
Completing All The Video Pages Part - 120
اجرای جستجوی فیلم ها قسمت - 121
Implementing Searching of Videos Part - 121
ادغام جستجو با بخش UI - 122
Integrating The Search With UI Part - 122
نمایش نتایج جستجو قسمت - 123
Displaying Search Results Part - 123
طراحی قطعه لودر سفارشی - 124
Designing a Custom Loader Part - 124
قسمت صفحه داشبورد کاربر طراحی - 125
Design User Dashboard Page Part - 125
نمایش اطلاعات کاربر قسمت - 126
Displaying User Info Part - 126
نمایش تعداد آپلود و دانلود کاربر قسمت - 127
Showing User Upload and Download Count Part - 127
جابجایی بین ورود به سیستم و صفحه داشبورد - 128
Toggling Between Sign in and Dashboard Page Part - 128
پیاده سازی Skeleton Loading and Loader Part - 129
Implementing Skeleton Loading and Loader Part - 129
استقرار بخش Front-end - 130
Deploying Front-end Part - 130
پیکربندی Vercel.json برای قسمت Front-end و Back-end - 131
Configuring The Vercel.json for Front-end and Back-end Part - 131
درک محدودیت در متغیرهای env توسط Vercel Part - 132
Understanding The Restriction on .env Variables by Vercel Part - 132
استقرار قسمت Back-end - 133
Deploying Back-end Part - 133
حل خطای Cors و تست قسمت - 134
Solving The Cors Error and Testing Part - 134
نمایش نظرات