0% found this document useful (0 votes)
14 views

React - Js For Beginners

Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
14 views

React - Js For Beginners

Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 12

See discussions, stats, and author profiles for this publication at: https://www.researchgate.

net/publication/376450883

React.JS for beginners

Presentation · December 2023


DOI: 10.13140/RG.2.2.16772.71041

CITATIONS READS

0 7,267

1 author:

Vladyslav Hrabovyii
Donetsk University
1 PUBLICATION 0 CITATIONS

SEE PROFILE

All content following this page was uploaded by Vladyslav Hrabovyii on 12 December 2023.

The user has requested enhancement of the downloaded file.


R E AC T. J S F O R B E G I N N E R S
Prepared by Vladyslav Hrabovyii
I N T R O D U C T I O N T O R E AC T. J S
o React.js is a popular JavaScript library for
building user interfaces. It's maintained by
Facebook and a community of individual
developers. React allows developers to create
large web applications that can change data,
without reloading the page.
PREREQUISITES & SETUP
o To start with React.js, you need a basic
understanding of HTML, CSS, and JavaScript.
Familiarity with ES6 features like classes, arrow
functions, and destructuring is also beneficial.
Setting up a React environment typically
involves Node.js and npm (node package
manager).
U N D E R S TA N D I N G J S X
o JSX (JavaScript XML) looks like HTML and is
used in React to describe the UI. It's a syntax
extension for JavaScript and allows you to
write HTML elements in JavaScript and place
them in the DOM without any createElement()
and/or appendChild() methods.
C O M P O N E N T S I N R E AC T
o Components are the building blocks of any
React application. There are two types of
components in React - Class components and
Functional components. Class components
are ES6 classes that extend from
React.Component and can hold state and
lifecycle methods.
FUNCTIONAL COMPONENTS &
HOOKS
o Functional components are JavaScript
functions. They accept a single 'props' object
argument with data and return a React
element. React Hooks, introduced in version
16.8, allow functional components to have
state and other React features.
S TAT E A N D P R O P S
o State is an object that holds some information
that may change over the lifetime of the
component. It is managed within the
component (similar to variables declared
within a function). Props (short for
'properties') are read-only components. They
are an object that stores the value of
attributes of a tag and work similar to HTML
VIRTUAL DOM EXPLAINED
o The Virtual DOM (VDOM) is a programming
concept where an ideal, or "virtual",
representation of a UI is kept in memory and
synced with the "real" DOM by a library such
as ReactDOM. This process is known as
reconciliation.
HANDLING EVENTS
o Event handling in React is very similar to
handling events on DOM elements. However,
there are some syntactic differences: React
events are named using camelCase, rather
than lowercase. With JSX, you pass a function
as the event handler, rather than a string.
R E AC T R O U T E R
o React Router is the standard routing library
for React. It enables the navigation among
views of various components in a React
Application, allows changing the browser URL,
and keeps UI in sync with the URL.
L E A R N I N G PAT H & R E S O U RC E S
o To effectively learn React.js, practice by
building small projects like a to-do list, a blog,
or a weather app. Join the React community
for support and keep up with the latest
updates. Remember, practice and patience
are key in learning any new technology.

View publication stats

You might also like