آموزش یک ماشین حساب ساده در React + JavaScript Foundations بسازید

Build a Simple Calculator in React + JavaScript Foundations

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره: با ساخت ماشین حساب، اصول React و JavaScript را بیاموزید. شامل JSX، Callbacks، رویدادها، + بیشتر است

آنچه یاد خواهید گرفت

  • هدف ReactJS
  • ساخت یک صفحه وب ساده React
  • ابزارهای مورد نیاز برای کار با React
  • معرفی کدپن
  • مقدمه‌ای بر JSX، کامپوننت‌های عملکردی و React Props
  • مبانی پاسخ به تماس و رویدادهای OnClick
  • React State Hook
  • ساخت ماشین حساب
  • اشکال زدایی در React
  • مدل شیء سند (DOM)
  • عملگرهای حسابی جاوا اسکریپت، انواع داده، آرایه ها، حلقه ها، رویدادها
  • متغیرهای جاوا اسکریپت، اولویت اپراتور، اشیاء، توابع
  • مبانی جاوا اسکریپت

این دوره شما را گام به گام در فرآیند ساخت یک ماشین حساب کاملا کاربردی در React راهنمایی می کند. React که با نام React JS نیز شناخته می‌شود، یک کتابخانه قدرتمند جاوا اسکریپت است که برای ساخت رابط‌های کاربری سفارشی و تعاملی با استفاده از اجزای UI استفاده می‌شود. برخی از شناخته شده‌ترین نمونه‌های سازمان‌هایی که از React برای قسمت جلویی خود استفاده می‌کنند عبارتند از Netflix، Facebook و Airbnb. React که توسط متا به همراه جامعه ای از توسعه دهندگان مستقل توسعه و نگهداری می شود، رایگان و منبع باز باقی می ماند. React یک کتابخانه مبتنی بر کامپوننت است که به طور کامل بر اساس جاوا اسکریپت ساخته شده است، که آن را برای طراحی رابط های کاربری پیچیده عالی می کند. با React، توسعه‌دهندگان می‌توانند مؤلفه‌های کپسوله‌شده‌ای بسازند که به‌طور مؤثر وضعیت خود را مدیریت کرده و به‌روزرسانی‌های رابط کاربری را به‌طور خاص در هنگام تغییر داده‌ها ارائه کنند. برای مثال، به ویژگی به‌روزرسانی خودکار محتوا که در فید توییتر یا دکمه لایک فیس‌بوک می‌بینید، فکر کنید. در اینجا وضعیت مؤلفه UI در صفحه تغییر می کند، بدون نیاز به بازخوانی دستی هنگام به روز رسانی داده ها. این تنها یک ویژگی کوچک و در عین حال قدرتمند React است.

از طریق یک پروژه عملی کامل، این دوره به شما تمام اصول اساسی React را که برای تبدیل شدن به یک توسعه دهنده ماهر React باید بدانید، به شما آموزش می دهد. ما درست از اصول اولیه شروع می کنیم، از جمله ابزارهای مورد نیاز برای شروع. از آنجا به JSX، کامپوننت‌های کاربردی، ابزارها، تماس‌های برگشتی و رویدادهای مختلف OnClick می‌پردازیم. در این مرحله، ماشین حساب یک نمایش بصری کامل همراه با عملیات حسابی کاربردی خواهد داشت. سپس دانش‌آموزان به انتقال پارامترها در توابع Callback، با استفاده از React State Hook و اشکال‌زدایی می‌پردازند.

علاوه بر ماژول عملی React، ما همچنین یک مرور کلی از جاوا اسکریپت را برای کسانی که نیاز به تجدید نظر دارند ارائه می‌کنیم. . در اینجا ما با معرفی دانش آموزان با مدل شیء سند (DOM) شروع می کنیم که ساختار منطقی اسناد HTML را تعریف می کند. از آنجا به جاوا اسکریپت می‌رویم تا روش‌های مختلفی را نشان دهیم که در آن عناصر DOM می‌توانند برای افزودن تعامل به اجزای استاتیک دستکاری شوند. ما درست از اصول اولیه شروع می کنیم، که شامل جاوا اسکریپت و خروجی داده می شود. از آنجا به اعلان متغیر، عملیات حسابی، اولویت عملگر، انواع داده ها و اشیا می رویم. پس از پوشاندن پایه ها، با استفاده از آرایه ها، بیانیه های شرطی، عملگرهای مقایسه جاوا اسکریپت، بولی ها و حلقه ها به سمت عملیات پیچیده تر می رویم. در اینجا دانش آموزان یاد خواهند گرفت که قدرت واقعی جاوا اسکریپت را برای ارائه نتایج متفاوت بر اساس تعامل کاربر آزاد کنند. ما استفاده از توابع را برای مدیریت کارآمد وظایف تکراری و رویدادهای جاوا اسکریپت برای مدیریت خروجی بر اساس کنش‌ها و رویدادها بررسی خواهیم کرد. این بخش با یک پروژه عملی به پایان می رسد که در آن دانش آموزان دانش خود را برای ایجاد یک گالری عکس مبتنی بر وب و تغییر رنگ پس زمینه پیاده سازی می کنند.

همانطور که می بینید این دوره مقدار زیادی از زمین را پوشش می دهد. بهترین از همه ویژگی های Tim Maclachlan - یک توسعه دهنده ارشد مشهور با بیش از 20 سال تجربه توسعه تجاری است. به عنوان یک توسعه دهنده چند وجهی، تیم در توسعه الگوریتمی، تحلیلی و موبایل متخصص است. او تا به امروز صدها درخواست نوشته و در تعدادی از صنایع از حمل و نقل هوایی تجاری و نظامی گرفته تا بانکداری و مالی کار کرده است. تیم اشتیاق واقعی به آموزش دیگران دارد که چگونه کدنویسان بهتری شوند و مشتاقانه منتظر تعامل با دانش‌آموزان خود است. دکمه ثبت نام را بزنید و بیایید شروع کنیم.


این دوره برای چه کسانی است:

  • دانشجویان علاقه مند به یادگیری نحوه ساخت صفحات وب تعاملی با استفاده از جاوا اسکریپت
  • دانشجویان علاقه مند به یادگیری ReactJS
  • دانشجویان علاقه مند به توسعه رابط کاربری front-end با استفاده از React
  • دانشجویان علاقه مند به یادگیری مبانی جاوا اسکریپت

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

مدل شیء سند (DOM) The Document Object Model (DOM)

  • معرفی DOM DOM Introduction

  • دستکاری DOM DOM Manipulation

توسعه جاوا اسکریپت JavaScript Development

  • مقدمه Introduction

  • قرار دادن JS JS Placement

  • جاوا اسکریپت خارجی External JavaScript

  • خروجی جاوا اسکریپت JavaScript Output

  • JavaScript InnerHTML JavaScript InnerHTML

  • کامنت گذاری جاوا اسکریپت JavaScript Commenting

  • ثابت جاوا اسکریپت JavaScript Constants

  • معرفی متغیرهای جاوا اسکریپت JavaScript Variables Introduction

  • اپراتور جاوا اسکریپت JavaScript Assignment Operator

  • عملیات محاسباتی جاوا اسکریپت JavaScript Arithmetic Operations

  • عملیات محاسباتی جاوا اسکریپت ادامه دارد JavaScript Arithmetic Operations Continued

  • اولویت اپراتور جاوا اسکریپت JavaScript Operator Precedence

  • انواع داده جاوا اسکریپت JavaScript Data Types

  • اشیاء جاوا اسکریپت JavaScript Objects

  • خروجی شی جاوا اسکریپت JavaScript Object Output

  • رشته های جاوا اسکریپت JavaScript Strings

  • طول رشته جاوا اسکریپت JavaScript String Length

  • کاراکترهای ویژه جاوا اسکریپت JavaScript Special Characters

  • اعداد تصادفی جاوا اسکریپت JavaScript Random Numbers

  • تابع حداقل و حداکثر جاوا اسکریپت JavaScript Min and Max Function

  • تابع دور ریاضی جاوا اسکریپت JavaScript Math Round Function

  • آرایه های جاوا اسکریپت JavaScript Arrays

  • ویژگی های آرایه جاوا اسکریپت JavaScript Array Attributes

  • آرایه های جاوا اسکریپت - Pop - Push - Shift - Unshift JavaScript Arrays - Pop - Push - Shift - Unshift

  • جاوا اسکریپت تغییر و حذف عناصر JavaScript Changing and Deleting Elements

  • جاوا اسکریپت پیوند یک آرایه JavaScript Splicing an Array

  • جاوا اسکریپت مرتب سازی یک آرایه JavaScript Sorting an Array

  • پیوستن آرایه های جاوا اسکریپت JavaScript Joining Arrays

  • عبارات شرطی جاوا اسکریپت JavaScript Conditional Statements

  • مقایسه جاوا اسکریپت JavaScript Comparisons

  • بولین های جاوا اسکریپت JavaScript Booleans

  • جاوا اسکریپت برای حلقه ها JavaScript For Loops

  • JavaScript For-In Loop JavaScript For-In Loop

  • JavaScript while Loops JavaScript While Loops

  • حلقه جاوا اسکریپت Do-While JavaScript Do-While Loop

  • جاوا اسکریپت شکسته و ادامه دهید JavaScript Break and Continue

  • توابع جاوا اسکریپت JavaScript Functions

  • رویدادهای جاوا اسکریپت JavaScript Events

  • JavaScript Project 1 - BG Color Changer JavaScript Project 1 - BG Color Changer

  • پروژه جاوا اسکریپت 2 - گالری عکس JavaScript Project 2 - Photo Gallery

  • پروژه جاوا اسکریپت 2 - تکمیل JavaScript Project 2 - Completion

مقدمه Introduction

  • مهارت های مورد نیاز Skills Required

  • React چیست؟ What is React?

پروژه: ساخت ماشین حساب در React Project: Build a Calculator in React

  • بررسی اجمالی پروژه Project Overview

  • سلام واکنش Hello React

  • ابزار مورد نیاز Tools Needed

  • قلم کد Code Pen

  • معرفی JSX Intro to JSX

  • کامپوننت های کاربردی در React Functional Components in React

  • چرا کامپوننت ها؟ Why Components?

  • معرفی Props در React Intro to Props in React

  • React Components، Props و Callbacks React Components, Props and Callbacks

  • ساخت تصاویر بصری ماشین حساب Building the calculator visuals

  • رویدادهای OnClick در React OnClick Events in React

  • عبور پارامترها در توابع پاسخ به تماس Passing Parameters in Callback Functions

  • با استفاده از React State Hook Using React State Hook

  • پیاده سازی ماشین حساب - نمایش Implementing the calculator - Display

  • پیاده سازی ماشین حساب - اپراتورها Implementing the calculator - Operators

  • اشکال زدایی در React Debugging in React

  • خلاصه ی پروژه Project Summary

نمایش نظرات

Udemy (یودمی)

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

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

آموزش یک ماشین حساب ساده در React + JavaScript Foundations بسازید
جزییات دوره
2h 58m
62
Udemy (یودمی) Udemy (یودمی)
(آخرین آپدیت)
3,001
3 از 5
ندارد
دارد
دارد
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

YouAccel Training YouAccel Training

شروع به یادگیری کنید و مهارت های مورد نیاز خود را کسب کنید! بیانیه ماموریت: برای تسهیل یک محیط جامع یادگیری آنلاین برای دانشجویان. درباره شرکت YouAccel یک ارائه دهنده پیشرو در آموزش آنلاین است ، دوره هایی را در صنایع مختلف از IT و توسعه گرفته تا تجارت ، بازاریابی ، طراحی و بهره وری ارائه می دهد. تجربه آموزش الکترونیکی ارائه شده توسط YouAccel پویا است. هر دوره در High Definition با تکالیف ، آزمونها و امتحانات مربوطه که به صورت الکترونیکی تحویل و درجه بندی می شوند ، پخش می شود. کلیه دوره های YouAccel توسط مربیان دارای گواهینامه تدریس می شود که دارای چندین سال سابقه کار در زمینه ای هستند که برای آنها آموزش می دهند. این دوره ها را می توان با سرعت شخصی برگزار کرد و در چندین سطح از جمله مبتدی ، متوسط و پیشرفته ارائه می شود. دوره های آنلاین همچنین برای راحتی بیشتر با هر دستگاه تلفن همراه سازگار هستند. با استفاده از این تجربه به یک سطح جدید شخصی ، ارتباط زنده با مربیان از طریق کنسول پیام رسانی آنلاین Udemy در دسترس است. کلیه دوره ها دارای گواهی پایان دوره هستند و محدودیت سنی اعمال نمی شود.