SlideShare a Scribd company logo
1 of 21
Introduction
 React is a popular open source front-end JavaScript library developed by
Facebook.
 React makes easier to create interactive user interfaces.
 Using node React can also be rendered on the server side.
 Alongside web apps, to build mobile application we can use React native as well.
 React is very popular among developer because of it’s simplicity and easy but
effective development process.
Why Learn React ?
 React is introduced to the world two years ago, since it has been
impressive growth.
 Developers are choosing React because it allows more time to spend on
product and less time to fighting and learning with framework
 The combination of React and rapid iteration cycle of the web, has enabled
to make some excellent products including many Facebook components.
React has no
..Controller
..Directive
..template
..global event Listener
..Models
..no view model
Just
Components
What if we “separate” another way
What if we “separate” another way
What if we “separate” another way
What if we “separate” another way
Separation of Components
> Composable
> reusable
> maintainable
> testable
If components are truly self Contained
Data Flows only one Way
1
3
What is DOM?
DOM stands
for Document
Object Model
It is also called
Real DOM
DOM defines
the Logical
structure of
document.
DOM also
called heart of
web
technologies.
Why updating Real DOM is very slow?
Virtual DOM
 Virtual DOM is in-memory representation of Real DOM. It is lightweight JavaScript
object which is copy of Real DOM
 Updating virtual Dom in Reactjs is faster because
 The diffing algorithm written in React is quite fast and efficient
 Lightweight
 It can be used without React as an independent engine
 Uses observable instead of dirty checking to detect images
 Render() fires whenever something changes.
 Disadvantage
 It occupies quite much memory. Full in memory copy of the DOM.
Who are using React?
Popular apps
which are
using react
Where to go from here?
 https://reactjs.org/
 https://github.com/facebook/react
 https://blog.andrewray.me/reactjs-for-stupid-people/
 https://www.infoq.com/news/2013/06/facebook-react
Thank You

More Related Content

What's hot

Aeternity Blockchain - Ecosystem & Devtools [2019]
Aeternity Blockchain - Ecosystem & Devtools [2019]Aeternity Blockchain - Ecosystem & Devtools [2019]
Aeternity Blockchain - Ecosystem & Devtools [2019]Przemysław Thomann
 
Meteor intro-2015
Meteor intro-2015Meteor intro-2015
Meteor intro-2015MeteorJS
 
Understanding Microservices
Understanding Microservices Understanding Microservices
Understanding Microservices M A Hossain Tonu
 
JOSA TechTalks - RESTful API Concepts and Best Practices
JOSA TechTalks - RESTful API Concepts and Best PracticesJOSA TechTalks - RESTful API Concepts and Best Practices
JOSA TechTalks - RESTful API Concepts and Best PracticesJordan Open Source Association
 
Building Rich Ruby on Rails with Emberjs
Building Rich Ruby on Rails with EmberjsBuilding Rich Ruby on Rails with Emberjs
Building Rich Ruby on Rails with EmberjsVysakh Sreenivasan
 
Activate bots within SharePoint Framework
Activate bots within SharePoint FrameworkActivate bots within SharePoint Framework
Activate bots within SharePoint FrameworkKushan Lahiru Perera
 
Developing WordPress Plugins : For Begineers
Developing WordPress Plugins :  For BegineersDeveloping WordPress Plugins :  For Begineers
Developing WordPress Plugins : For BegineersM A Hossain Tonu
 
Application innovation & Developer Productivity
Application innovation & Developer ProductivityApplication innovation & Developer Productivity
Application innovation & Developer ProductivityKushan Lahiru Perera
 
10 top web development frameworks (new version 21 11)
10 top web development frameworks (new version 21 11)10 top web development frameworks (new version 21 11)
10 top web development frameworks (new version 21 11)Mandar Majmudar
 
Rp 6 session 2 naresh bhatia
Rp 6  session 2 naresh bhatiaRp 6  session 2 naresh bhatia
Rp 6 session 2 naresh bhatiasapientindia
 
Pragmatic approach to building native apps hybrid way
Pragmatic approach to building native apps hybrid wayPragmatic approach to building native apps hybrid way
Pragmatic approach to building native apps hybrid wayThoughtworks
 
Progressive web apps with QCObjects (AngularJS Chile Community Talk)
Progressive web apps with QCObjects (AngularJS Chile Community Talk)Progressive web apps with QCObjects (AngularJS Chile Community Talk)
Progressive web apps with QCObjects (AngularJS Chile Community Talk)Jean Machuca
 
Lessons Learned From Applications That Kicked Titanium's Ass
Lessons Learned From Applications That Kicked Titanium's AssLessons Learned From Applications That Kicked Titanium's Ass
Lessons Learned From Applications That Kicked Titanium's AssKevin Whinnery
 

What's hot (17)

Aeternity Blockchain - Ecosystem & Devtools [2019]
Aeternity Blockchain - Ecosystem & Devtools [2019]Aeternity Blockchain - Ecosystem & Devtools [2019]
Aeternity Blockchain - Ecosystem & Devtools [2019]
 
Meteor intro-2015
Meteor intro-2015Meteor intro-2015
Meteor intro-2015
 
Meteor.js for DOers
Meteor.js for DOersMeteor.js for DOers
Meteor.js for DOers
 
Understanding Microservices
Understanding Microservices Understanding Microservices
Understanding Microservices
 
JOSA TechTalks - RESTful API Concepts and Best Practices
JOSA TechTalks - RESTful API Concepts and Best PracticesJOSA TechTalks - RESTful API Concepts and Best Practices
JOSA TechTalks - RESTful API Concepts and Best Practices
 
Building Rich Ruby on Rails with Emberjs
Building Rich Ruby on Rails with EmberjsBuilding Rich Ruby on Rails with Emberjs
Building Rich Ruby on Rails with Emberjs
 
Succeeding with FOSS!
Succeeding with FOSS!Succeeding with FOSS!
Succeeding with FOSS!
 
Activate bots within SharePoint Framework
Activate bots within SharePoint FrameworkActivate bots within SharePoint Framework
Activate bots within SharePoint Framework
 
Developing WordPress Plugins : For Begineers
Developing WordPress Plugins :  For BegineersDeveloping WordPress Plugins :  For Begineers
Developing WordPress Plugins : For Begineers
 
Application innovation & Developer Productivity
Application innovation & Developer ProductivityApplication innovation & Developer Productivity
Application innovation & Developer Productivity
 
10 top web development frameworks (new version 21 11)
10 top web development frameworks (new version 21 11)10 top web development frameworks (new version 21 11)
10 top web development frameworks (new version 21 11)
 
Build social apps for Facebook
Build social apps for FacebookBuild social apps for Facebook
Build social apps for Facebook
 
Titanium @ Minnebar
Titanium @ MinnebarTitanium @ Minnebar
Titanium @ Minnebar
 
Rp 6 session 2 naresh bhatia
Rp 6  session 2 naresh bhatiaRp 6  session 2 naresh bhatia
Rp 6 session 2 naresh bhatia
 
Pragmatic approach to building native apps hybrid way
Pragmatic approach to building native apps hybrid wayPragmatic approach to building native apps hybrid way
Pragmatic approach to building native apps hybrid way
 
Progressive web apps with QCObjects (AngularJS Chile Community Talk)
Progressive web apps with QCObjects (AngularJS Chile Community Talk)Progressive web apps with QCObjects (AngularJS Chile Community Talk)
Progressive web apps with QCObjects (AngularJS Chile Community Talk)
 
Lessons Learned From Applications That Kicked Titanium's Ass
Lessons Learned From Applications That Kicked Titanium's AssLessons Learned From Applications That Kicked Titanium's Ass
Lessons Learned From Applications That Kicked Titanium's Ass
 

Similar to Reactjs A javascript Library

How Can the Hermes Engine Help React Native Apps.docx.pdf
How Can the Hermes Engine Help React Native Apps.docx.pdfHow Can the Hermes Engine Help React Native Apps.docx.pdf
How Can the Hermes Engine Help React Native Apps.docx.pdfTechugo
 
How Can the Hermes Engine Help React Native Apps.
How Can the Hermes Engine Help React Native Apps.How Can the Hermes Engine Help React Native Apps.
How Can the Hermes Engine Help React Native Apps.Techugo
 
React js vs react native a comparative analysis
React js vs react native a comparative analysisReact js vs react native a comparative analysis
React js vs react native a comparative analysisShelly Megan
 
FRONTEND DEVELOPMENT WITH REACT.JS
FRONTEND DEVELOPMENT WITH REACT.JSFRONTEND DEVELOPMENT WITH REACT.JS
FRONTEND DEVELOPMENT WITH REACT.JSIRJET Journal
 
Techpaathshala ReactJS .pdf
Techpaathshala ReactJS .pdfTechpaathshala ReactJS .pdf
Techpaathshala ReactJS .pdfTechpaathshala
 
Reactjs Vs React Native – Key Difference, Advantages, And Disadvantages
Reactjs Vs React Native – Key Difference, Advantages, And DisadvantagesReactjs Vs React Native – Key Difference, Advantages, And Disadvantages
Reactjs Vs React Native – Key Difference, Advantages, And DisadvantagesAndolasoft Inc
 
Why Use React Js A Complete Guide (1).pdf
Why Use React Js A Complete Guide (1).pdfWhy Use React Js A Complete Guide (1).pdf
Why Use React Js A Complete Guide (1).pdfKaty Slemon
 
Vue Or React - Which One is the Best_.pptx
Vue Or React - Which One is the Best_.pptxVue Or React - Which One is the Best_.pptx
Vue Or React - Which One is the Best_.pptx75waytechnologies
 
React Vs Vue.js Which One is Better.pdf
React Vs Vue.js Which One is Better.pdfReact Vs Vue.js Which One is Better.pdf
React Vs Vue.js Which One is Better.pdfLaura Miller
 
The Best Guide to Know What, Why, When to Use Is ReactJS
The Best Guide to Know What, Why, When to Use Is ReactJSThe Best Guide to Know What, Why, When to Use Is ReactJS
The Best Guide to Know What, Why, When to Use Is ReactJSWeblineIndia
 
React Development Services
React Development ServicesReact Development Services
React Development ServicesRajasreePothula3
 
React Js Simplified
React Js SimplifiedReact Js Simplified
React Js SimplifiedSunil Yadav
 
5 Reasons To Choose React JS Development Services In 2024
5 Reasons To Choose React JS Development Services In 20245 Reasons To Choose React JS Development Services In 2024
5 Reasons To Choose React JS Development Services In 2024Zestgeek Solutions
 
React vs. angular a comprehensive guideline for choosing right front-end fr...
React vs. angular   a comprehensive guideline for choosing right front-end fr...React vs. angular   a comprehensive guideline for choosing right front-end fr...
React vs. angular a comprehensive guideline for choosing right front-end fr...Katy Slemon
 
React native vs react js
React native vs react jsReact native vs react js
React native vs react jsJessica655282
 
Why Should You Choose ReactJS for Game Development_.pdf
Why Should You Choose ReactJS for Game Development_.pdfWhy Should You Choose ReactJS for Game Development_.pdf
Why Should You Choose ReactJS for Game Development_.pdfReactJS
 

Similar to Reactjs A javascript Library (20)

How Can the Hermes Engine Help React Native Apps.docx.pdf
How Can the Hermes Engine Help React Native Apps.docx.pdfHow Can the Hermes Engine Help React Native Apps.docx.pdf
How Can the Hermes Engine Help React Native Apps.docx.pdf
 
How Can the Hermes Engine Help React Native Apps.
How Can the Hermes Engine Help React Native Apps.How Can the Hermes Engine Help React Native Apps.
How Can the Hermes Engine Help React Native Apps.
 
What is ReactJS?
What is ReactJS?What is ReactJS?
What is ReactJS?
 
React js vs react native a comparative analysis
React js vs react native a comparative analysisReact js vs react native a comparative analysis
React js vs react native a comparative analysis
 
FRONTEND DEVELOPMENT WITH REACT.JS
FRONTEND DEVELOPMENT WITH REACT.JSFRONTEND DEVELOPMENT WITH REACT.JS
FRONTEND DEVELOPMENT WITH REACT.JS
 
Techpaathshala ReactJS .pdf
Techpaathshala ReactJS .pdfTechpaathshala ReactJS .pdf
Techpaathshala ReactJS .pdf
 
Reactjs Vs React Native – Key Difference, Advantages, And Disadvantages
Reactjs Vs React Native – Key Difference, Advantages, And DisadvantagesReactjs Vs React Native – Key Difference, Advantages, And Disadvantages
Reactjs Vs React Native – Key Difference, Advantages, And Disadvantages
 
Why Use React Js A Complete Guide (1).pdf
Why Use React Js A Complete Guide (1).pdfWhy Use React Js A Complete Guide (1).pdf
Why Use React Js A Complete Guide (1).pdf
 
ReactNative.pptx
ReactNative.pptxReactNative.pptx
ReactNative.pptx
 
learning react
learning reactlearning react
learning react
 
Vue Or React - Which One is the Best_.pptx
Vue Or React - Which One is the Best_.pptxVue Or React - Which One is the Best_.pptx
Vue Or React - Which One is the Best_.pptx
 
React DOM/Virtual DOM
React DOM/Virtual DOMReact DOM/Virtual DOM
React DOM/Virtual DOM
 
React Vs Vue.js Which One is Better.pdf
React Vs Vue.js Which One is Better.pdfReact Vs Vue.js Which One is Better.pdf
React Vs Vue.js Which One is Better.pdf
 
The Best Guide to Know What, Why, When to Use Is ReactJS
The Best Guide to Know What, Why, When to Use Is ReactJSThe Best Guide to Know What, Why, When to Use Is ReactJS
The Best Guide to Know What, Why, When to Use Is ReactJS
 
React Development Services
React Development ServicesReact Development Services
React Development Services
 
React Js Simplified
React Js SimplifiedReact Js Simplified
React Js Simplified
 
5 Reasons To Choose React JS Development Services In 2024
5 Reasons To Choose React JS Development Services In 20245 Reasons To Choose React JS Development Services In 2024
5 Reasons To Choose React JS Development Services In 2024
 
React vs. angular a comprehensive guideline for choosing right front-end fr...
React vs. angular   a comprehensive guideline for choosing right front-end fr...React vs. angular   a comprehensive guideline for choosing right front-end fr...
React vs. angular a comprehensive guideline for choosing right front-end fr...
 
React native vs react js
React native vs react jsReact native vs react js
React native vs react js
 
Why Should You Choose ReactJS for Game Development_.pdf
Why Should You Choose ReactJS for Game Development_.pdfWhy Should You Choose ReactJS for Game Development_.pdf
Why Should You Choose ReactJS for Game Development_.pdf
 

Recently uploaded

How to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POSHow to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POSCeline George
 
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...Pooja Bhuva
 
How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17Celine George
 
How to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxHow to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxCeline George
 
The basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptxThe basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptxheathfieldcps1
 
FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024Elizabeth Walsh
 
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...Nguyen Thanh Tu Collection
 
Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)Jisc
 
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdf
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdfUnit 3 Emotional Intelligence and Spiritual Intelligence.pdf
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdfDr Vijay Vishwakarma
 
Wellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptxWellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptxJisc
 
This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.christianmathematics
 
How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17Celine George
 
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptxHMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptxmarlenawright1
 
On_Translating_a_Tamil_Poem_by_A_K_Ramanujan.pptx
On_Translating_a_Tamil_Poem_by_A_K_Ramanujan.pptxOn_Translating_a_Tamil_Poem_by_A_K_Ramanujan.pptx
On_Translating_a_Tamil_Poem_by_A_K_Ramanujan.pptxPooja Bhuva
 
On National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan FellowsOn National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan FellowsMebane Rash
 
REMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptxREMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptxDr. Ravikiran H M Gowda
 
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...Amil baba
 
Philosophy of china and it's charactistics
Philosophy of china and it's charactisticsPhilosophy of china and it's charactistics
Philosophy of china and it's charactisticshameyhk98
 

Recently uploaded (20)

How to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POSHow to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POS
 
Call Girls in Uttam Nagar (delhi) call me [🔝9953056974🔝] escort service 24X7
Call Girls in  Uttam Nagar (delhi) call me [🔝9953056974🔝] escort service 24X7Call Girls in  Uttam Nagar (delhi) call me [🔝9953056974🔝] escort service 24X7
Call Girls in Uttam Nagar (delhi) call me [🔝9953056974🔝] escort service 24X7
 
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
 
How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17
 
How to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxHow to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptx
 
The basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptxThe basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptx
 
FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024
 
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
 
Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)
 
Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024
 
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdf
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdfUnit 3 Emotional Intelligence and Spiritual Intelligence.pdf
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdf
 
Wellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptxWellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptx
 
This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.
 
How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17
 
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptxHMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
 
On_Translating_a_Tamil_Poem_by_A_K_Ramanujan.pptx
On_Translating_a_Tamil_Poem_by_A_K_Ramanujan.pptxOn_Translating_a_Tamil_Poem_by_A_K_Ramanujan.pptx
On_Translating_a_Tamil_Poem_by_A_K_Ramanujan.pptx
 
On National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan FellowsOn National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan Fellows
 
REMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptxREMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptx
 
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
 
Philosophy of china and it's charactistics
Philosophy of china and it's charactisticsPhilosophy of china and it's charactistics
Philosophy of china and it's charactistics
 

Reactjs A javascript Library

  • 1. Introduction  React is a popular open source front-end JavaScript library developed by Facebook.  React makes easier to create interactive user interfaces.  Using node React can also be rendered on the server side.  Alongside web apps, to build mobile application we can use React native as well.  React is very popular among developer because of it’s simplicity and easy but effective development process.
  • 2. Why Learn React ?  React is introduced to the world two years ago, since it has been impressive growth.  Developers are choosing React because it allows more time to spend on product and less time to fighting and learning with framework  The combination of React and rapid iteration cycle of the web, has enabled to make some excellent products including many Facebook components.
  • 3. React has no ..Controller ..Directive ..template ..global event Listener ..Models ..no view model Just Components
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9. What if we “separate” another way
  • 10. What if we “separate” another way
  • 11. What if we “separate” another way
  • 12. What if we “separate” another way
  • 13.
  • 14. Separation of Components > Composable > reusable > maintainable > testable If components are truly self Contained
  • 15. Data Flows only one Way 1 3
  • 16. What is DOM? DOM stands for Document Object Model It is also called Real DOM DOM defines the Logical structure of document. DOM also called heart of web technologies.
  • 17. Why updating Real DOM is very slow?
  • 18. Virtual DOM  Virtual DOM is in-memory representation of Real DOM. It is lightweight JavaScript object which is copy of Real DOM  Updating virtual Dom in Reactjs is faster because  The diffing algorithm written in React is quite fast and efficient  Lightweight  It can be used without React as an independent engine  Uses observable instead of dirty checking to detect images  Render() fires whenever something changes.  Disadvantage  It occupies quite much memory. Full in memory copy of the DOM.
  • 19. Who are using React? Popular apps which are using react
  • 20. Where to go from here?  https://reactjs.org/  https://github.com/facebook/react  https://blog.andrewray.me/reactjs-for-stupid-people/  https://www.infoq.com/news/2013/06/facebook-react