import React from 'react';
const Component = () => {
return (
<h1>Component</h1>
)
}
export default Component;
// function component in react
import React from 'react';
const FunctionComponent = function() {
return (
<div>
<h1>React Function Component</h1>
</div>
)
}
export default FunctionComponent;
const component = () => {
console.log("This is a functional Component");
}
function Welcome(props) {
return <h1>Hello, {props.name}</h1>;
}
function App() {
return (
<div>
<Welcome name="Sara" /> <Welcome name="Cahal" /> <Welcome name="Edite" /> </div>
);
}
ReactDOM.render(
<App />,
document.getElementById('root')
);
import React from 'react'; const App = () => { const greeting = 'Hello Function Component!'; return <Headline value={greeting} />;}; const Headline = ({ value }) => <h1>{value}</h1>; export default App;
function Comment(props) {
return (
<div className="Comment">
<div className="UserInfo">
<img className="Avatar"
src={props.author.avatarUrl}
alt={props.author.name}
/>
<div className="UserInfo-name">
{props.author.name}
</div>
</div>
<div className="Comment-text">
{props.text}
</div>
<div className="Comment-date">
{formatDate(props.date)}
</div>
</div>
);
}
function Greeting(props) {
return <h1> Hello, {props.name}! </h1>
}
export const Comp = (x : props) => {}