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

Functional Component

Uploaded by

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

Functional Component

Uploaded by

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

functional component

---------------
import React from "react";

function Home
{
return(
<div>
<a href="http://www.google.com"><Google></a>
<h1>hello heading</h1>
</div>
);
}
export default Home;

-------------------------------------------------
class component

import React from "react";

class Contact extends React.Components


{
render()
{

return(
<div>
<h1 >Hello This is Class Component</h1>
</div>
);
}
export default Contact;

-----------------------------------------------------------------------------
css syntax

import About from '/About';


import '/App.css';
import Contact from '/Contact';
import Home from '/Home';

function App()
{
return (
<div className="App">
<img src='slide-1.jpg' style={width:" 100%", height:"300px"}}
alt="None" />
<h1 style=f{color: "green", background:"yellow">Hello World</h1>
<h2>This is React Session</h2>
<Home />
<hr />
‹Contact />
<hr />
<About />
</div>
);
}
export default App;

-------------------------------------------------------------
arrow function

import React from "react";

const About = ()=>


{

return(
<div>
<h1 > This Component is created using Arrow Function</h1>
</ div>
);
}
export default About;
-----------------------------------------------------------------

You might also like