آموزش دوره مگا ری‌اکت: ساخت ۵۰ پروژه واقعی در ۵۰ روز - آخرین آپدیت

دانلود React Mega Course: Build 50 Real World Projects in 50 Days

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

آموزش جامع برنامه‌نویسی React: توسعه اپلیکیشن‌های وب با Socket، REST API، Firebase، React Hooks، Bootstrap و React.js

ساخت اپلیکیشن‌های وب قدرتمند، سریع، کاربرپسند و واکنشی (Reactive)

یادگیری ایجاد پروژه‌های واقعی React

درک عمیق React و نحوه عملکرد آن

ایجاد رزومه کاری با پروژه‌های واقعی در یکی از پرطرفدارترین تکنولوژی‌های توسعه وب

مشاهده فرآیند گام به گام طراحی و ساخت یک پروژه پیشرفته

مفاهیم عملی از پایه تا پیشرفته در توسعه React

پیش‌نیازها

دانش پایه React

اولین دلیل برای یادگیری ReactJS، محبوبیت و استفاده گسترده آن در میان توسعه‌دهندگان حرفه‌ای است.

هر کسب‌وکار موفقی از React استفاده می‌کند و به طور روزانه به دنبال استعدادهای جدید در این زمینه است.

اگر در مورد اینکه آیا یادگیری React و تبدیل شدن به یک توسعه‌دهنده React می‌تواند منجر به شغل جدید شود شک دارید، نگران نباشید. هزاران فرصت شغلی برای توسعه‌دهندگان React (حتی دورکار) در حال حاضر در بازار وجود دارد.

پس اگر می‌خواهید یک توسعه‌دهنده React شوید، همین حالا اقدام کنید! این زمان مناسبی برای این کار است.

و دلیلی وجود دارد که چرا کسب‌وکارها React را اینقدر دوست دارند و از آن استفاده می‌کنند! این دلیل ما را به دلیل دوم برای یادگیری React در سال 2023 می‌رساند.

کار با React به لطف سادگی و زیرساخت ماژولار خود، زندگی ما را به عنوان توسعه‌دهنده آسان‌تر می‌کند. ما می‌توانیم برنامه‌های خود را بسیار سریع‌تر بسازیم و نگهداری کنیم. مردم آن را دوست دارند، من آن را دوست دارم، و شما هم آن را دوست خواهید داشت!

در این دوره، برنامه‌نویسی React را به صورت عملی یاد می‌گیرید و اپلیکیشن‌های وب واقعی را با استفاده از Socket، REST API، Firebase، React Hooks، Bootstrap، React.js، Webpack، HTML5، CSS3 و React-Router توسعه می‌دهید.

حقوق توسعه‌دهندگان React بر اساس منطقه

نیویورک - 142,350 دلار

جورجیا - 135,000 دلار

نیوجرسی - 131,625 دلار

کالیفرنیا - 130,000 دلار

ایلینوی - 126,750 دلار

آریزونا - 121,875 دلار

تگزاس - 117,000 دلار

در این دوره، ما روی 50 پروژه واقعی توسعه React کار خواهیم کرد که در زیر لیست شده‌اند:

لیست پروژه‌های دوره:

  • پروژه 1: فروشگاه آنلاین (کلون آمازون) - React، React-Context-Api، Firebase
  • پروژه 2: اپلیکیشن چت - React، React Chat Engine، Socket، Rest API
  • پروژه 3: اپلیکیشن فیلم (OTT) - React، OMDB API، React Hooks، Bootstrap
  • پروژه 4: وب‌سایت اشتراک‌گذاری ویدئو - React، YouTube API، Material-UI، Axios
  • پروژه 5: وب‌سایت لیست وظایف (Todo List) - React، Material-UI، React Hooks، مدیریت وضعیت
  • پروژه 6: وب‌سایت وبلاگ - React، Material-UI، React Hooks، مدیریت وضعیت، GNews API
  • پروژه 7: وب‌سایت شبکه‌های اجتماعی - Material-UI، React Hooks، مدیریت وضعیت، Google OAuth، امنیت و احراز هویت
  • پروژه 8: وب‌سایت رزومه (پورتفولیو) - React، Material-UI، React Hooks، مدیریت وضعیت
  • پروژه 9: اپلیکیشن جستجوی اموجی با React - React، ReactDOM، HTML5، CSS3
  • پروژه 10: اپلیکیشن شخصیت‌های Breaking Bad با React - React، ReactDOM، HTML5، SCSS، React Context
  • پروژه 11: اپلیکیشن تولیدکننده نقل قول تصادفی با React و استقرار در Heroku
  • پروژه 12: اپلیکیشن تولیدکننده رمز عبور با React - React، ReactDOM، HTML5، CSS
  • پروژه 13: اپلیکیشن آزمون (Quiz) با React - React، ReactDOM، HTML5، SCSS
  • پروژه 14: گالری تصاویر Unsplash با React - ReactDOM، React Hooks
  • پروژه 15: اپلیکیشن دمو React Router با ReactJs - React JS، NPM، CSS، React Router Dom، Context، React Hooks
  • پروژه 16: اپلیکیشن قفسه کتاب با React - React JS، NPM، CSS، مدیریت وضعیت
  • پروژه 17: اپلیکیشن یادداشت‌برداری با React و Redux - React JS، NPM، CSS، مدیریت وضعیت، Redux، React-Redux، CRA
  • پروژه 18: اپلیکیشن ثبت تماس React - React JS، NPM، CSS، مدیریت وضعیت، React Context، Hooks
  • پروژه 19: اپلیکیشن خرج کردن پول با React - React JS، NPM، CSS، مدیریت وضعیت، React Context، Hooks
  • پروژه 20: اپلیکیشن رزرو اقامتگاه با React - React JS، NPM، CSS، مدیریت وضعیت، Hooks، CRA
  • پروژه 21: ماشین حساب شاخص توده بدنی (BMI) با React - React JS، NPM، CSS، مدیریت وضعیت، React Context، Hooks، Context
  • پروژه 22: فروشگاه مبلمان با React و Redux - React JS، NPM، CSS، مدیریت وضعیت، React Context، Hooks
  • پروژه 23: اپلیکیشن تابلو امتیاز (Scoreboard) با ReactJS - React JS، NPM، CSS، مدیریت وضعیت، React Context، Hooks
  • پروژه 24: اپلیکیشن تولیدکننده متا تگ با React - React JS، NPM، CSS، مدیریت وضعیت، React Context، Hooks
  • پروژه 25: اپلیکیشن سفارش غذا - ReactJs، Material-UI، React Router، CSS
  • پروژه 26: اپلیکیشن آب و هوا با استفاده از API - ReactJs، Open Weather API، CSS
  • پروژه 27: اپلیکیشن دستور غذا - ReactJs، Edamam API، Firebase برای هاستینگ، CSS
  • پروژه 28: اپلیکیشن سبد خرید من - ReactJs، React Hooks، API خارجی، CSS
  • پروژه 29: اپلیکیشن منوی کافه - ReactJs، React Hooks، Firebase، CSS
  • پروژه 30: اپلیکیشن وب کافه کوکتل - ReactJs، React Hooks، API خارجی، Context API، CSS
  • پروژه 31: اپلیکیشن ارسال بازخورد - ReactJs، Material-UI، CSS، Nanoid
  • پروژه 32: اپلیکیشن پومودورو - ReactJs، بسته npm React Countdown Timer، CSS
  • پروژه 33: اپلیکیشن جستجوی گوگل با استفاده از API - ReactJs، Tailwind CSS، Google Search API، React Router Dom، React Player
  • پروژه 34: بازی دوز (Tic-Tac-Toe) با React JS
  • پروژه 35: اپلیکیشن شمارنده کلمه و حرف با استفاده از React JS، شامل هوک‌های useState و جاوا اسکریپت خالص.
  • پروژه 36: مبدل ارز با React JS
  • پروژه 37: اپلیکیشن تشخیص گفتار، دستیار صوتی با React JS
  • پروژه 38: نحوه ساخت ماشین حساب با React JS، با هوک‌ها
  • پروژه 39: ساخت اپلیکیشن بودجه با React JS، هوک‌ها، هوک‌های سفارشی، مفهوم React Context
  • پروژه 40: پخش کننده موسیقی با React JS (کلون اسپاتیفای) با رابط کاربری مناسب و با استفاده از API رسمی اسپاتیفای
  • پروژه 41: اپلیکیشن تقویم با قابلیت زمان‌بندی رویدادها
  • پروژه 42: اپلیکیشن دیکشنری با React JS
  • پروژه 43: کلون یوتیوب با React JS
  • پروژه 44: بازی کندی کراش با React JS
  • پروژه 45: چیزهای نجومی روز با استفاده از ReactJs، CSS، React Hooks، API APOD ناسا
  • پروژه 46: سنگ، کاغذ، قیچی با Reactjs، CSS، React Hooks
  • پروژه 47: اپلیکیشن اعلان بلادرنگ با استفاده از ReactJs، CSS، React Hooks، Socket
  • پروژه 48: اپلیکیشن ردیاب COVID-19 با استفاده از ReactJs، CSS، React Hooks
  • پروژه 49: اپلیکیشن تولیدکننده گیف تصادفی با ReactJs، React Hooks، CSS، API، جاوا اسکریپت ناهمزمان
  • پروژه 50: اپلیکیشن ردیاب آتش‌سوزی جنگل با Reactjs، CSS، جاوا اسکریپت ناهمزمان، NASA Open API

نکته (این را بخوانید): این دوره ارزش وقت و پول شما را دارد، همین حالا ثبت نام کنید قبل از اینکه پیشنهاد منقضی شود.


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

معرفی دوره Course Introduction

  • معرفی دوره Course Introduction

  • طرح کلی دوره Course Outline

معرفی دوره Course Introduction

  • معرفی دوره Course Introduction

  • طرح کلی دوره Course Outline

مقدمة الدورة Introduction To The Course

  • مقدمة الدورة Introduction To The Course

  • مخطط الدورة Course Outline

المشروع 1: التجارة الإلكترونية (نسخة طبق الأصل من أمازون) - React، React-Context-API، Firebase Project-1 : E-Commerce (Amazon Clone) - React, React-Context-Api, Firebase

  • مقدمه ای بر پروژه Intro To The Project

  • مقدمة للمشروع - التجارة الإلكترونية (نسخة طبق الأصل من أمازون) Intro To The Project - E-Commerce (Amazon Clone)

  • البدء مع React Getting Started With React

  • رأس متجر الإلكترونيات eShop Header

  • الصفحة الرئيسية لمتجر الإلكترونيات eShop Home Page

  • خصائص React React Props

  • التوجيه في React React Routing

  • صفحة الدفع لمتجر الإلكترونيات eShop Checkout Page

  • React Context API React Context API

  • الإضافة إلى السلة Add To Basket

  • الإزالة من السلة Remove From Basket

  • المصادقة باستخدام Firebase Authentication Using Firebase

  • نشر التطبيق Deploying The App

  • تنزيل ملفات المشروع Download The Project Files

Project-1: تجارت الکترونیک (Amazon Clone) - React، React-Context-Api، Firebase Project-1 : E-Commerce (Amazon Clone) - React, React-Context-Api, Firebase

  • مقدمه ای بر پروژه Intro To The Project

  • شروع با React Getting Started With React

  • سربرگ فروشگاه الکترونیکی eShop Header

  • صفحه اصلی فروشگاه اینترنتی eShop Home Page

  • React Props React Props

  • React Routing React Routing

  • صفحه پرداخت الکترونیکی فروشگاه eShop Checkout Page

  • React Context API React Context API

  • به سبد اضافه کن Add To Basket

  • حذف از سبد Remove From Basket

  • احراز هویت با استفاده از Firebase Authentication Using Firebase

  • استقرار برنامه Deploying The App

  • دانلود فایل های پروژه Download The Project Files

المشروع 2: تطبيق الدردشة - React، React Chatengine، Socket، Rest APIs Project-2 : Chat Application - React, React Chatengine, Socket, Rest Apis

  • مقدمة للمشروع - تطبيق الدردشة Intro To The Project - Chat Application

  • مقدمه ای بر پروژه Intro To The Project

  • البدء Getting Started

  • React Chat Engine React Chat Engine

  • المكونات Components

  • خلاصة الدردشة Chat Feed

  • مكون رسالتي My Message Component

  • مكون رسالتهم Their Message Component

  • عرض إيصالات القراءة Render Read Receipts

  • نموذج الرسالة Message Form

  • نموذج تسجيل الدخول Login Form

  • إنهاء المشروع Finishing Up The Project

  • تنزيل ملفات المشروع Download The Project Files

Project-2: برنامه چت - React، React Chatengine، Socket، Rest Apis Project-2 : Chat Application - React, React Chatengine, Socket, Rest Apis

  • مقدمه ای بر پروژه Intro To The Project

  • شروع شدن Getting Started

  • React Chat Engine React Chat Engine

  • اجزاء Components

  • فید چت Chat Feed

  • مؤلفه پیام من My Message Component

  • جزء پیام آنها Their Message Component

  • رسیدهای خواندن را رندر کنید Render Read Receipts

  • فرم پیام Message Form

  • فرم ورود Login Form

  • اتمام پروژه Finishing Up The Project

  • دانلود فایل های پروژه Download The Project Files

المشروع 3: تطبيق الأفلام (OTT) - React، OMDb API، React Hooks، Bootstrap Project-3 : Movies Application (Ott) - React, Omdb Api, React Hooks, Bootstrap

  • مقدمة للمشروع Intro To The Project

  • البدء Getting Started

  • OMDb API OMDb API

  • قائمة الأفلام Movie List

  • عنوان قائمة الأفلام ومربع البحث MovieListHeading and Searchbox

  • تطبيق ميزة البحث Implementing Search Feature

  • الإضافة إلى المفضلة Add To Favourite

  • الإزالة من المفضلة Remove From Favourites

  • التخزين المحلي Local Storage

  • إنهاء المشروع. Finishing Up The Project.

  • تنزيل ملفات المشروع Download The Project Files

Project-3 : Movies Application (Ott) - React، Omdb Api، React Hooks، Bootstrap Project-3 : Movies Application (Ott) - React, Omdb Api, React Hooks, Bootstrap

  • مقدمه ای بر پروژه Intro To The Project

  • شروع شدن Getting Started

  • OMDb API OMDb API

  • لیست فیلم Movie List

  • MovieListHeading و Searchbox MovieListHeading and Searchbox

  • پیاده سازی ویژگی جستجو Implementing Search Feature

  • به موارد دلخواه اضافه کنید Add To Favourite

  • حذف از موارد دلخواه Remove From Favourites

  • محل ذخیره سازی Local Storage

  • اتمام پروژه. Finishing Up The Project.

  • دانلود فایل های پروژه Download The Project Files

المشروع 4: موقع مشاركة الفيديو - React، YouTube API، Material-UI، Axios Project-4 : Video Sharing Website - React, Youtube Api, Material-Ui, Axios

  • مقدمة للمشروع Into To The Project

  • البدء. Getting Started.

  • React Material-UI React Material-UI

  • Youtube API Youtube API

  • مكون شريط البحث. SearchBar Component.

  • React State Hooks React State Hooks

  • مكون تفاصيل الفيديو VideoDetail Component

  • مكون قائمة الفيديو VideoList Component

  • مكون عنصر الفيديو VideoItem Component

  • الإنهاء Finishing Up

  • تنزيل ملفات المشروع Download The Project Files

Project-4: وب سایت اشتراک گذاری ویدیو - React، Youtube Api، Material-Ui، Axios Project-4 : Video Sharing Website - React, Youtube Api, Material-Ui, Axios

  • به پروژه Into To The Project

  • شروع شدن. Getting Started.

  • React Material-UI React Material-UI

  • Youtube API Youtube API

  • کامپوننت نوار جستجو SearchBar Component.

  • React State Hooks React State Hooks

  • جزء VideoDetail VideoDetail Component

  • مؤلفه فهرست ویدیویی VideoList Component

  • جزء VideoItem VideoItem Component

  • در حال اتمام Finishing Up

  • دانلود فایل های پروژه Download The Project Files

المشروع 5: موقع Todolist - React، Material-UI، React Hooks، إدارة الحالة Project-5 : Todolist Website - React, Material-Ui, React Hooks, State Management

  • مقدمة للمشروع. Intro To The Project.

  • البدء مع React. Getting Started With React.

  • مكون الرأس. Header Component.

  • مكون إنشاء المنطقة CreateArea Component

  • إضافة ملاحظة Add Note

  • متابعة إضافة ملاحظة Add Note Continuation

  • CSS منطقة الإنشاء CreateArea CSS

  • مكون الملاحظة Note Component

  • حذف الملاحظة Deleting Note

  • مكون التذييل Footer Component

  • إكمال CSS Completing CSS

  • الإنهاء Finishing Up

  • تنزيل ملفات المشروع Download The Project Files

Project-5: وب سایت Todolist - React، Material-Ui، React Hooks، State Management Project-5 : Todolist Website - React, Material-Ui, React Hooks, State Management

  • مقدمه ای بر پروژه Intro To The Project.

  • شروع با React. Getting Started With React.

  • کامپوننت هدر. Header Component.

  • کامپوننت CreateArea CreateArea Component

  • اضافه کردن یادداشت Add Note

  • اضافه کردن یادداشت ادامه Add Note Continuation

  • CreateArea CSS CreateArea CSS

  • کامپوننت یادداشت Note Component

  • در حال حذف یادداشت Deleting Note

  • کامپوننت پاورقی Footer Component

  • در حال تکمیل CSS Completing CSS

  • در حال اتمام Finishing Up

  • دانلود فایل های پروژه Download The Project Files

Project-6 : وب سایت وبلاگ - React، Material-Ui، React Hooks، State Management، Gn Project-6 : Blog Website - React, Material-Ui, React Hooks, State Management, Gn

  • مقدمه ای بر پروژه Intro To The Project

  • شروع شدن Getting Started

  • userSlice.js. userSlice.js.

  • store.js _ index.js store.js _ index.js

  • جزء صفحه اصلی Homepage Component

  • کامپوننت نوار ناوبری Navbar Component

  • پایان ناوبر Finishing Navbar

  • Gnews API Gnews API

  • جزء وبلاگ ها Blogs Component

  • اتمام پروژه Finishing Up The Project

  • دانلود فایل های پروژه Download The Project Files

Project-6 : وب سایت وبلاگ - React، Material-Ui، React Hooks، State Management، Gn Project-6 : Blog Website - React, Material-Ui, React Hooks, State Management, Gn

  • مقدمه ای بر پروژه Intro To The Project

  • شروع شدن Getting Started

  • userSlice.js. userSlice.js.

  • store.js _ index.js store.js _ index.js

  • جزء صفحه اصلی Homepage Component

  • کامپوننت نوار ناوبری Navbar Component

  • پایان ناوبر Finishing Navbar

  • Gnews API Gnews API

  • جزء وبلاگ ها Blogs Component

  • اتمام پروژه Finishing Up The Project

  • دانلود فایل های پروژه Download The Project Files

المشروع 6: موقع مدونة - React، Material-UI، React Hooks، إدارة الحالة Project-6 : Blog Website - React, Material-Ui, React Hooks, State Management

  • مقدمة للمشروع - موقع مدونة Intro To The Project - Blog Website

  • البدء Getting Started

  • userSlice.js. userSlice.js.

  • store.js _ index.js store.js _ index.js

  • مكون الصفحة الرئيسية Homepage Component

  • مكون شريط التنقل Navbar Component

  • إنهاء شريط التنقل Finishing Navbar

  • GNews API Gnews API

  • مكون المدونات Blogs Component

  • إنهاء المشروع Finishing Up The Project

  • تنزيل ملفات المشروع Download The Project Files

المشروع 7: موقع شبكات اجتماعية - Material-UI، React Hooks، إدارة الحالة Project-7 : Social Networking Website - Material-Ui, React Hooks, State Manageme

  • مقدمة للمشروع - موقع شبكات اجتماعية Intro To The Project - Social Networking Website

  • مقدمه ای بر پروژه Intro To The Projec

  • البدء. Getting Started.

  • المصادقة والأمان Authentication and Security

  • تشفير قاعدة البيانات. Database Encryption.

  • متغير البيئة Environment Variable

  • التجزئة Hashing

  • الملح والتجزئة. Salting and Hashing.

  • ملفات تعريف الارتباط Cookies

  • الجلسات Sessions

  • Google OAuth Google OAuth

  • تنزيل ملفات المشروع Download The Project Files

Project-7: وب سایت شبکه های اجتماعی - Material-Ui، React Hooks، State Manageme Project-7 : Social Networking Website - Material-Ui, React Hooks, State Manageme

  • مقدمه ای بر پروژه Intro To The Projec

  • شروع شدن. Getting Started.

  • احراز هویت و امنیت Authentication and Security

  • رمزگذاری پایگاه داده Database Encryption.

  • متغیر محیطی Environment Variable

  • هش کردن Hashing

  • نمک زدن و هش کردن. Salting and Hashing.

  • بیسکویت ها Cookies

  • جلسات Sessions

  • Google OAuth Google OAuth

  • دانلود فایل های پروژه Download The Project Files

المشروع 8: موقع السيرة الذاتية (ملف شخصي) - React، Material-UI، React Hooks، الحالة Project-8 : Resume Website (Portfolio) - React, Material-Ui, React Hooks, State

  • مقدمة للمشروع Intro To The Project

  • البدء Getting Started

  • التبعيات والمكونات Dependencies and Components

  • React-Router-DOM React-Router-DOM

  • خصائص ومكون الصفحة الرئيسية Props and Home Component

  • مكون شريط التنقل Navbar Component

  • مكون حول About Component

  • تعيين تفكيك Destructuring Assignment

  • إنهاء المكون Finishing Component

  • إنهاء المشروع Finishing Up The Project

  • تنزيل ملفات المشروع Download The Project Files

پروژه-8 : وب سایت رزومه (پورتفولیو) - React، Material-Ui، React Hooks، State Project-8 : Resume Website (Portfolio) - React, Material-Ui, React Hooks, State

  • مقدمه ای بر پروژه Intro To The Project

  • شروع شدن Getting Started

  • وابستگی ها و مولفه ها Dependencies and Components

  • React-Router-DOM React-Router-DOM

  • لوازم و مولفه خانه Props and Home Component

  • کامپوننت نوار ناوبری Navbar Component

  • درباره کامپوننت About Component

  • واگذاری ساختارشکن Destructuring Assignment

  • کامپوننت نهایی Finishing Component

  • اتمام پروژه Finishing Up The Project

  • دانلود فایل های پروژه Download The Project Files

المشروع 9: تطبيق بحث عن الرموز التعبيرية مصنوع من React - React، React DOM، HTML5 Project-9 : An Emoji Search Application Made With React - React, Reactdom, Html5

  • مقدمة التطبيق App Introduction

  • إنشاء تطبيق React الخاص بنا Creating Our React App

  • إضافة هيكل المجلدات Adding Folder Structure

  • ملء App.jsx Populating App.jsx

  • إنشاء الرأس Creating Header

  • إضافة CSS إلى الرأس Adding CSS to Header

  • إضافة شريط البحث Adding Search Bar

  • إضافة الحالة Adding State

  • Results.jsx Results.jsx

  • EmojiResults EmojiResults

  • خطأ Error

  • إضافة الأنماط Adding Styles

  • إضافة الدوال Adding Functions

  • تعديل Filter.js Modifying Filter.js

  • إعادة الصياغة النهائية Final Refactor

  • النشر Deployment

  • تنزيل ملفات المشروع Download The Project Files

Project-9: یک برنامه جستجوی ایموجی ساخته شده با React - React، Reactdom، Html5 Project-9 : An Emoji Search Application Made With React - React, Reactdom, Html5

  • معرفی اپلیکیشن App Introduction

  • ایجاد برنامه React ما Creating Our React App

  • اضافه کردن ساختار پوشه Adding Folder Structure

  • پر کردن App.jsx Populating App.jsx

  • ایجاد سربرگ Creating Header

  • افزودن CSS به هدر Adding CSS to Header

  • افزودن نوار جستجو Adding Search Bar

  • افزودن ایالت Adding State

  • Results.jsx Results.jsx

  • Emoji Results EmojiResults

  • خطا Error

  • اضافه کردن سبک ها Adding Styles

  • افزودن توابع Adding Functions

  • اصلاح Filter.js Modifying Filter.js

  • فاینال فاکتور Final Refactor

  • گسترش Deployment

  • دانلود فایل های پروژه Download The Project Files

المشروع 10: تطبيق شخصيات Breaking Bad مصنوع من React - React، React Project-10 : A Breaking Bad Character Application Made With React - React, React

  • مقدمة التطبيق App Introduction

  • إنشاء تطبيق React Creating React Application

  • حفظ المنزل House Keeing

  • إعادة صياغة الكود في تطبيقنا Refactoring The Code in Our App

  • إضافة الحالة Adding State

  • إنشاء شريط البحث Creating SearchBar

  • جلب البيانات من API. Fetching Data from API.

  • إضافة كود إلى CharacterList. Adding Code to CharacterList.

  • عرض CharacterListItem Rendering CharcterListItem

  • معالجة الأخطاء Error Handling

  • تهيئة شاشة التحميل Configuring Loading Screen

  • إضافة الأنماط الجزء 1 Adding Styles Part 1

  • إضافة الأنماط الجزء 2. Adding Styles part-2.

  • تنزيل ملفات المشروع Download The Project Files

Project-10: یک برنامه کاراکتر بد که با React ساخته شده است - React, React Project-10 : A Breaking Bad Character Application Made With React - React, React

  • معرفی اپلیکیشن App Introduction

  • ساخت React Application Creating React Application

  • خانه داری House Keeing

  • Refactoring کد در برنامه ما Refactoring The Code in Our App

  • افزودن ایالت Adding State

  • ایجاد نوار جستجو Creating SearchBar

  • واکشی داده ها از API. Fetching Data from API.

  • اضافه کردن کد به CharacterList Adding Code to CharacterList.

  • رندر CharcterListItem Rendering CharcterListItem

  • رسیدگی به خطا Error Handling

  • پیکربندی صفحه بارگیری Configuring Loading Screen

  • افزودن سبک ها قسمت 1 Adding Styles Part 1

  • اضافه کردن سبک ها قسمت 2. Adding Styles part-2.

  • دانلود فایل های پروژه Download The Project Files

المشروع 11: تطبيق مولد اقتباسات عشوائية مصنوع من React ومنشور على Project-11 : A Random Quote Generator Application Made With React And Deployed O

  • مقدمة التطبيق. App Introduction.

  • إنشاء تطبيق React Creating React Application

  • مكون "مرحباً بالعالم" Hello World Component

  • هيكل المجلدات Folder Structure

  • تهيئة Quotes.jsx Configuring Quotes.jsx

  • تفكيك البيانات Destructuring Data

  • إضافة الأنماط الجزء 1 Adding Styles Part 1

  • إضافة الزر. Adding Button.

  • إضافة الأنماط الجزء 2 Adding Styles Part 2

  • إضافة API Adding API

  • إضافة معالج النقر Adding Click Handler

  • معالجة الأخطاء Error Handling

  • إضافة التذييل Adding Footer

  • إضافة خط العائلة. Adding Font Family.

  • دفع الكود إلى Github Pushing Code to Github

  • النشر على Heroku Deployment on Heroku

  • تنزيل ملفات المشروع Download The Project Files

Project-11: یک برنامه تولید کننده نقل قول تصادفی ساخته شده با React و Deployed O Project-11 : A Random Quote Generator Application Made With React And Deployed O

  • معرفی اپلیکیشن App Introduction.

  • ساخت React Application Creating React Application

  • کامپوننت Hello World Hello World Component

  • ساختار پوشه Folder Structure

  • پیکربندی Quotes.jsx Configuring Quotes.jsx

  • تخریب ساختار داده ها Destructuring Data

  • افزودن سبک ها قسمت 1 Adding Styles Part 1

  • اضافه کردن دکمه. Adding Button.

  • افزودن سبک ها قسمت 2 Adding Styles Part 2

  • افزودن API Adding API

  • اضافه کردن کنترل کننده کلیک Adding Click Handler

  • رسیدگی به خطا Error Handling

  • اضافه کردن پاورقی Adding Footer

  • افزودن خانواده فونت Adding Font Family.

  • ارسال کد به Github Pushing Code to Github

  • استقرار در هروکو Deployment on Heroku

  • دانلود فایل های پروژه Download The Project Files

المشروع 12: تطبيق مولد كلمات مرور مصنوع من React - React، React DOM، Project-12 : A Password Generator Application Made With React - React, Reactdom,

  • مقدمة التطبيق App Inroduction

  • إنشاء تطبيق React Creating React Application

  • التشغيل الأول First Run

  • تثبيت التبعيات Installing Dependencies

  • إنشاء HTML Creating HTML

  • إضافة Sass -1. Adding Sass -1.

  • إضافة Sass-2 Adding Sass-2

  • إضافة Sass-3 Adding Sass-3

  • إضافة Sass-3 Adding Sass-3

  • هيكل الأساليب Structure of Methods

  • إنشاء الأساليب Creating the Methods

  • شرح Explanation

  • تهيئة الخصائص Initializing Properties

  • إنشاء أساليب النسخ. Creating Copy Methods.

  • إضافة Toast Adding Toast

  • إعادة الصياغة النهائية. Final Refactor.

  • تنزيل ملفات المشروع Download The Project Files

Project-12: یک برنامه تولید کننده رمز عبور ساخته شده با React - React، Reactdom، Project-12 : A Password Generator Application Made With React - React, Reactdom,

  • معرفی اپلیکیشن App Inroduction

  • ساخت React Application Creating React Application

  • اولین اجرا First Run

  • نصب Dependencies Installing Dependencies

  • ایجاد HTML Creating HTML

  • افزودن Sass -1. Adding Sass -1.

  • افزودن Sass-2 Adding Sass-2

  • افزودن Sass-3 Adding Sass-3

  • افزودن Sass-3 Adding Sass-3

  • ساختار روشها Structure of Methods

  • ایجاد روش ها Creating the Methods

  • توضیح Explanation

  • مقداردهی اولیه خواص Initializing Properties

  • ایجاد روش های کپی Creating Copy Methods.

  • اضافه کردن نان تست Adding Toast

  • فاینال فاکتور Final Refactor.

  • دانلود فایل های پروژه Download The Project Files

المشروع 13: تطبيق اختبار مصنوع من React - React، React DOM، HTML5، SCSS Project-13 : A Quiz App Made With React - React, Reactdom, Html5, Scss

  • مقدمة التطبيق App Introduction

  • إنشاء تطبيق React Creating React App

  • هيكل المجلدات Folder Structure

  • إعداد Form.jsx Setting up Form.jsx

  • إضافة كود إلى المكونات الأخرى Adding Code to Other Components

  • إنشاء App.js Creating App.js

  • إضافة الحالة Adding State

  • تهيئة Context.jsx Configuring Context.jsx

  • إضافة الأساليب Adding Methods

  • إضافة الأساليب الأخرى Adding Other Methods

  • إدارة تدفق البيانات Managing DataFlow

  • إعادة صياغة البيانات Refactoring Data

  • إعداد البيانات في تطبيقنا Settings Data in Our App

  • إعادة هيكلة النافذة المنبثقة Restructuring Modal

  • إعادة هيكلة SetupForm Restructuring SetupForm

  • التعديلات النهائية Final Adjustements

  • تنزيل ملفات المشروع Download The Project Files

Project-13: برنامه امتحانی ساخته شده با React - React، Reactdom، Html5، Scss Project-13 : A Quiz App Made With React - React, Reactdom, Html5, Scss

  • معرفی اپلیکیشن App Introduction

  • ایجاد React App Creating React App

  • ساختار پوشه Folder Structure

  • راه اندازی Form.jsx Setting up Form.jsx

  • افزودن کد به اجزای دیگر Adding Code to Other Components

  • ایجاد App.js Creating App.js

  • افزودن ایالت Adding State

  • پیکربندی Context.jsx Configuring Context.jsx

  • روش های اضافه کردن Adding Methods

  • اضافه کردن روش های دیگر Adding Other Methods

  • مدیریت DataFlow Managing DataFlow

  • بازسازی داده ها Refactoring Data

  • داده های تنظیمات در برنامه ما Settings Data in Our App

  • Restructuring Modal Restructuring Modal

  • تغییر ساختار SetupForm Restructuring SetupForm

  • تنظیمات نهایی Final Adjustements

  • دانلود فایل های پروژه Download The Project Files

المشروع 14: تطبيق معرض صور Unsplash مصنوع من React - ReactDOM، React Project-14 : UnSplash Image Gallery Application made with React -ReactDOM, React

  • مقدمة التطبيق App Introduction

  • إنشاء تطبيق React Creating React App

  • إنشاء App.js Creating App.js

  • إنشاء الحالات Creating States

  • جولة في API. Tour of API.

  • جلب البيانات إلى التطبيق Fetching Data into Applicaton

  • صب البيانات في التطبيق Pouring Data Into Application

  • التمرير اللانهائي Infinite Scroll

  • ملء Photo.jsx Populating Photo.jsx

  • إضافة Submit Handle Adding Handle Submit

  • معالجة الأخطاء Error Handling

  • إضافة الأنماط Adding Styles

  • إضافة الأنماط الجزء 2 Adding styles part 2

  • إضافة الأنماط 3 Adding Styles 3

  • تصحيح الأخطاء الإملائية Fixing Typos

  • الممارسات الصحية Healthy Practices

  • تنزيل ملفات المشروع Download The Project Files

Project-14: برنامه UnSplash Image Gallery ساخته شده با React -ReactDOM, React Project-14 : UnSplash Image Gallery Application made with React -ReactDOM, React

  • معرفی اپلیکیشن App Introduction

  • ایجاد React App Creating React App

  • ایجاد App.js Creating App.js

  • ایجاد ایالات Creating States

  • گشت و گذار در API. Tour of API.

  • واکشی داده ها در اپلیکیشن Fetching Data into Applicaton

  • ریختن داده ها در برنامه Pouring Data Into Application

  • اسکرول بی نهایت Infinite Scroll

  • پر کردن Photo.jsx Populating Photo.jsx

  • اضافه کردن دسته ارسال Adding Handle Submit

  • رسیدگی به خطا Error Handling

  • اضافه کردن سبک ها Adding Styles

  • اضافه کردن سبک ها قسمت 2 Adding styles part 2

  • اضافه کردن سبک ها 3 Adding Styles 3

  • رفع اشتباهات تایپی Fixing Typos

  • تمرینات سالم Healthy Practices

  • دانلود فایل های پروژه Download The Project Files

المشروع 15: تطبيق تجريبي لـ React Router مصنوع من ReactJs - React Js، NPM، Project-15 : A React Router Demo Application made with ReactJs -React Js , NPM ,

  • مقدمة التطبيق. App Introduction.

  • إنشاء تطبيق React Creating React App

  • تنظيف المنزل House Keeping

  • مرحباً بالعالم Hello World

  • جزء السياق 1 Context part1

  • جزء السياق 2 Context Part2

  • الصفحة الرئيسية Homepage

  • صفحة حول About Page

  • التحقق من صحة النموذج Validation of Form

  • نموذج الاتصال الجزء 1 Contact Form Part 1

  • نموذج الاتصال الجزء 2 Contact Form Part 2

  • نموذج الاتصال الجزء 3 Contact Form Part 3

  • مكون المستخدم الجزء 1 User Component Part 1

  • مكون المستخدم الجزء 2 User Component Part 2

  • إنشاء مكون المستخدم الجزء 1 Creating User Component Part 1

  • مكون المستخدم الجزء 2 User Component Part 2

  • صفحة الخطأ Error Page

  • الاستيرادات الضرورية Necessary Imports

  • شريط التنقل Navabar

  • الإصلاح النهائي. Final Fix.

  • تنزيل ملفات المشروع Download The Project Files

Project-15: یک برنامه آزمایشی روتر React ساخته شده با ReactJs -React Js، NPM، Project-15 : A React Router Demo Application made with ReactJs -React Js , NPM ,

  • معرفی اپلیکیشن App Introduction.

  • ایجاد React App Creating React App

  • خانه داری House Keeping

  • سلام دنیا Hello World

  • قسمت زمینه 1 Context part1

  • قسمت 2 زمینه Context Part2

  • صفحه نخست Homepage

  • درباره صفحه About Page

  • اعتبار سنجی فرم Validation of Form

  • فرم تماس با بخش 1 Contact Form Part 1

  • فرم تماس قسمت 2 Contact Form Part 2

  • فرم تماس قسمت 3 Contact Form Part 3

  • کامپوننت کاربر قسمت 1 User Component Part 1

  • جزء کاربر قسمت 2 User Component Part 2

  • ایجاد کامپوننت کاربر قسمت 1 Creating User Component Part 1

  • جزء کاربر قسمت 2 User Component Part 2

  • صفحه خطا Error Page

  • واردات ضروری Necessary Imports

  • نوابر Navabar

  • رفع نهایی. Final Fix.

  • دانلود فایل های پروژه Download The Project Files

المشروع 16: تطبيق رف كتب مصنوع من React - React Js، NPM، CSS، St Project-16 : A Book Shelf Application made with React- React Js , NPM , CSS , St

  • مقدمة التطبيق App Intro

  • CRA CRA

  • التشغيل الأول First Run

  • تنظيف المنزل House Keeping

  • الخطوط Fonts

  • إنشاء السياق Creating Context

  • كيفية استخدام Create Context How to use Create Context

  • إنشاء سياق السمة Creating Theme Context

  • محتوى المحتوى Content Context

  • إنشاء المكونات Creating Components

  • الجزء التالي Next Part

  • إنشاء قائمة الكتب Creacting BookList

  • إنشاء كتاب Creating Book

  • الإصلاح النهائي Final Fix

  • النشر Deployment

  • تنزيل ملفات المشروع Download The Project Files

Project-16: یک برنامه قفسه کتاب ساخته شده با React-React Js، NPM، CSS، St. Project-16 : A Book Shelf Application made with React- React Js , NPM , CSS , St

  • معرفی برنامه App Intro

  • CRA CRA

  • اولین اجرا First Run

  • خانه داری House Keeping

  • فونت ها Fonts

  • ایجاد زمینه Creating Context

  • نحوه استفاده از Create Context How to use Create Context

  • ایجاد زمینه تم Creating Theme Context

  • زمینه محتوا Content Context

  • ایجاد کامپوننت ها Creating Components

  • قسمت بعدی Next Part

  • ایجاد فهرست کتاب Creacting BookList

  • ایجاد کتاب Creating Book

  • رفع نهایی Final Fix

  • گسترش Deployment

  • دانلود فایل های پروژه Download The Project Files

المشروع 17: تطبيق تدوين ملاحظات مصنوع من React و Redux - React Js، NPM Project-17 : A Note Taking Application Made with React and Redux-React Js , NPM

  • مقدمة التطبيق. App Intro.

  • CRA CRA

  • التشغيل الأول First Run

  • ملحقات لـ React Extensions For React

  • إنشاء المكونات Creating Components

  • المكونات الجزء 2 Components Part 2

  • إضافة المكونات الجزء 3 Adding Components Part 3

  • إضافة Redux Adding Redux

  • إنشاء المتجر Creating Store

  • جعل المتجر متاحاً Making Store Available

  • إضافة المتجر الجزء 2. Adding Store Part 2.

  • التوصيل Connecting

  • إنشاء مكون البحث Creating Search Component

  • إنشاء NoteItem Creating NoteItem

  • إكمال التطبيق App Completion

  • تنزيل ملفات المشروع Download The Project Files

Project-17: یک برنامه یادداشت برداری ساخته شده با React و Redux-React Js، NPM Project-17 : A Note Taking Application Made with React and Redux-React Js , NPM

  • معرفی برنامه App Intro.

  • CRA CRA

  • اولین اجرا First Run

  • برنامه های افزودنی برای React Extensions For React

  • ایجاد کامپوننت ها Creating Components

  • اجزای بخش 2 Components Part 2

  • افزودن کامپوننت ها قسمت 3 Adding Components Part 3

  • افزودن Redux Adding Redux

  • ایجاد فروشگاه Creating Store

  • در دسترس قرار دادن فروشگاه Making Store Available

  • افزودن قسمت 2 فروشگاه Adding Store Part 2.

  • برقراری ارتباط Connecting

  • ایجاد کامپوننت جستجو Creating Search Component

  • ایجاد NoteItem Creating NoteItem

  • تکمیل برنامه App Completion

  • دانلود فایل های پروژه Download The Project Files

المشروع 18: تطبيق سجل جهات اتصال React - React Js، NPM، CSS، إدارة الحالة Project-18 : A React Contact Register Application-React Js , NPM , CSS , State M

  • مقدمة التطبيق. App Introduction.

  • CRA CRA

  • هيكل المجلدات Folder Structure

  • الملحقات Extensions

  • إنشاء المكونات Creating Components

  • إنشاء قائمة جهات الاتصال Creating ContactList

  • إنشاء نموذج الاتصال Creating Contact Form

  • الأنماط Styles

  • الأنماط 2 Styles 2

  • تنزيل ملفات المشروع Download The Project Files

Project-18 : React Contact Register Application-React Js , NPM , CSS , State M Project-18 : A React Contact Register Application-React Js , NPM , CSS , State M

  • معرفی اپلیکیشن App Introduction.

  • CRA CRA

  • ساختار پوشه Folder Structure

  • برنامه های افزودنی Extensions

  • ایجاد کامپوننت ها Creating Components

  • ایجاد لیست تماس Creating ContactList

  • ایجاد فرم تماس Creating Contact Form

  • سبک ها Styles

  • سبک 2 Styles 2

  • دانلود فایل های پروژه Download The Project Files

المشروع 19: تطبيق إنفاق الأموال مصنوع من React - React Js، NPM، CSS، إدارة الحالة Project-19 : A Spend Money App made with React-React Js , NPM , CSS , State Mana

  • مقدمة التطبيق App Introduction

  • إنشاء تطبيق React Creating React Application

  • التشغيل الأول First Run

  • ملحقات لـ React Extensions For React

  • إنشاء المكونات Creating Components

  • إنشاء المكونات المطلوبة Making Required Components

  • إنشاء App.jsx Creating App.jsx

  • إنشاء مكون Creating A Component

  • CardItem CardItem

  • إضافة سلة Add Basket

  • إزالة عنصر Remove Item

  • اللمسة الأخيرة Final Touch

  • تنزيل ملفات المشروع Download The Project Files

Project-19: یک برنامه Spend Money ساخته شده با React-React Js، NPM، CSS، State Mana Project-19 : A Spend Money App made with React-React Js , NPM , CSS , State Mana

  • معرفی اپلیکیشن App Introduction

  • ساخت React Application Creating React Application

  • اولین اجرا First Run

  • برنامه های افزودنی برای React Extensions For React

  • ایجاد کامپوننت ها Creating Components

  • ساخت اجزای مورد نیاز Making Required Components

  • ایجاد App.jsx Creating App.jsx

  • ایجاد کامپوننت Creating A Component

  • CardItem CardItem

  • سبد اضافه کنید Add Basket

  • حذف آیتم Remove Item

  • لمس نهایی Final Touch

  • دانلود فایل های پروژه Download The Project Files

المشروع 20: تطبيق حجز منتجع مصنوع من React - React Js، NPM، CSS، Project-20 : A Resort Booking Application made with React-React Js , NPM , CSS ,

  • مقدمة التطبيق. App Intro.

  • CRA CRA

  • التشغيل الأول First Run

  • الملحقات Extensions

  • إنشاء الحالة Creating State

  • إنشاء الحالة 2 Creating State 2

  • إضافة الأساليب Adding Methods

  • تعريف الأساليب Defining Methods

  • إكمال Booking.js Completing Booking.js

  • إنشاء Billing.js Creating Billing.js

  • إنشاء أساليب في Billing Creating Methods in Billing

  • Billing.js الجزء 1 Billing.js Part 1

  • Billing.jsx الجزء 2 Billing.jsx Part 2

  • DateSelector.js DateSelector.js

  • RoomDetails.js RoomDetails.js

  • إضافة ديناميكيات إلى RoomDetails.js Adding Dynamics to RoomDetails.js

  • تنزيل ملفات المشروع Download The Project Files

Project-20: یک برنامه رزرو اقامتگاه ساخته شده با React-React Js، NPM، CSS، Project-20 : A Resort Booking Application made with React-React Js , NPM , CSS ,

  • معرفی برنامه App Intro.

  • CRA CRA

  • اولین اجرا First Run

  • برنامه های افزودنی Extensions

  • ایجاد دولت Creating State

  • ایجاد حالت 2 Creating State 2

  • روش های اضافه کردن Adding Methods

  • تعریف روشها Defining Methods

  • تکمیل Booking.js Completing Booking.js

  • ایجاد Billing.js Creating Billing.js

  • ایجاد روش ها در صورتحساب Creating Methods in Billing

  • Billing.js قسمت 1 Billing.js Part 1

  • Billing.jsx قسمت 2 Billing.jsx Part 2

  • DateSelector.js DateSelector.js

  • RoomDetails.js RoomDetails.js

  • افزودن Dynamics به RoomDetails.js Adding Dynamics to RoomDetails.js

  • دانلود فایل های پروژه Download The Project Files

المشروع 21: حاسبة مؤشر كتلة الجسم مصنوعة من React - React Js، NPM، CSS، Project-21 : A Body Mass Index Calculator made with React-React Js , NPM , CSS ,

  • مقدمة التطبيق App Intro

  • إنشاء تطبيق React. Create React Application.

  • التشغيل الأول First Run

  • الملحقات Extensions

  • استخدام useState Using useState

  • إنشاء الهيكل Creating Structure

  • إنشاء الهيكل الجزء 2 Creating Structure Part 2

  • إنشاء الثوابت Creating Constants

  • إنشاء الأساليب Creating Methods

  • الأساليب الجزء 2 Methods Part 2

  • إنشاء الأساليب الجزء الأخير Creating Methods Final Part

  • الإصلاح النهائي Final Fix

  • تنزيل ملفات المشروع Download The Project Files

Project-21: یک ماشین حساب شاخص توده بدن ساخته شده با React-React Js، NPM، CSS، Project-21 : A Body Mass Index Calculator made with React-React Js , NPM , CSS ,

  • معرفی برنامه App Intro

  • ایجاد React Application Create React Application.

  • اولین اجرا First Run

  • برنامه های افزودنی Extensions

  • استفاده از useState Using useState

  • ایجاد ساختار Creating Structure

  • ایجاد ساختار قسمت 2 Creating Structure Part 2

  • ایجاد ثابت ها Creating Constants

  • روش های ایجاد Creating Methods

  • روش ها قسمت 2 Methods Part 2

  • بخش پایانی روش های ایجاد Creating Methods Final Part

  • رفع نهایی Final Fix

  • دانلود فایل های پروژه Download The Project Files

المشروع 22: متجر أثاث مصنوع من React و Redux - React Js، NPM، CSS، Project-22 : A Furniture Store made with React and Redux-React Js , NPM , CSS ,

  • مقدمة التطبيق App Intro

  • CRA CRA

  • تهيئة التطبيق Configuring Application

  • Index.js Index.js

  • إنشاء App.js Creating App.js

  • إنشاء Reducer. Creating Reducer.

  • منشئو الإجراءات Actions Creators

  • استخدام connect Using connect

  • MapStatetoProps MapStatetoProps

  • إنشاء المكونات الجزء 1 Creating Components Part 1

  • إنشاء المكونات الجزء 2 Creating Components Part 2

  • إنشاء المكون الجزء 3. Creating Component Part 3.

  • توصيل المكونات Connecting Components

  • تنزيل ملفات المشروع Download The Project Files

Project-22: یک فروشگاه مبلمان ساخته شده با React و Redux-React Js، NPM، CSS، Project-22 : A Furniture Store made with React and Redux-React Js , NPM , CSS ,

  • معرفی برنامه App Intro

  • CRA CRA

  • پیکربندی برنامه Configuring Application

  • Index.js Index.js

  • ایجاد App.js Creating App.js

  • ایجاد کاهنده. Creating Reducer.

  • Actions Creators Actions Creators

  • با استفاده از اتصال Using connect

  • MapStatetoProps MapStatetoProps

  • ایجاد کامپوننت ها قسمت 1 Creating Components Part 1

  • ایجاد کامپوننت ها قسمت 2 Creating Components Part 2

  • ایجاد کامپوننت قسمت 3. Creating Component Part 3.

  • اتصال قطعات Connecting Components

  • دانلود فایل های پروژه Download The Project Files

المشروع 23: تطبيق لوحة النتائج مصنوع من ReactJS - React Js، NPM، CSS، S Project-23 : A Scoreboard Application made with ReactJS-React Js , NPM , CSS , S

  • مقدمة التطبيق App Intro

  • CRA CRA

  • الملحقات Extensions

  • إنشاء المكونات Creating Components

  • إنشاء الأساليب Creating Methods

  • إنشاء الأساليب الجزء 2 Creating Methods Part 2

  • إنشاء Player.js Adding Player.js

  • إنشاء Counter.ks Creating Counter.ks

  • إنشاء الإحصائيات Creating Stats

  • إنشاء ساعة الإيقاف Creating StopWatch

  • المكون النهائي Final Component

  • تنزيل ملفات المشروع Download The Project Files

Project-23: یک برنامه Scoreboard ساخته شده با ReactJS-React Js، NPM، CSS، S Project-23 : A Scoreboard Application made with ReactJS-React Js , NPM , CSS , S

  • معرفی برنامه App Intro

  • CRA CRA

  • برنامه های افزودنی Extensions

  • ایجاد کامپوننت ها Creating Components

  • روش های ایجاد Creating Methods

  • روش های ایجاد قسمت 2 Creating Methods Part 2

  • افزودن Player.js Adding Player.js

  • ایجاد Counter.ks Creating Counter.ks

  • ایجاد آمار Creating Stats

  • ایجاد کرونومتر Creating StopWatch

  • جزء نهایی Final Component

  • دانلود فایل های پروژه Download The Project Files

المشروع 24: تطبيق مولد Meta Tag مصنوع من React - React Js، NPM، CSS Project-24 : Meta Tag Generator Application made with React-React Js , NPM , CSS

  • مقدمة التطبيق App Intro

  • CRA CRA

  • الملحقات Extensions

  • إنشاء المكونات Creating Components

  • تهيئة المكونات. Configuring Components.

  • إنشاء الهيكل Creating Structure

  • إنشاء الهيكل الجزء 2 Creating Structure Part 2

  • إنشاء Generator.js Creating Generator.js

  • إنهاء MetaAtgs Finishing MetaAtgs

  • الإصلاح النهائي. Final Fix.

  • تنزيل ملفات المشروع Download The Project Files

Project-24: برنامه تولید کننده متا تگ ساخته شده با React-React Js، NPM، CSS Project-24 : Meta Tag Generator Application made with React-React Js , NPM , CSS

  • معرفی برنامه App Intro

  • CRA CRA

  • برنامه های افزودنی Extensions

  • ایجاد کامپوننت ها Creating Components

  • پیکربندی کامپوننت ها Configuring Components.

  • ایجاد ساختار Creating Structure

  • ایجاد ساختار قسمت 2 Creating Structure Part 2

  • ایجاد Generator.js Creating Generator.js

  • اتمام MetaAtgs Finishing MetaAtgs

  • رفع نهایی. Final Fix.

  • دانلود فایل های پروژه Download The Project Files

المشروع 25: تطبيق طلب طعام - React.Js، Material-UI، React Router Project-25 : Food Ordering Web Application - React.Js, Material-Ui, React Router

  • مقدمة للمشروع Introduction To The Project

  • تثبيت وإعداد المشروع Project Installation And Setu

  • تطبيق Trim لمسار React Applying React Router Trim

  • إنشاء وتصميم شريط التنقل Trim Creating & Styling The Nav Bar Trim

  • إنهاء شريط التنقل Trim. Finishing Up The Nav bar Trim.

  • إنشاء الصفحة الرئيسية والتذييل Trim Creating the Homepage and Footer Trim

  • صفحة القائمة ورسم الخرائط للبيانات Menu Page And Mapping The Data

  • صفحة حول _ الاتصال About _ Contact Page

  • تنزيل ملفات المشروع Download The Project Files

Project-25: برنامه وب سفارش غذا - React.Js، Material-Ui، React Router Project-25 : Food Ordering Web Application - React.Js, Material-Ui, React Router

  • مقدمه ای بر پروژه Introduction To The Project

  • نصب و راه اندازی پروژه Project Installation And Setu

  • استفاده از React Router Trim Applying React Router Trim

  • ایجاد و یک ظاهر طراحی برش نوار Nav Creating & Styling The Nav Bar Trim

  • پایان دادن به برش نوار Nav. Finishing Up The Nav bar Trim.

  • ایجاد صفحه اصلی و برش پاورقی Creating the Homepage and Footer Trim

  • صفحه منو و نقشه برداری از داده ها Menu Page And Mapping The Data

  • درباره _ صفحه تماس About _ Contact Page

  • دانلود فایل های پروژه Download The Project Files

المشروع 26: تطبيق الطقس باستخدام API - React.Js، Open Weather API، CSS Project-26 : Weather Web Application Using Api - React.Js, Open Weather Api, Css

  • مقدمة للمشروع Introduction To The Project

  • توليد مفتاح API Generating the API Key

  • إنشاء مكون البحث Creating the Search Component

  • متابعة مكون البحث Search Component Continuation

  • إنشاء بطاقة الطقس Creating Weather Card

  • تصميم بطاقة الطقس Styling The Weather Card

  • خطاف useEffect The useEffect Hook

  • الوعود، Async، Await Try و Catch Promises, Async, Await Try and Catch

  • تهيئة نقطة نهاية API Configuring the API Endpoint

  • جلب البيانات من API Grabbing The Data From API

  • جلب البيانات إلى واجهة المستخدم Fetching Data To The UI

  • جعل الأيقونات ديناميكية وإنهاء المشروع Making The Icons Dynamic And Finishing Up The Project

  • تنزيل ملفات المشروع Download The Project Files

Project-26: برنامه وب هواشناسی با استفاده از Api - React.Js، Open Weather Api، Css Project-26 : Weather Web Application Using Api - React.Js, Open Weather Api, Css

  • مقدمه ای بر پروژه Introduction To The Project

  • ایجاد کلید API Generating the API Key

  • ایجاد کامپوننت جستجو Creating the Search Component

  • ادامه کامپوننت جستجو Search Component Continuation

  • ایجاد کارت هواشناسی Creating Weather Card

  • یک ظاهر طراحی شده کارت آب و هوا Styling The Weather Card

  • قلاب useEffect The useEffect Hook

  • Promises، Async، Await Try و Catch Promises, Async, Await Try and Catch

  • پیکربندی نقطه پایانی API Configuring the API Endpoint

  • گرفتن داده ها از API Grabbing The Data From API

  • واکشی داده ها در رابط کاربری Fetching Data To The UI

  • پویا کردن نمادها و تکمیل پروژه Making The Icons Dynamic And Finishing Up The Project

  • دانلود فایل های پروژه Download The Project Files

المشروع 27: تطبيق وصفات طعام - React.Js، Edamam API، Firebase للاستضافة Project-27 : Food Recipe Application - React.Js, Edamam Api, Firebase For Hostin

  • مقدمة للمشروع Introduction To The Project

  • توليد معرف API _ مفتاح Generationg API ID _ Key

  • تثبيت مشروع React. React Project Installation.

  • إنشاء الهيكل الأساسي. Creating the Basic Structure.

  • تصميم حقل الإدخال والبحث Styling The Input And Search Field

  • استدعاء API عبر نقطة النهاية Calling the API Through Endpoint

  • تطبيق البحث المخصص Implementing Custom Search

  • قائمة منسدلة الفئات The Category Dropdown

  • رسم الخرائط للبيانات من API Mapping The Data From The API

  • مكون RecipeTile The RecipeTile Component

  • إضافة RegEx لتصفية الصور Adding RegEx To Filter Images

  • استضافة الموقع على Firebase Hosting The Website on Firebase

  • تنزيل ملفات المشروع Download The Project Files

Project-27: برنامه دستور غذا - React.Js، Edamam Api، Firebase For Hostin Project-27 : Food Recipe Application - React.Js, Edamam Api, Firebase For Hostin

  • مقدمه ای بر پروژه Introduction To The Project

  • Generationg API ID _ Key Generationg API ID _ Key

  • نصب پروژه React. React Project Installation.

  • ایجاد ساختار پایه Creating the Basic Structure.

  • شکل دادن به فیلد ورودی و جستجو Styling The Input And Search Field

  • فراخوانی API از طریق نقطه پایانی Calling the API Through Endpoint

  • پیاده سازی جستجوی سفارشی Implementing Custom Search

  • کشویی دسته The Category Dropdown

  • نقشه برداری داده ها از API Mapping The Data From The API

  • جزء RecipeTile The RecipeTile Component

  • اضافه کردن RegEx به فیلتر کردن تصاویر Adding RegEx To Filter Images

  • میزبانی وب سایت در Firebase Hosting The Website on Firebase

  • دانلود فایل های پروژه Download The Project Files

Project-28-اپلیکیشن سبد خرید من – React.Js, React-Hooks, External Api, Css Project-28 : My Cart Application - React.Js, React-Hooks, External Api, Css

  • مقدمه‌ای بر پروژه Introduction To The Poject

  • راه‌اندازی و نصب پروژه Project Setup And Installation

  • استایل‌دهی نویگیشن بار Styling The Navbar

  • ساخت نویگیشن بار ۲ Creating The Navbar 2

  • ساخت Context Creating The Context

  • ساخت سبد خرید (CartContainer) Creating CartContainer

  • ساخت کامپوننت آیتم سبد خرید (CartItem) Creating CartItem Component

  • هوک useReducer The useReducer Hook

  • پیاده‌سازی useReducer Implementing The useReducer

  • پاک کردن سبد خرید Clear Cart

  • افزودن و حذف آیتم‌ها از سبد خرید Adding And Removing Items From Cart

  • ساخت اکشن‌ها در Reducer Creating The Actions In Reducer

  • Dispatch و اکشن‌های نهایی Dispatch And Actions Final

  • دانلود فایل‌های پروژه Download The Project Files

Project-28: برنامه My Cart - React.Js، React-Hoks، External Api، Css Project-28 : My Cart Application - React.Js, React-Hooks, External Api, Css

  • مقدمه ای بر پروژه Introduction To The Poject

  • راه اندازی و نصب پروژه Project Setup And Installation

  • یک ظاهر طراحی شده نوار نوار Styling The Navbar

  • ایجاد نوار ناوبری 2 Creating The Navbar 2

  • ایجاد زمینه Creating The Context

  • ایجاد CartContainer Creating CartContainer

  • ایجاد مؤلفه CartItem Creating CartItem Component

  • UseReducer Hook The useReducer Hook

  • پیاده سازی useReducer Implementing The useReducer

  • پاک کردن سبد خرید Clear Cart

  • افزودن و حذف اقلام از سبد خرید Adding And Removing Items From Cart

  • ایجاد اقدامات در Reducer Creating The Actions In Reducer

  • ارسال و اقدامات نهایی Dispatch And Actions Final

  • دانلود فایل های پروژه Download The Project Files

Project-29-اپلیکیشن منوی کافه – React.Js, React-Hooks , Firebase, Css Project-29 : Cafe Menu Application - React.Js, React-Hooks , Firebase, Css

  • مقدمه‌ای بر پروژه Introduction To The Project

  • راه‌اندازی اولیه پروژه Initialising The Project

  • استایل‌دهی عنوان Styling The Title

  • ساخت کامپوننت دسته‌بندی Creating The Category Component

  • کامپوننت منو The Menu Component

  • استایل‌دهی کامپوننت منو Styling The Menu Component

  • کار روی کامپوننت دسته‌بندی Working On The Category Component

  • ارسال و نگاشت داده به کامپوننت منو Passing And Mapping Data To Menu Component

  • رندر کردن داده‌ها در کامپوننت App Redering The Data In The App Component

  • میزبانی اپلیکیشن روی Firebase Hosting Application On Firebase

  • دانلود فایل‌های پروژه Download The Project Files

Project-29: برنامه منوی کافه - React.Js، React-Hoks، Firebase، Css Project-29 : Cafe Menu Application - React.Js, React-Hooks , Firebase, Css

  • مقدمه ای بر پروژه Introduction To The Project

  • راه اندازی پروژه Initialising The Project

  • سبک دادن به عنوان Styling The Title

  • ایجاد مؤلفه دسته Creating The Category Component

  • جزء منو The Menu Component

  • حالت دادن به مؤلفه منو Styling The Menu Component

  • کار بر روی مؤلفه دسته Working On The Category Component

  • انتقال و نگاشت داده ها به مؤلفه منو Passing And Mapping Data To Menu Component

  • بازخوانی داده ها در مؤلفه برنامه Redering The Data In The App Component

  • برنامه میزبانی در Firebase Hosting Application On Firebase

  • دانلود فایل های پروژه Download The Project Files

Project-30-اپلیکیشن وب کانون کوکتل – React.Js, React-Hooks, External Api, Project-30 : Cocktail Hub Web Application - React.Js, React-Hooks, External Api,

  • مقدمه‌ای بر پروژه Introduction To The Project

  • ساخت نویگیشن بار Creating Navbar

  • لینک کردن کامپوننت‌ها به نویگیشن بار Linking Components To Navbar

  • ساخت Context Creating The Context

  • API که قرار است استفاده کنیم The API We Are Going To Use

  • راه‌اندازی Global Context Setting Up Global Context

  • فچ کردن داده‌ها با Try and Catch Fetching Data From Try And Catch

  • ساخت Global Context Creating Global Context

  • ساخت کامپوننت جستجو Creating Search Component

  • کامپوننت‌های Loader, Cocktails, CocktailList Loader,Cocktails,CocktailList Components

  • کامپوننت SingleCocktail SingleCocktail Component

  • دانلود فایل‌های پروژه Download The Project Files

Project-30: Cocktail Hub Web Application - React.Js، React-Hoks، External Api، Project-30 : Cocktail Hub Web Application - React.Js, React-Hooks, External Api,

  • مقدمه ای بر پروژه Introduction To The Project

  • ایجاد نوار ناوبری Creating Navbar

  • پیوند دادن کامپوننت ها به نوار ناوبری Linking Components To Navbar

  • ایجاد زمینه Creating The Context

  • API که قرار است از آن استفاده کنیم The API We Are Going To Use

  • تنظیم زمینه جهانی Setting Up Global Context

  • واکشی داده ها از Try And Catch Fetching Data From Try And Catch

  • ایجاد زمینه جهانی Creating Global Context

  • ایجاد کامپوننت جستجو Creating Search Component

  • لودر، کوکتل، اجزای لیست کوکتل Loader,Cocktails,CocktailList Components

  • کامپوننت تک کوکتل SingleCocktail Component

  • دانلود فایل های پروژه Download The Project Files

Project-31-اپلیکیشن ارسال بازبینی – React.Js, Material-Ui, Css, Nanoid Project-31 : Review Posting Application - React.Js, Material-Ui, Css, Nanoid

  • مقدمه‌ای بر پروژه Introduction To The Project

  • راه‌اندازی پروژه Setting Up The Project

  • استفاده از Material-UI و نویگیشن بار Using Material-UI and Navbar

  • قابلیت حالت تاریک (Dark Mode) Dark Mode Feature

  • کامپوننت جستجو The Search Component

  • کامپوننت ارسال بازبینی Posting The Review Component

  • افزودن JS به AddNote Adding JS To The AddNote

  • ساخت کامپوننت بازبینی (Note) Creating The Review(Note) Component

  • ساخت لیست بازبینی Creating The Review List

  • پیکربندی App-js Configuring The App-js

  • پایان دادن به پروژه Finishing Up The Project

  • دانلود فایل‌های پروژه Download The Project Files

Project-31: بررسی برنامه ارسال پست - React.Js، Material-Ui، Css، Nanoid Project-31 : Review Posting Application - React.Js, Material-Ui, Css, Nanoid

  • مقدمه ای بر پروژه Introduction To The Project

  • راه اندازی پروژه Setting Up The Project

  • با استفاده از Material-UI و Navbar Using Material-UI and Navbar

  • ویژگی حالت تاریک Dark Mode Feature

  • مؤلفه جستجو The Search Component

  • ارسال مولفه بررسی Posting The Review Component

  • افزودن JS به AddNote Adding JS To The AddNote

  • ایجاد مؤلفه بررسی (یادداشت). Creating The Review(Note) Component

  • ایجاد فهرست بررسی Creating The Review List

  • پیکربندی App-js Configuring The App-js

  • اتمام پروژه Finishing Up The Project

  • دانلود فایل های پروژه Download The Project Files

Project-32-اپلیکیشن پومودورو – React.Js, React Countdown Timer Npm Package, Project-32 : Pomodoro Application - React.Js, React Countdown Timer Npm Package,

  • مقدمه‌ای بر پروژه Introduction To The Project

  • راه‌اندازی پروژه Setting Up The Project

  • ساخت کامپوننت دکمه Creating The Button Component

  • استایل‌دهی دکمه Styling The Button

  • کامپوننت SetPomodoro SetPomodoro Component

  • پیکربندی SetPomodoro Configuring The SetPomodoro

  • کامپوننت انیمیشن شمارش معکوس CountDown Animation Component

  • ساخت GlobalContext Creating The GlobalContext

  • پیکربندی Global Context Configuring The Global Context

  • پیکربندی App-js Configuring The App-js

  • پایان دادن به پروژه با App-Js Finishing Up the Project with App-Js

  • دانلود فایل‌های پروژه Download The Project Files

Project-32: برنامه Pomodoro - React.Js، پکیج React Countdown Timer Npm, Project-32 : Pomodoro Application - React.Js, React Countdown Timer Npm Package,

  • مقدمه ای بر پروژه Introduction To The Project

  • راه اندازی پروژه Setting Up The Project

  • ایجاد کامپوننت دکمه Creating The Button Component

  • یک ظاهر طراحی شده دکمه Styling The Button

  • SetPomodoro Component SetPomodoro Component

  • پیکربندی SetPomodoro Configuring The SetPomodoro

  • مولفه انیمیشن شمارش معکوس CountDown Animation Component

  • ایجاد GlobalContext Creating The GlobalContext

  • پیکربندی زمینه جهانی Configuring The Global Context

  • پیکربندی App-js Configuring The App-js

  • اتمام پروژه با App-Js Finishing Up the Project with App-Js

  • دانلود فایل های پروژه Download The Project Files

Project-33-اپلیکیشن جستجوی گوگل با استفاده از API – React.Js, TailwindCss, Googl Project-33 : Google Search Application Using Api - React.Js, Tailwind Css, Googl

  • مقدمه‌ای بر پروژه Introduction To The Project

  • راه‌اندازی پروژه Setting Up The Project

  • نصب Tailwind و Craco Installing Tailwind And Craco

  • ساخت نویگیشن بار Creating The Navbar

  • ساخت کامپوننت جستجو Creating The Search Component.

  • تکمیل جستجو و ساخت لینک‌ها Completing The Search And Creating Links

  • ساخت کامپوننت‌های Loading و Footer Creating Loading And Footer Component

  • ساخت Global Context Creating The Global Context

  • ساخت ساختار کامپوننت نتایج Creating The Results Component Structure

  • توزیع داده‌ها بر اساس فیلد جستجو Distributing Data According To Search Field.

  • راه‌اندازی Routeها و App-Js Setting Up The Routes And App-Js

  • دانلود فایل‌های پروژه Download The Project Files

Project-33: برنامه جستجوی Google با استفاده از Api - React.Js، Tailwind Css، Googl Project-33 : Google Search Application Using Api - React.Js, Tailwind Css, Googl

  • مقدمه ای بر پروژه Introduction To The Project

  • راه اندازی پروژه Setting Up The Project

  • نصب Tailwind And Craco Installing Tailwind And Craco

  • ایجاد نوار ناوبری Creating The Navbar

  • ایجاد مؤلفه جستجو Creating The Search Component.

  • تکمیل جستجو و ایجاد لینک Completing The Search And Creating Links

  • ایجاد کامپوننت بارگذاری و پاورقی Creating Loading And Footer Component

  • ایجاد زمینه جهانی Creating The Global Context

  • ایجاد ساختار اجزای نتایج Creating The Results Component Structure

  • توزیع داده ها بر اساس فیلد جستجو. Distributing Data According To Search Field.

  • راه اندازی مسیرها و App-Js Setting Up The Routes And App-Js

  • دانلود فایل های پروژه Download The Project Files

Project-34-بازی دوز با React js Project-34 : Tic-Tac-Toe game with React js

  • مقدمه‌ای بر پروژه بازی دوز Introduction to Tic tac Toe game Project

  • راه‌اندازی محیط برای پروژه Environment Setup for the project.

  • شروع با کامپوننت React و درک ساختار پوشه‌ها Getting started with React Component and Understanding Folder Structure

  • مقدمه‌ای بر props در React و ارسال تابع به کامپوننت‌ها Introduction to react props and passing function to componnennts

  • رندر کردن بازیکن ما با استفاده از هوک useState Rendering our player using useState Hooks

  • تغییر نوبت بین بازیکن X و O با استفاده از هوک useEffect Toggle between player_s X and O using useEffect hooks

  • دادن عملکرد به دکمه راه‌اندازی مجدد Giving action to the restart button.

  • ایجاد شرط برای تساوی بازی Making condition for a tie match

  • افزودن افکت صوتی به پروژه ما Adding sound effect to our project.

  • دانلود فایل‌های پروژه Download The Project Files

Project-34: بازی Tic-Tac-Toe با React js Project-34 : Tic-Tac-Toe game with React js

  • معرفی پروژه بازی Tic tac Toe Introduction to Tic tac Toe game Project

  • تنظیم محیط برای پروژه Environment Setup for the project.

  • شروع کار با React Component و درک ساختار پوشه Getting started with React Component and Understanding Folder Structure

  • مقدمه‌ای برای واکنش‌دهنده و انتقال تابع به کامپوننت‌ها Introduction to react props and passing function to componnennts

  • پخش کننده ما با استفاده از useState Hooks Rendering our player using useState Hooks

  • با استفاده از قلاب های useEffect بین player_s X و O جابه جا شوید Toggle between player_s X and O using useEffect hooks

  • دادن عمل به دکمه راه اندازی مجدد. Giving action to the restart button.

  • ایجاد شرایط برای یک مسابقه مساوی Making condition for a tie match

  • افزودن جلوه صوتی به پروژه ما Adding sound effect to our project.

  • دانلود فایل های پروژه Download The Project Files

Project-35-اپلیکیشن شمارشگر کلمات و حروف با استفاده از react js، شامل useState Project-35 : Word and letter counter apllication using react js, including useSt

  • مقدمه‌ای بر شمارشگر کلمات با React js Introduction to Word Counter using React js

  • آنچه خواهیم ساخت What we are going to make

  • شروع با رابط کاربری ما برای شمارشگر کلمات Getting started with our user Interface for word counter

  • تکمیل حروف و کلمات شمارشگر ما Completing our counter letters and words

  • تکمیل با دکمه‌های ما Completing with our buttons

  • دانلود فایل‌های پروژه Download The Project Files

Project-35: برنامه شمارنده کلمه و حروف با استفاده از react js، از جمله useSt Project-35 : Word and letter counter apllication using react js, including useSt

  • مقدمه ای بر Word Counter با استفاده از React js Introduction to Word Counter using React js

  • چیزی که قرار است بسازیم What we are going to make

  • شروع به کار با رابط کاربری ما برای کلمه شمار Getting started with our user Interface for word counter

  • تکمیل حروف و کلمات پیشخوان ما Completing our counter letters and words

  • با دکمه های ما تکمیل می شود Completing with our buttons

  • دانلود فایل های پروژه Download The Project Files

Project-36-مبدل ارز با استفاده از React js Project-36 : Currency converter using React js

  • مقدمه‌ای بر مبدل ارز Introduction to currency converter

  • آنچه خواهیم ساخت What we are going to make

  • شروع با رابط کاربری پروژه ما Get started with our project user Interface

  • نتیجه نهایی ما با API تبدیل Our final result with convert api

  • دانلود فایل‌های پروژه Download The Project Files

Project-36: مبدل ارز با استفاده از React js Project-36 : Currency converter using React js

  • آشنایی با مبدل ارز Introduction to currency converter

  • چیزی که قرار است بسازیم What we are going to make

  • با رابط کاربری پروژه ما شروع کنید Get started with our project user Interface

  • نتیجه نهایی ما با تبدیل api Our final result with convert api

  • دانلود فایل های پروژه Download The Project Files

Project-37-اپلیکیشن تشخیص گفتار، دستیار صوتی با استفاده از react js Project-37 : Speech Recogitio, Voice assistant app using react js

  • مقدمه‌ای بر پروژه Introduction to the project

  • بیایید ببینیم چه چیزی خواهیم ساخت و چگونه کار می‌کند Let_s see what we are going to make and how it work

  • درک منطق تشخیص گفتار و ارسال دستورات Understanding the speech recognition logic and passing commands

  • رندر کردن عناصر HTML در مرورگر و اعمال CSS Rendering HTML elements inside browser and applying CSS

  • دانلود فایل‌های پروژه Download The Project Files

Project-37: Speech Recogitio، برنامه دستیار صوتی با استفاده از react js Project-37 : Speech Recogitio, Voice assistant app using react js

  • معرفی پروژه Introduction to the project

  • بیایید ببینیم قرار است چه چیزی بسازیم و چگونه کار می کند Let_s see what we are going to make and how it work

  • درک منطق تشخیص گفتار و صدور دستورات Understanding the speech recognition logic and passing commands

  • رندر کردن عناصر HTML در مرورگر و اعمال CSS Rendering HTML elements inside browser and applying CSS

  • دانلود فایل های پروژه Download The Project Files

Project-38-چگونه یک ماشین حساب با استفاده از react js، با هوک‌ها بسازیم Project-38 : How to build a Calculator using react js, with hooks

  • مقدمه‌ای بر ارائه ماشین حساب Introduction to calculator presentation

  • شروع با HTML Getting started with the html

  • مدیریت دکمه‌ها با کلیک Handling the buttons with click

  • عملیاتی کردن دکمه حذف ما Making our delete button functional.

  • مدیریت خطا و دکمه مساوی Error Handling and the Equal button

  • دانلود فایل‌های پروژه Download The Project Files

Project-38: نحوه ساخت ماشین حساب با استفاده از react js، با هوک Project-38 : How to build a Calculator using react js, with hooks

  • مقدمه ای بر ارائه ماشین حساب Introduction to calculator presentation

  • شروع کار با html Getting started with the html

  • دست زدن به دکمه ها با کلیک Handling the buttons with click

  • فعال کردن دکمه حذف ما. Making our delete button functional.

  • Error Handling و دکمه Equal Error Handling and the Equal button

  • دانلود فایل های پروژه Download The Project Files

Project-39-ساخت اپلیکیشن بودجه با استفاده از react js، هوک‌ها، هوک‌های سفارشی، react-conte Project-39 : Build a budget app using react js, hooks, custom hooks, react-conte

  • مقدمه‌ای بر اپلیکیشن بودجه با استفاده از react js همراه با ارائه Introduction to the Budget App using react js with presentation

  • شروع با راه‌اندازی اپلیکیشن React ما Getting started with initialization of our react application

  • رندر کردن هدر ما برای اپلیکیشن بودجه Rendering our header for budget app

  • ساخت کامپوننت کارت بودجه Making Budget Card component

  • تکمیل هدر کارت بودجه Completing Budget Card Header

  • تکمیل کامپوننت کارت بودجه Completing Budget Card component

  • تکمیل کامپوننت کارت بودجه Completing Budget Card component.

  • فراخوانی توابع برای عملکرد کارت بودجه Calling the functions for budget card funtionality

  • تکمیل توابع اضافه کردن بودجه و هزینه Completing add Budget and add Expenses function.

  • یادگیری نحوه استفاده از Local Storage Learn how to use Local Storage

  • مدیریت مودال بودجه Handling Budget Modal

  • نگاشت از طریق بودجه‌ها Maping through budgets

  • اضافه کردن مودال هزینه و بخش دسته‌بندی نشده Add expenses modal and Uncategorized section

  • تکمیل اپلیکیشن Completing the application

  • دانلود فایل‌های پروژه Download The Project Files

Project-39: با استفاده از react js، hooks، custom hook، react-conte یک برنامه بودجه بسازید. Project-39 : Build a budget app using react js, hooks, custom hooks, react-conte

  • مقدمه ای بر برنامه بودجه با استفاده از react js با ارائه Introduction to the Budget App using react js with presentation

  • شروع با مقداردهی اولیه برنامه react ما Getting started with initialization of our react application

  • در حال ارائه هدر ما برای برنامه بودجه Rendering our header for budget app

  • ساخت جزء کارت بودجه Making Budget Card component

  • تکمیل سربرگ کارت بودجه Completing Budget Card Header

  • تکمیل جزء کارت بودجه Completing Budget Card component

  • تکمیل جزء کارت بودجه. Completing Budget Card component.

  • فراخوانی توابع برای عملکرد کارت بودجه Calling the functions for budget card funtionality

  • تکمیل عملکرد افزودن بودجه و افزودن هزینه ها. Completing add Budget and add Expenses function.

  • نحوه استفاده از Local Storage را بیاموزید Learn how to use Local Storage

  • مدال رسیدگی به بودجه Handling Budget Modal

  • نقشه برداری از طریق بودجه Maping through budgets

  • اضافه کردن هزینه های معین و دسته بندی نشده Add expenses modal and Uncategorized section

  • تکمیل درخواست Completing the application

  • دانلود فایل های پروژه Download The Project Files

Project-40-پخش کننده موسیقی با استفاده از react js (کلون اسپاتیفای) با استفاده از react js با pro Project-40 : Music Player using react js (Spotify clone) using react js with pro

  • مقدمه‌ای بر اپلیکیشن برنامه زمان‌بندی با استفاده از React JS Introduction to Schedule Application using react JS

  • شروع با پروژه ما Getting startded with ur project

  • نصب Bootstrap از طریق ترمینال Installing Bootstrap using terminal.

  • هدایت به سمت احراز هویت Redirectig to authorization

  • ساخت سرور برای اپلیکیشن ما Creating Server for our application

  • اصلاح سرور Modifying the server

  • مدیریت احراز هویت کاربر Managing the Authentication of user

  • تکمیل مجوز Completing authorisation

  • ساخت کامپوننت آهنگ Making the song component.

  • نتیجه‌گیری پروژه Concluding the project

  • دانلود فایل‌های پروژه Download The Project Files

Project-40: پخش کننده موسیقی با استفاده از react js (Spotify clone) با استفاده از react js with pro Project-40 : Music Player using react js (Spotify clone) using react js with pro

  • مقدمه ای بر برنامه زمانبندی با استفاده از react JS Introduction to Schedule Application using react JS

  • شروع کار با پروژه شما Getting startded with ur project

  • نصب بوت استرپ با استفاده از ترمینال Installing Bootstrap using terminal.

  • تغییر مسیر به مجوز Redirectig to authorization

  • ایجاد سرور برای برنامه ما Creating Server for our application

  • در حال تغییر سرور Modifying the server

  • مدیریت احراز هویت کاربر Managing the Authentication of user

  • تکمیل مجوز Completing authorisation

  • ساخت جزء آهنگ. Making the song component.

  • انعقاد پروژه Concluding the project

  • دانلود فایل های پروژه Download The Project Files

Project-41-اپلیکیشن تقویم با قابلیت زمان‌بندی رویدادها Project-41 : Calender Application with scheduling events functionality

  • مقدمه‌ای بر پروژه اپلیکیشن تقویم ما با استفاده از React Js . Introduction to our project Callender App using React Js

  • شروع با راه‌اندازی پروژه Getting Started With Project Initialization.

  • بیایید اپلیکیشن را کاربردی‌تر کنیم Lets Make the application more handy.

  • افزودن فیلدهای اضافی و محدود کردن کاربر Binding more additional fields and restricting user.

  • سفارشی‌سازی نمایش‌ها Customizing Views

  • بیایید اکنون یک نمای CSS مناسب بسازیم Let_s make a proper css view now

  • یادگیری در مورد کامپوننت‌های جدید Learining about some new components

  • راه‌اندازی ماژول‌های نیمه دوم Initializing second half modules.

  • مدیریت رویداد برای تقویم Handling Event for the calender

  • نتیجه‌گیری اپلیکیشن ما Concluding our application.

  • دانلود فایل‌های پروژه Download The Project Files

Project-41: برنامه تقویم با قابلیت برنامه ریزی رویدادها Project-41 : Calender Application with scheduling events functionality

  • . معرفی پروژه Calnder App با استفاده از React Js . Introduction to our project Callender App using React Js

  • شروع با راه اندازی پروژه Getting Started With Project Initialization.

  • اجازه می دهد تا برنامه کاربردی تر. Lets Make the application more handy.

  • اتصال فیلدهای اضافی بیشتر و محدود کردن کاربر. Binding more additional fields and restricting user.

  • سفارشی کردن نماها Customizing Views

  • حالا بیایید یک نمای css مناسب ایجاد کنیم Let_s make a proper css view now

  • یادگیری در مورد برخی از اجزای جدید Learining about some new components

  • راه اندازی ماژول های نیمه دوم Initializing second half modules.

  • مدیریت رویداد برای تقویم Handling Event for the calender

  • در حال پایان دادن به درخواست ما Concluding our application.

  • دانلود فایل های پروژه Download The Project Files

Project-42-اپلیکیشن دیکشنری با استفاده از react js Project-42 : Dictionary App using react js

  • مقدمه‌ای بر اپلیکیشن دیکشنری با استفاده از React Js Introduction to Dictionary App Using React Js.

  • شروع با راه‌اندازی پروژه ما Getting started with our project Initialization

  • یادگیری در مورد هوک‌ها در React Learn about hooks in react

  • پایان کار با CSS در کامپوننت Finishing with css in component.

  • کار با کامپوننت‌های تابعی و UI Working with functional components and UI

  • رندر کردن کامپوننت تعریف Rendering Definition component

  • استایل‌دهی کامپوننت تعریف Styling Definition Component

  • تکمیل کامپوننت تعریف Completing Definition Component

  • دانلود فایل‌های پروژه Download The Project Files

Project-42: برنامه دیکشنری با استفاده از react js Project-42 : Dictionary App using react js

  • مقدمه ای بر برنامه دیکشنری با استفاده از React Js. Introduction to Dictionary App Using React Js.

  • شروع با راه‌اندازی پروژه ما Getting started with our project Initialization

  • با هوک ها در react آشنا شوید Learn about hooks in react

  • اتمام با css در کامپوننت. Finishing with css in component.

  • کار با اجزای کاربردی و UI Working with functional components and UI

  • مولفه تعریف رندر Rendering Definition component

  • مولفه تعریف استایل Styling Definition Component

  • تکمیل مولفه تعریف Completing Definition Component

  • دانلود فایل های پروژه Download The Project Files

Project-43-کلون یوتیوب با استفاده از react js Project-43 : Youtube Clone using react js

  • مقدمه‌ای بر کلون یوتیوب Introduction to Youtube Clone

  • شروع با پروژه ما Getting started with our project

  • راه‌اندازی fetch و یادگیری API Initializing fetch and learning Api

  • تنظیم state برای استفاده از هوک‌ها Setting sate for using hooks

  • فچ کردن داده‌های API برای لاگ و رندر Fetching api data to log and render

  • مرتب کردن کامپوننت‌های ویدیو Arranging Video Components.

  • نتیجه‌گیری با پروژه ما Concluding with our project.

  • دانلود فایل‌های پروژه Download The Project Files

Project-43: Youtube Clone با استفاده از react js Project-43 : Youtube Clone using react js

  • مقدمه ای بر Youtube Clone Introduction to Youtube Clone

  • شروع کار با پروژه ما Getting started with our project

  • راه اندازی واکشی و یادگیری Api Initializing fetch and learning Api

  • تنظیم sate برای استفاده از قلاب Setting sate for using hooks

  • واکشی داده‌های api برای ورود به سیستم و ارائه Fetching api data to log and render

  • تنظیم اجزای ویدیو. Arranging Video Components.

  • نتیجه گیری با پروژه ما Concluding with our project.

  • دانلود فایل های پروژه Download The Project Files

Project-44-بازی Candy Crush با استفاده از react JS Project-44 : Candy Crush game using react JS

  • مقدمه‌ای بر اپلیکیشن Candy Crush با استفاده از react js Introduction to Candy Crush app using react js

  • شروع با راه‌اندازی پروژه ما Getting started with our project initialization

  • راه‌اندازی آرایه رنگ‌ها در پروژه ما Initializing array of colors in our project.

  • مرتب کردن آرایه با رنگ‌ها و تصاویر Arranging array with colors and images

  • دریافت رویداد drag and drop Getting the drag and drop event.

  • قرار دادن تصاویر به جای رنگ‌ها Putting Images instead of colors

  • نتیجه‌گیری بازی Concluding with the game

  • دانلود فایل‌های پروژه Download The Project Files

Project-44: بازی Candy Crush با استفاده از react JS Project-44 : Candy Crush game using react JS

  • معرفی برنامه Candy Crush با استفاده از react js Introduction to Candy Crush app using react js

  • شروع کار با مقداردهی اولیه پروژه Getting started with our project initialization

  • راه اندازی آرایه رنگ ها در پروژه ما. Initializing array of colors in our project.

  • چیدمان آرایه با رنگ ها و تصاویر Arranging array with colors and images

  • دریافت رویداد کشیدن و رها کردن. Getting the drag and drop event.

  • قرار دادن تصاویر به جای رنگ Putting Images instead of colors

  • نتیجه گیری با بازی Concluding with the game

  • دانلود فایل های پروژه Download The Project Files

Project-45-محتوای نجومی روز با استفاده از React.Js CSS , react hooks, APOD A Project-45 : Astronomy stuff of the day Using React.Js CSS , react hooks, APOD A

  • مقدمه‌ای بر پروژه The introduction to the project

  • راه‌اندازی پروژه React و محیط آن Setting up the react project and environment.

  • راه‌اندازی کامپوننت‌ها Setting up the components

  • مقدمه‌ای بر هوک‌ها و هوک useState introduction to Hooks and useState hook

  • شروع با axios، جاوا اسکریپت ناهمزمان Getting started with the axios , asynchronous Javscript

  • ادامه Continue

  • طراحی کل اپلیکیشن بخش اول The designing of the whole application Part-1.

  • طراحی کل اپلیکیشن بخش دوم The designing of the whole application Part-2

  • دانلود فایل‌های پروژه Download The Project Files

Project-45: چیزهای روز نجوم با استفاده از React.Js CSS، React Hooks، APOD A Project-45 : Astronomy stuff of the day Using React.Js CSS , react hooks, APOD A

  • مقدمه پروژه The introduction to the project

  • راه اندازی پروژه و محیط react. Setting up the react project and environment.

  • راه اندازی قطعات Setting up the components

  • مقدمه ای بر Hooks و useState hook introduction to Hooks and useState hook

  • شروع به کار با axios، جاواسکریپت ناهمزمان Getting started with the axios , asynchronous Javscript

  • ادامه هید Continue

  • طراحی کل برنامه قسمت 1. The designing of the whole application Part-1.

  • طراحی کل برنامه قسمت 2 The designing of the whole application Part-2

  • دانلود فایل های پروژه Download The Project Files

Project-46-سنگ کاغذ قیچی با استفاده از React.js , CSS, React hooks Project-46 : Rock paper Scissors using React.js , CSS, React hooks

  • مقدمه‌ای بر پروژه introduction to the project

  • شروع با پروژه و ایجاد محیط توسعه Getting started with the project and creating the development enviornment

  • راه‌اندازی سه کامپوننت اصلی برای پروژه Setting up the three main components for the project

  • ساخت بخش اصلی بدنه بخش اول creation of the main body part-1

  • راه‌اندازی عملکرد با استفاده از useState() و ساخت بدنه اصلی setting up the functionality using useState() andcreation of the main body

  • کار با عملکرد با استفاده از useEffect() و ساخت بدنه اصلی working with the functionality using useEffect() and creation of the main bo

  • عملکرد کامل پروژه Complete functionality of the project

  • طراحی کل اپلیکیشن بخش اول Designing the whole application part-1

  • طراحی کل اپلیکیشن بخش دوم Designing the whole application part-2

  • طراحی کل اپلیکیشن بخش سوم Designing the whole application part-3

  • دانلود فایل‌های پروژه Download The Project Files

Project-46: قیچی کاغذ سنگی با استفاده از React.js، CSS، قلاب React Project-46 : Rock paper Scissors using React.js , CSS, React hooks

  • معرفی پروژه introduction to the project

  • شروع پروژه و ایجاد محیط توسعه Getting started with the project and creating the development enviornment

  • تنظیم سه جزء اصلی برای پروژه Setting up the three main components for the project

  • ایجاد قسمت اصلی بدن-1 creation of the main body part-1

  • تنظیم عملکرد با استفاده از useState() و ایجاد بدنه اصلی setting up the functionality using useState() andcreation of the main body

  • کار با عملکرد با استفاده از useEffect() و ایجاد bo main working with the functionality using useEffect() and creation of the main bo

  • عملکرد کامل پروژه Complete functionality of the project

  • طراحی کل برنامه قسمت 1 Designing the whole application part-1

  • طراحی کل برنامه قسمت 2 Designing the whole application part-2

  • طراحی کل اپلیکیشن قسمت 3 Designing the whole application part-3

  • دانلود فایل های پروژه Download The Project Files

Project-47-اپلیکیشن اعلان بلادرنگ با استفاده از React.Js , CSS, React hooks , Socke Project-47 : Realtime Notification app Using React.Js , CSS, React hooks , Socke

  • شروع با پروژه و راه‌اندازی محیط توسعه Getting started with the project and setting the development enviornment

  • طراحی کامپوننت‌ها بخش اول Designing the components part-1

  • طراحی کامپوننت‌ها بخش دوم و راه‌اندازی هوک useState Designing of the components part-2 and setting up useState Hook

  • طراحی کامپوننت‌ها بخش سوم Designing of the components part-3

  • طراحی کامپوننت نویگیشن بار Designing of the Navbar component

  • نوشتن عملکرد کامپوننت‌ها با استفاده از داده‌های JSON Writing the functionality of the components using the json data

  • نوشتن عملکرد و طراحی تمام کامپوننت‌ها Writing the functionality and Dasigning of all the components

  • مقدمه و اتصال با socket.io Introduction and connection with socket.io

  • عملکرد socket.io بخش اول Functionality of socket.io part-1

  • عملکرد socket.io بخش دوم Functionality of socket.io part-2

  • عملکرد socket.io بخش سوم Functionality of socket.io part-3

  • نوشتن عملکرد نمایش اعلان‌ها Writing the functionality of displaying the notifications.

  • تکمیل پروژه Completion project

  • نوشتن عملکرد نمایش اعلان‌ها Writing the functionality of displaying the notifications

  • دانلود فایل‌های پروژه Download The Project Files

Project-47: برنامه اعلان بلادرنگ با استفاده از React.Js، CSS، React hooks، Socke Project-47 : Realtime Notification app Using React.Js , CSS, React hooks , Socke

  • شروع پروژه و تنظیم محیط توسعه Getting started with the project and setting the development enviornment

  • طراحی اجزای قسمت 1 Designing the components part-1

  • طراحی اجزای قسمت 2 و راه اندازی useState Hook Designing of the components part-2 and setting up useState Hook

  • طراحی قطعات قسمت 3 Designing of the components part-3

  • طراحی کامپوننت Navbar Designing of the Navbar component

  • نوشتن عملکرد کامپوننت ها با استفاده از داده های json Writing the functionality of the components using the json data

  • نوشتن عملکرد و طراحی تمام اجزا Writing the functionality and Dasigning of all the components

  • معرفی و ارتباط با socket.io Introduction and connection with socket.io

  • عملکرد socket.io part-1 Functionality of socket.io part-1

  • عملکرد socket.io part-2 Functionality of socket.io part-2

  • عملکرد socket.io part-3 Functionality of socket.io part-3

  • نوشتن عملکرد نمایش اعلان ها. Writing the functionality of displaying the notifications.

  • پروژه تکمیل Completion project

  • نوشتن عملکرد نمایش اعلان ها Writing the functionality of displaying the notifications

  • دانلود فایل های پروژه Download The Project Files

Project-48-اپلیکیشن ردیاب کووید-۱۹ با استفاده از React.Js , CSS , React hooks Project-48 : Covid-19 tracker Application Using React.Js , CSS , React hooks

  • مقدمه‌ای بر پروژه Introduction to the project.

  • راه‌اندازی محیط توسعه و کامپوننت‌ها Setting tup the development enviornment and components

  • Extraction of the data from the API and useEffect() Hook

  • استفاده از داده‌های API با کمک هوک useState() Using the data from the API with the help of useState() Hook

  • ساخت JSX برای صفحه اصلی و طراحی بخش اول Creating the JSX for the main page and designing part-1

  • طراحی پروژه بخش دوم Designing of the project part-2

  • تکمیل پروژه Completion of the project

  • دانلود فایل‌های پروژه Download The Project Files

Project-48: برنامه ردیاب Covid-19 با استفاده از React.Js، CSS، React hooks Project-48 : Covid-19 tracker Application Using React.Js , CSS , React hooks

  • معرفی پروژه. Introduction to the project.

  • تنظیم محیط توسعه و اجزای آن Setting tup the development enviornment and components

  • استخراج داده ها از API و useEffect() Hook Extraction of the data from the API and useEffect() Hook

  • استفاده از داده های API با کمک useState() Hook Using the data from the API with the help of useState() Hook

  • ایجاد JSX برای صفحه اصلی و طراحی قسمت 1 Creating the JSX for the main page and designing part-1

  • طراحی قسمت 2 پروژه Designing of the project part-2

  • تکمیل پروژه Completion of the project

  • دانلود فایل های پروژه Download The Project Files

Project-49-اپلیکیشن تولیدکننده گیف تصادفی با استفاده از React.Js , React Hooks , CSS , API , Project-49 : Random gif generator app using React.Js , React Hooks , CSS , API ,

  • مقدمه‌ای بر پروژه Introduction to the project

  • راه‌اندازی محیط توسعه و ایجاد اپلیکیشن React Setting up the development environment and creating the React app

  • فچ کردن داده‌ها از API و استفاده از هوک useEffect Fetching the data from the API and using useEffect hook

  • تنظیم گیف با داده‌های JSON API برای کامپوننت تصادفی Setting up the GIF by the JSON data of the API for the random component

  • ساخت کامپوننت Tag برای نوع خاصی از گیف بر اساس درخواست کاربر Creating the Tag component for a specific type of GIF based on the users que

  • ساخت و کار با هوک سفارشی useGif Creation and working with the custom hook useGif

  • عملکرد کامل پروژه با استفاده از هوک سفارشی useGif Complete functionality of the project by using useGif custom hook

  • طراحی کل اپلیکیشن بخش اول Designing the whole application part-1

  • طراحی کل اپلیکیشن بخش دوم Designing the whole application part-2

  • دانلود فایل‌های پروژه Download The Project Files

Project-49: برنامه تولید کننده گیف تصادفی با استفاده از React.Js، React Hooks، CSS، API، Project-49 : Random gif generator app using React.Js , React Hooks , CSS , API ,

  • معرفی پروژه Introduction to the project

  • راه اندازی محیط توسعه و ایجاد اپلیکیشن React Setting up the development environment and creating the React app

  • واکشی داده ها از API و استفاده از قلاب useEffect Fetching the data from the API and using useEffect hook

  • تنظیم GIF توسط داده های JSON API برای جزء تصادفی Setting up the GIF by the JSON data of the API for the random component

  • ایجاد کامپوننت Tag برای نوع خاصی از GIF بر اساس درخواست کاربران Creating the Tag component for a specific type of GIF based on the users que

  • ایجاد و کار با قلاب سفارشی useGif Creation and working with the custom hook useGif

  • عملکرد کامل پروژه با استفاده از قلاب سفارشی useGif Complete functionality of the project by using useGif custom hook

  • طراحی کل برنامه قسمت 1 Designing the whole application part-1

  • طراحی کل برنامه قسمت 2 Designing the whole application part-2

  • دانلود فایل های پروژه Download The Project Files

Project-50-اپلیکیشن ردیاب آتش‌سوزی جنگل با استفاده از React.js, CSS, asynchronous js, NASA ope Project-50 : Wildfire tracker App USing React.js, CSS, asynchronous js, NASA ope

  • مقدمه‌ای بر پروژه Introduction to the project

  • راه‌اندازی محیط توسعه و ایجاد اپلیکیشن React Setting up the development environment and creating the react app

  • ادغام Google Maps API و تنظیم آیکون‌ها Integrating the Google maps API and setting the icons

  • فچ کردن داده‌ها از API و استفاده از آیکون‌ها برای Google Map Fetching the data from the API and using the icons for the google map

  • استفاده از داده‌های JSON از API و استفاده از آن در Google Map Using the JSON data from the API and using it in the google map

  • ساخت جعبه اطلاعات برای اطلاعات اضافی مربوط به هر آتش‌سوزی Creating the info box for additional info regarding every wildfire

  • تکمیل پروژه Completion of the project.

  • دانلود فایل‌های پروژه Download The Project Files

Project-50: برنامه ردیاب Wildfire با استفاده از React.js، CSS، js ناهمزمان، NASA ope Project-50 : Wildfire tracker App USing React.js, CSS, asynchronous js, NASA ope

  • معرفی پروژه Introduction to the project

  • راه اندازی محیط توسعه و ایجاد اپلیکیشن react Setting up the development environment and creating the react app

  • یکپارچه سازی API نقشه های گوگل و تنظیم آیکون ها Integrating the Google maps API and setting the icons

  • واکشی داده ها از API و استفاده از نمادهای نقشه گوگل Fetching the data from the API and using the icons for the google map

  • استفاده از داده های JSON از API و استفاده از آن در نقشه گوگل Using the JSON data from the API and using it in the google map

  • ایجاد جعبه اطلاعات برای اطلاعات بیشتر در مورد هر آتش سوزی Creating the info box for additional info regarding every wildfire

  • تکمیل پروژه. Completion of the project.

  • دانلود فایل های پروژه Download The Project Files

نمایش نظرات

آموزش دوره مگا ری‌اکت: ساخت ۵۰ پروژه واقعی در ۵۰ روز
جزییات دوره
74 hours
600
Udemy (یودمی) Udemy (یودمی)
(آخرین آپدیت)
8,127
4 از 5
دارد
دارد
دارد
Sufa Digital
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Sufa Digital Sufa Digital

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