آموزش توسعه‌دهنده کامل وب ری‌اکت جی‌اس با ES6 - ساخت ۱۰ پروژه - آخرین آپدیت

دانلود Complete React JS web developer with ES6 - Build 10 projects

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

دوره‌ی جامع React JS: از مبانی تا ساخت ۱۰ پروژه کاربردی

با یادگیری React JS، ES6، Firebase و Auth0، مهارت‌های خود را ارتقا دهید و برای بازار کار آماده شوید.

آنچه در این دوره خواهید آموخت:

  • آشنایی کامل با مبانی React JS
  • تسلط بر کامپوننت‌ها (Components)، پراپس (Props) و استیت (States)
  • درک عمیق چرخه حیات کامپوننت‌ها (Component Life Cycle Methods)
  • ساخت اپلیکیشن‌های وب با استفاده از Firebase برای ورود و پایگاه داده
  • پیاده‌سازی قابلیت ورود با حساب گوگل
  • ایجاد اپلیکیشن‌های وب با سیستم ورود Auth0
  • کار با Web API ها مانند Reddit و Github
  • ساخت ۱۰ پروژه منحصر به فرد React JS برای رزومه قوی
  • یادگیری مدرن جاوااسکریپت (ES6)

پروژه‌های دوره React JS:

پس از یادگیری مبانی، ۱۰ پروژه کاربردی برای تسلط کامل بر React JS خواهیم ساخت:

  1. ساخت دستی پروژه React (Create React App Manually)
  2. تبدیل یک وبلاگ ساده به کامپوننت‌های React
  3. اپلیکیشن تایمر (Timer App)
  4. سبد خرید در یک برنامه تک صفحه‌ای (Sales Cart in SPA)
  5. ساخت نظرسنجی با پایگاه داده Firebase
  6. تنظیم ورود با Firebase (Firebase Login Setup)
  7. ورود با گوگل با Firebase (Google Sign in with Firebase)
  8. کار با Reddit API با Axios
  9. سیستم ورود با Auth0 (Auth0 Login System)
  10. ساخت اپلیکیشن با Github API و سیستم ورود Auth0

پیش‌نیازهای دوره React JS:

  • آشنایی با مبانی HTML
  • آشنایی با مبانی CSS
  • مفاهیم اولیه جاوااسکریپت (مانند ساخت توابع و حلقه‌ها)

نکته مهم: یادگیری ES6 برای این دوره الزامی نیست و به طور کامل در طول دوره آموزش داده می‌شود.

مخاطبان ایده‌آل این دوره:

این دوره برای افرادی که دانش اولیه کمی در زمینه HTML، CSS و جاوااسکریپت دارند، ایده‌آل است. اگر با مفاهیمی مانند حلقه‌ها و توابع آشنا هستید، می‌توانید به راحتی از این دوره بهره‌مند شوید. تسلط بر ES6 یک مزیت محسوب می‌شود، اما اگر آشنایی ندارید، نگران نباشید؛ زیرا ES6 نیز در این دوره پوشش داده می‌شود.

چرا React JS؟

React JS امروزه تقاضای بسیار بالایی در بازار کار دارد و یکی از پرجستجوترین موضوعات در Stack Overflow است. بسیاری از اپلیکیشن‌های با عملکرد بالا با استفاده از React ساخته می‌شوند. برای برجسته شدن در بازار کار، آشنایی با React JS ضروری است.

علاوه بر این، اگر قصد ورود به دنیای توسعه اپلیکیشن‌های موبایل با React Native را دارید، این دوره مسیر شما را هموار می‌سازد. مفاهیمی مانند JSX، Props و States در React Native نیز کاربرد دارند و یادگیری آن‌ها، مهاجرت به React Native را آسان‌تر می‌کند.

برای تصمیم‌گیری بهتر، پیشنهاد می‌کنیم پیش‌نمایش رایگان دوره و پروژه‌های ذکر شده را مشاهده کنید.

شما را در دوره خواهیم دید!

آپدیت: ویدئوهای مربوط به نسخه 4 کتابخانه React Router نیز به دوره اضافه شده است.


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

معرفی Reactjs Reactjs Introduction

  • اولین Hello World مجازی ما در reactjs Our first virtual Hello World in reactjs

معرفی Reactjs Reactjs Introduction

  • مقدمه‌ای بر دوره Introduction to the course

  • معرفی دوره Introduction to the course

  • ذهنیت یادگیری Reactjs Mindset to learn reactjs

  • طرز فکر یادگیری reactjs Mindset to learn reactjs

  • اولین دنیای مجازی سلام ما در Reactjs Our first virtual Hello World in reactjs

  • تنظیم Reactjs در محیط محلی Setting Reactjs in local environment

  • تنظیم Reactjs در محیط محلی Setting Reactjs in local environment

یادگیری درست اصول Reactjs Getting the basics of Reactjs right

  • آنچه در بخش 2 انجام خواهیم داد - مقدمه What we will do in section 2 - Intro

  • آشنایی با برنامه reactjs Understanding reactjs App

  • وارد کردن کامپوننت ها از فایل های دیگر Importing components from other files

  • DOM مجازی در reactjs Virtual DOM in reactjs

دریافت اصول اولیه Reactjs Getting the basics of Reactjs right

  • آنچه در بخش ۲ انجام خواهیم داد - مقدمه What we will do in section 2 - Intro

  • مخزن گیت‌هاب برای دوره React اینجاست Github repo for React course is here

  • مخزن Github برای دوره React اینجا است Github repo for React course is here

  • تمام کدها و فایل‌های تمرین دوره را از اینجا دریافت کنید Get all course codes and exercise files here

  • تمام کدهای دوره و فایل های تمرین را از اینجا دریافت کنید Get all course codes and exercise files here

  • درک برنامه Reactjs Understanding reactjs App

  • ایجاد اولین کامپوننت React ما Creating our first react component

  • ایجاد اولین کامپوننت واکنش ما Creating our first react component

  • وارد کردن کامپوننت‌ها از فایل‌های دیگر Importing components from other files

  • فراخوانی توابع در کامپوننت ها Calling functions in components

  • فراخوانی توابع در کامپوننت‌ها Calling functions in components

  • Virtual DOM در Reactjs Virtual DOM in reactjs

Props، state و چرخه عمر کامپوننت در Reactjs Props, state and component life cycle in reactjs

  • آنچه در بخش 3 انجام خواهیم داد - مقدمه What we will do in section 3 - Intro

  • Props در reactjs Props in reactjs

  • چرخه عمر اجزاء قسمت 2 Components life cycle part 2

  • پروژه 1 - برنامه react را به صورت دستی ایجاد کنید و آن را درک کنید Project 1 - Create react app manually and understanding it

Props، حالت و چرخه زندگی اجزا در reactjs Props, state and component life cycle in reactjs

  • آنچه در بخش ۳ انجام خواهیم داد - مقدمه What we will do in section 3 - Intro

  • Props در reactjs Props in reactjs

  • انواع props در Reactjs props types in react js

  • انواع props در react js props types in react js

  • States در Reactjs States in react js

  • حالت ها در react js States in react js

  • چرخه عمر کامپوننت‌ها - بخش ۱ Components life cycle part 1

  • چرخه عمر اجزاء قسمت 1 Components life cycle part 1

  • چرخه عمر کامپوننت‌ها - بخش ۲ Components life cycle part 2

  • پروژه ۱ - ایجاد برنامه React به صورت دستی و درک آن Project 1 - Create react app manually and understanding it

۳ پروژه و روترها در Reactjs 3 Projects and routers in react JS

  • آنچه در بخش 4 انجام خواهیم داد - مقدمه What we will do in section 4 - Intro

  • اولین برنامه وبلاگ - ساختار تنظیم First Blog App - setting structure

  • اولین برنامه وبلاگ - تجزیه اجزا First blog App - breaking down components

  • برنامه تایمر قسمت 1 در react js Timer App part 1 in react js

  • برنامه تایمر قسمت 2 در reactjs Timer App part 2 in reactjs

  • برنامه فروش دوره - قسمت 2 - دریافت دوره ها Course sales App - part 2 - getting courses

  • برنامه فروش دوره - قسمت سوم - منطق انتخاب رشته Course sales App - part 3 - logic for selecting courses

  • به روز رسانی - روتر React 4.x.x از آن عبور می کند UPDATE - React router 4.x.x walk through

  • ایجاد اولین مسیر و لینک Creating first route and link

  • مسیر در داخل یک مسیر Route inside a route

3 پروژه ها و روترها در react JS 3 Projects and routers in react JS

  • آنچه در بخش ۴ انجام خواهیم داد - مقدمه What we will do in section 4 - Intro

  • برنامه اول بلاگ - تنظیم ساختار First Blog App - setting structure

  • برنامه اول بلاگ - تجزیه کامپوننت‌ها First blog App - breaking down components

  • برنامه تایمر - بخش ۱ در Reactjs Timer App part 1 in react js

  • برنامه تایمر - بخش ۲ در Reactjs Timer App part 2 in reactjs

  • برنامه فروش دوره - بخش ۱ - تنظیمات Course sales app - part 1 - setup

  • برنامه فروش دوره - قسمت 1 - راه اندازی Course sales app - part 1 - setup

  • برنامه فروش دوره - بخش ۲ - دریافت دوره‌ها Course sales App - part 2 - getting courses

  • برنامه فروش دوره - بخش ۳ - منطق انتخاب دوره‌ها Course sales App - part 3 - logic for selecting courses

  • به‌روزرسانی - مرور React router 4.x.x UPDATE - React router 4.x.x walk through

  • بیایس روتر React React router baiscs

  • اصول React router React router baiscs

  • ایجاد اولین مسیر و لینک Creating first route and link

  • مسیر درون یک مسیر Route inside a route

۳ پروژه - Firebase با Reactjs 3 projects - Firebase with React js

  • آنچه در بخش 5 انجام خواهیم داد - مقدمه What we will do in section 5 - Intro

  • برنامه Usurvey - راه اندازی firebase Usurvey App -setting up firebase

  • تنظیم فرم ورودی برای پرسیدن نام Setting input form to ask name

  • نمایش سوالات برای دانش آموزان displaying questions for students

  • رسیدگی به سوالات با دولت handling questions with state

  • ذخیره کردن همه چیز در firebase و اتمام آن saving everything to firebase and finish it

  • برنامه ورود به سیستم Firebase - تنظیم ساختار برنامه Firebase Login App - Setting app structure

  • برنامه ورود Firebase - تنظیم تماس های ورود به سیستم Firebase Login App - Setting up login calls

  • برنامه ورود Firebase - راه اندازی تماس های ثبت نام Firebase Login App - Setting up signup calls

  • برنامه ورود Firebase - کاربر را از سیستم خارج کنید Firebase Login App - logout the user

  • ورود به سیستم Google - با پنجره بازشو وارد شوید Google Sign In - sign in with popup

3 پروژه - Firebase با React js 3 projects - Firebase with React js

  • آنچه در بخش ۵ انجام خواهیم داد - مقدمه What we will do in section 5 - Intro

  • برنامه Usurvey - تنظیم فایربیس Usurvey App -setting up firebase

  • تنظیم فرم ورودی برای پرسیدن نام Setting input form to ask name

  • تنظیم if else شرط setting if else condition

  • تنظیم شرط if else setting if else condition

  • نمایش سوالات برای دانشجویان displaying questions for students

  • مدیریت سوالات با state handling questions with state

  • ذخیره همه چیز در فایربیس و اتمام آن saving everything to firebase and finish it

  • برنامه لاگین فایربیس - تنظیم ساختار برنامه Firebase Login App - Setting app structure

  • برنامه لاگین فایربیس - تنظیم فراخوانی‌های لاگین Firebase Login App - Setting up login calls

  • برنامه لاگین فایربیس - تنظیم فراخوانی‌های ثبت‌نام Firebase Login App - Setting up signup calls

  • برنامه لاگین فایربیس - خروج کاربر Firebase Login App - logout the user

  • ورود به سیستم Google - دکمه تنظیم Google Sign In - setting up button

  • ورود گوگل - تنظیم دکمه Google Sign In - setting up button

  • ورود گوگل - ورود با پاپ‌آپ Google Sign In - sign in with popup

۳ پروژه با Auth0، Reddit API و Github API 3 projects with Auth0, Reddit API and github API

  • جستجوگر Github - نمایش پنجره های ورود و ثبت نام Github Searcher - showing login and signup popups

  • انتقال اجزا به سربرگ برای خروج passing components to header for logout

  • خروج از سیستم اعمال شد و حافظه محلی پاک شد logout applied and clearing local storage

  • مدیریت جستجو از github Handling search from github

  • نمایش مشخصات کاربران showing profiles of users

3 پروژه با Auth0، Reddit API و github API 3 projects with Auth0, Reddit API and github API

  • آنچه در بخش ۶ انجام خواهیم داد - مقدمه What we will do in section 6- Intro

  • آنچه در بخش 6- مقدمه انجام خواهیم داد What we will do in section 6- Intro

  • اصول API - راه اندازی پروژه API basics - setting up project

  • اصول API - تنظیم پروژه API basics - setting up project

  • اصول API - دریافت اعتبار فرعی از JSON API basics - getting subredit from JSON

  • اصول API - دریافت ساب‌ردیت از JSON API basics - getting subredit from JSON

  • جستجوگر گیت‌هاب - تنظیم هدرها Github searcher - setting headers

  • جستجوگر Github - تنظیم هدرها Github searcher - setting headers

  • جستجوگر گیت‌هاب - نمایش پاپ‌آپ‌های ورود و ثبت‌نام Github Searcher - showing login and signup popups

  • تنظیم توکن و پروفایل کاربر setting user token and profile

  • تنظیم نشانه و نمایه کاربر setting user token and profile

  • ارسال کامپوننت‌ها به هدر برای خروج passing components to header for logout

  • خروج اعمال شد و پاک‌سازی حافظه محلی logout applied and clearing local storage

  • واکشی Github API با Fetch fetching Github API with Fetch

  • دریافت Github API با Fetch fetching Github API with Fetch

  • مدیریت جستجو از گیت‌هاب Handling search from github

  • نمایش پروفایل کاربران showing profiles of users

  • تنظیم محیط برای ES6 Setting Environment for ES6

  • تنظیم محیط برای ES6 Setting Environment for ES6

اختیاری - بوت‌کمپ ES6 OPTIONAL - ES6 Bootcamp

  • کلمه کلیدی Let and const را با احتیاط انجام دهید Let and const keyword with caution

  • عملکردهای فلش در ES6 arrow functions in ES6

  • بالا بردن کد و پارامترهای پیش فرض Code Hoisting and default parameters

  • ایجاد شیء پویا Dynamic Object creation

  • راه اندازی و واردات صادرات Setup and import exports

اختیاری - ES6 Bootcamp OPTIONAL - ES6 Bootcamp

  • کلمات کلیدی let و const با احتیاط Let and const keyword with caution

  • توابع فلش در ES6 arrow functions in ES6

  • کلمه کلیدی THIS اکنون ثابت شده است THIS keyword is now fixed

  • این کلمه کلیدی اکنون ثابت شده است THIS keyword is now fixed

  • بالا کشیدن کد و پارامترهای پیش‌فرض Code Hoisting and default parameters

  • ایجاد شیء پویا Dynamic Object creation

  • حلقه For of - بهترین در بین همه For of loop - Best of all

  • برای حلقه - بهترین از همه For of loop - Best of all

  • نقاط سوپر در ES6 Super dots in ES6

  • نقطه های فوق العاده در ES6 Super dots in ES6

  • تنظیم و واردات/صادرات Setup and import exports

اختیاری - بوت‌کمپ ES6 فراتر از اصول OPTIONAL - ES6 Bootcamp Beyond basics

  • صادرات توابع exporting functions

  • MAPS - راهنمای کامل MAPS - complete guide

  • نمادها در ES6 Symbols in ES6

  • کلاس ها در ES6 Classes in ES6

  • درخواست وب با استفاده از وعده ها Web request using promises

اختیاری - ES6 Bootcamp فراتر از اصول اولیه OPTIONAL - ES6 Bootcamp Beyond basics

  • صادرات توابع exporting functions

  • وارد کردن همه چیز از فایل ها importing everything from files

  • وارد کردن همه چیز از فایل‌ها importing everything from files

  • MAPS - راهنمای کامل MAPS - complete guide

  • SET در ES6 - دنیای مارول SET in ES6 - marvel universe

  • مجموعه در ES6 - دنیای مارول SET in ES6 - marvel universe

  • توابع استاتیک و getterها و setterها در ES6 Static function and getters and setters in ES6

  • تابع استاتیک و گیرنده و تنظیم کننده در ES6 Static function and getters and setters in ES6

  • سمبل‌ها در ES6 Symbols in ES6

  • کلاس‌ها در ES6 Classes in ES6

  • مقدمه‌ای بر Promises در ES6 Introduction to promises in ES6

  • مقدمه ای بر وعده ها در ES6 Introduction to promises in ES6

  • درخواست وب با استفاده از Promises Web request using promises

تا دفعه بعد می‌بینمت - خداحافظی See you next time - Farewell

دفعه بعد می بینمت - خداحافظ See you next time - Farewell

  • خداحافظی Farewell

  • بدرود Farewell

به‌روزرسانی‌های پس از انتشار After launch updates

پس از راه اندازی به روز رسانی After launch updates

  • پروژه ۱۱ - برنامه کامل دریافت ویدیوهای یوتیوب Project 11 - Complete youtube video fetching app

  • پروژه 11 - برنامه کامل واکشی ویدیوی یوتیوب Project 11 - Complete youtube video fetching app

  • Redux Fundamentals - تا حد امکان آسان است Redux Fundamentals - as easy as possible

  • مبانی Redux - تا حد امکان ساده Redux Fundamentals - as easy as possible

نمایش نظرات

آموزش توسعه‌دهنده کامل وب ری‌اکت جی‌اس با ES6 - ساخت ۱۰ پروژه
جزییات دوره
12.5 hours
76
Udemy (یودمی) Udemy (یودمی)
(آخرین آپدیت)
8,763
4 از 5
دارد
دارد
دارد
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Igneus Technologies Igneus Technologies

بهترین دوره های جامع ما در Igneus دانشجویانی را از IIT ، NIT و شرکت های معتبر آموزش داده ایم. دانشجویان از سراسر جهان به آموزش های با کیفیت بالا و مقرون به صرفه ما از 10+ کشور اعتماد کرده اند و برنامه های صدور گواهینامه ما را انتخاب کرده اند. IGNEUS مخفف انقلابی و یک تغییر با کیفیت افزایش یافته است که سعی کرده ایم در دنیای مدرن آموزش اینترنت به آن برسیم. ما در نظر داشته ایم که بیشترین تأکید را بر کیفیت برخورد با هر فناوری جدیدی داریم که باعث شده است از اینترنت در اینترنت متمایز شویم. و این انقلاب انتخابی ادامه خواهد یافت. امروزه IGNEUS Technologies با افتخار برچسب معتبرترین ارائه دهنده خدمات و برنامه های آموزشی بی شمار در جهان را که به طور مداوم در هر گوشه جهان همراه با جنبه های امنیت وب و فناوری منبع باز کمک می کند ، برداشته است. IGNEUS Technologies Pvt. Ltd رویایی است که توسط دو نابغه رایانه ای به اشتراک گذاشته و مطرح شده است تا جامعه را به ارتقا و آگاهی از جرایم سایبری که بی گناهی محیط زیست را مهار می کند ، بدست آورد و بدین ترتیب انقلابی به نفع امنیت سایبری آغاز شود.