Hello and Welcome to this tutorial on Reactjs . Here , we are going to learn Reactjs and also create a simple application .
Table of Contents
- Getting Started
- Components
- JSX
- props
- state
1. Getting Started
Finish
up all the required software installation (nodejs , vscode..) and start
with creating a simple application using the following command .
npx create-react-app your-app-name
start your app using the following command
2. Components
Components are basic building blocks of a React application . Let's create one .
Create a new file , here is an example of a sample component .
import React from 'react';
import './App.css';
function App() {
return (
<div >
Hello World !
</div>
);
}
export default App;
2.1 render()
returns the HTML part of the component .
3. JSX
JSX stands for Javascript XML . You would have
notice that in the render function we return an HTML element , that's
actually a JSX . A JSX should be a valid XML .It is translated to
Javascript at runtime .You can use an expression {} in JSX .
4. props
We can access the data passed to a component using props .
5. state
A state can have multiple properties which
will be used within an application . If any state property is changed
the component is re rendered .
6.LifeCycle : Mounting
- Constructor
- static getDerivedStateFromProps
- render
- componentDidMount