React JS

React JS

REACT‌ یک کتابخانه یا فریم ورک در جاوا اسکریپت می‌باشد. این فریم ورک در طراحی UI کاربرد بسیار زیادی دارد. هم چنین برای مدیریت لایه‌های نمایشی برای برنامه‌های وب و موبایل

مروری بر دوره

React JS؛ کتابخانه محبوب جاوا اسکریپت برای طراحی UI

مروری بر دوره

می‌توان گفت اکثر ویژگی‌های جذاب بیشتر وب‌سایت‌ها را مدیون وجود جاوا اسکریپت هستیم. زبان برنامه‌نویسی که نمی‌توان دیگر وب را بدون وجود آن تصور کرد. جاوا اسکریپت زبان برنامه نویسی است که برای توسعه هر دو سمت فرانت-اند و بک-اند مورد استفاده قرار می‌گیرد. به لطف محبوبیت این زبان برنامه نویسی کتابخانه‌ها و فریمورک‌های مختلفی توسط اشخاص و تیم‌های مختلف توسعه یافته‌است که استفاده از قابلیت‌های خارق‌العاده آن را آسان‌تر کرده است. یکی از این کتابخانه‌ها محبوب ری‌اکت (React) نام دارد که توسط فیسبوک و عده‌ای از برنامه نویسان توسعه یافته است. به کمک react می‌توانید با زبان JavaScript قسمت فرانت-اند یا سمت کاربر (Client Side) وب‌سایت خود طراحی کنید.

چرا React JS اینقدر محبوب است؟

زمانی که یک موسسه یا شرکت عظیم با طرفداران فوق‌العاده زیاد، عهده‌دار نگهداری و توسعه یک کتابخانه جاوا اسکریپتی می‌شود، دیگر نباید شکی به این کتابخانه داشت. امروزه همه ما از Facebook و Instagram استفاده می‌کنیم و می‌دانیم که چقدر این دو شبکه اجتماعی از نگاه فنی کم اشکال و قابل اطمینان هستند و در سطح بالایی قرار دارند. حال در نظر بگیرید که این شرکت بزرگ عهده‌دار توسعه چنین کتابخانه مهمی بوده که از آن در ایجاد یک رابط کاربری زیبا و عام پسند استفاده کرده است. بنابراین، طراحان سایت و توسعه دهندگان وب، خیلی زود سراغ React رفتند. 

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

 

 

دلایل استفاده از REACT

تعداد زیادی کتابخونه و فریمورک open-source برای ساختن فرانت اند وب اپلیکیشن‌ها مانند انگولار وجود دارد که خیلی ساده تر از React هستند. خیلی سخت است که زمانی را به یاد گرفتن فریمورک های جدید اختصاص بدهیم به خصوص که عمر خیلی از این فریمورک ها بسیار کوتاه است و فرصت ریسک کردن را نداریم. بنابراین اگر شما به دنبال یک تکنولوژی هستید که جز بهترین‌های حوزه خودش باشد و ارزش ریسک را داشته باشد.

 

 سادگی

درک کردن مفاهیم React بسیار ساده است. رویکرد مبتنی بر کامپوننت،lifecycle  هایی که به بهترین نحو تعریف شده که کاملا مشخص و واضح هستند و استفاده از جاوا اسکریپت React را برای یادگیری و ساخت وب اپلیکیشن‌های حرفه‌ای آسان می کند. React از یک syntax ویژه با نام JSX  استفاده می‌کند که اجازه می‌دهد HTML و جاوا اسکریپت را ترکیب کنید. لازم نیست که حتما از JSX برای templating  استفاده کنید و برنامه نویس هنوز هم میتواند از جاوا اسکریپت برای این کار استفاده کند ولی اگر با JSX این کار را انجام دهید، دیگر به هیچ عنوان از جاوا اسکریپت برای templating استفاده نخواهید کرد.

 

یادگیری راحت

هر کسی با داشتن پیش زمینه ای از برنامه نویسی به راحتی می تواند React را یاد بگیرد در حالی که Angular و Ember از یک “Domain specific Language” استفاده می‌کنند که یادگیری آن بسیار سخت است. برای یادگیری React شما باید یک دانش مختصر در مورد HTML , CSS و جاوا اسکریپت داشته باشید.

 

رویکرد Native

همانطور که در ابتدای مقاله گفتیم React Native بر پایه جاوا اسکریپت و React است. پس تمام ویژگی‌هایی که برای React بیان کردیم در  React Native هم صدق می‌کند. به علاوه کد‌های بین دو پلتفرم Android و IOS مشترک است و کامپوننت‌هایی که می نویسید میتونید در چندین پروژه از آنها استفاده کنید.

 

عملکرد

هیچ container از پیش ساخته شده برای dependency ندارد. و می توانید از ماژول‌های Browserify, Require JS, EcmaScript 6 با استفاده از Babel استفاده کنید که به طور خودکار به  dependencies اضافه می شود.

 

تست پذیری

برنامه های ReactJS فوق العاده آسان میتوان آنها را تست کرد. بنابراین می‌توانیم توابع و کامپوننت های خودمون رو با پاس دادن پارامترها و state ها و خروجی‌ها رو چک کنیم.

 

جمع‌بندی

به علت اینکه ری‌اکت یک کتابخانه واقعی UI است برای یادگیری این حوزه انتخاب صحیحی می‌باشد. از دلایل دیگر یادگیری این کتابخانه پیشنهادات خوب بازار کار در این حوزه است. به دلیل روند رو به رشد گرایش طراحان و برنامه نویسان فرانت اندبه فریم ورک هایی نظیر react js، ما تصمیم گرفتیم دوره آموزش ری اکت را در مرکز آموزش بین الملل برگزار کنیم.

سرفصل ها

Getting Started
• Introduction to JavaScript
• JS Version
• Creating
• Tools
Core JavaScript Syntax
• Structure
• Console
• The prompt
• Value
• Operators
• Assignment
• Comparators
• Files
• Variables
• Incrementing & Decrementing
• Conditional
• Loops
• Data types
• Function
• Arrays
• Comments
• JavaScript Keyword
Types
• Numbers
• Strings
• Boolean
• Objects
Functions and advanced features
• Parameters
• Function Expressions
• Returned Functions
• Function Invocation
• Anonymous
• Closures
• Load orders
• Hoisting
• Scope
Objects
• Object Creation
• Accessing Object Properties
• Functionality in objects
• Object Methods
• Constructors
• Enumeration
• Prototypes
• Inheritance
• Prototypal Methods
Document Object Model
• What is DOM
• Nodes
Working With the DOM
• Get Elements
• Changing DOM
• Create DOM
Working with Events and Event Listeners
• Introduction to Events
• Click Load
• Focus Blur
• Timers
Debugging JavaScript
• Common Errors
• Console
• Debugging
UI Enhancement
• Introduction to Style
• Applying Classes
• Inline Styles
JavaScript AJAX
• Intro
• XML HTTP
• Send Request
• Server Response
• status
• Get and Post
• Callback
Javascript JSON
• Syntax
• Objects
• Parse
• Stringify
Browser Object Model
• window
• screen
• location
• Cookies
• Session
JavaScript Best Practices
• Minify
• Code Check
• Script Execution
• loop Optimization
• Anonymous Closures
• Performance Tips
• Exception Handling
JavaScript ES6
• ES6 Intro
• Let and Const
• Let in loops
• Defaults
• Rest Paramaters
• Spread Operator
• Arrow Functions
• Assign
• Initializer & Destructuring
• Strings
• Iterators
• Promises
• Generators
• Class
• Modules
• Symbol
React
• Introducing React
• React Tools
• React Packeges
• Setting Up the project
• Structure
• Project Compiler
• React Dom
• JSX
• React Component
• Composing Component
• Rendering
• Dom Elements
• Attributes
• Styles
• Events
• Binding This
• Passing Arguments
• Conditional Operator
• Controlled Component
• Application State
• Make a Functional Component
• Lifecycle Hooks
• Lifecycle Methods
• Key
• State
• Props
• Update
• Data Flow
• Integrating React with other Libraries
• Stateless Components
• Conditional Rendering
• React Debugging
• Handle User Events
• Controlled Elements
• Ref
• Forms
• Capture User Input
• Single Page Applications
• Optional Parameters
• Project Implementation
• Build project
• Deployment

پیش نیازها

تسلط کامل به مباحث HTML - CSS - JavaScript

تقویم آموزشی
1434
React JS

React JS

REACT‌ یک کتابخانه یا فریم ورک در جاوا اسکریپت می‌باشد. این فریم ورک در طراحی UI کاربرد بسیار زیادی دارد. هم چنین برای مدیریت لایه‌های نمایشی برای برنامه‌های وب و موبایل

مدرس: مهندس احسان شکاری

طول دوره: ۴۰ ساعت
شهریه: تومان

تاریخ شروع: ۱۴۰۰/۱۰/۱۲
یکشنبه . سه شنبه
زمان برگزاری: ۲۱:۰۰ - ۲۲:۴۵
Frontend: HTML, CSS, JavaScript, jQuery, Bootstrap, React JS, Angular JS, Adobe Photoshop For Web designer & Backend: PHP & MYSQL, Laravel, Python & Django, MongoDB, GitHub, Node JS

با ما همراه بشین

  • موسسه انفورماتیک بین الملل
  • تلفن تماس: ۰۵۱۳۷۶۴۹۳۳۹ - ۰۵۱۳۷۶۳۲۸۱۲
  • ایمیل: i3center.inc@gmail.com
  • ساعت کاری: از ۸:۳۰ تا ۲۰:۰۰
  • مشهد - بلوار فردوسی - نبش خیابان ثمانه - پلاک ۱۶۳
  • آمار
  • بازدیدهای سایت: 4641495
  • کلاس های آموزشی: 108
  • اساتید: 69
  • پرسنل: 7