litt react og funksjoner på slutten av dagen

This commit is contained in:
Geir Okkenhaug Jerstad 2024-09-11 14:53:45 +02:00
parent d3f21427f0
commit 492f0ef432

View file

@ -1,4 +1,5 @@
<html> <html>
<body> <body>
<div id="app"></div> <div id="app"></div>
<script src="https://unpkg.com/react@18/umd/react.development.js"></script> <script src="https://unpkg.com/react@18/umd/react.development.js"></script>
@ -7,16 +8,40 @@
<script type="text/jsx"> <script type="text/jsx">
const domNode = document.getElementById('app'); const domNode = document.getElementById('app');
function Header() { function createTitle(title) {
return (<h1>Develop. Preview. Ship.</h1>) if (title) {
return title;
} else {
return 'Default title';
}
}
function Header({ title }) {
return <h1>{title ? title : 'Default Title'}</h1>;
} }
function HomePage() { function HomePage() {
return <div> const names = ['Ada Lovlace', 'Grace Hopper', 'Margaret Hamilton'];
<Header /> function handleClick(){
</div>; console.log("increment like count")
} }
return( <div>
<Header title="Develop. Preview. Ship." />
<ul>
{names.map((name) => (
<li key={name}>{name}</li>
))}
</ul>
<button onClick={handleClick}>Like</button>
</div>
);
}
const root = ReactDOM.createRoot(domNode); const root = ReactDOM.createRoot(domNode);
root.render(<HomePage />); root.render(<HomePage />);
</script> </script>
</body> </body>
</html> </html>