lks/frontends
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Convert to React JSX

Browse Source
This commit is contained in:
Lucas Schumacher 2024-06-17 23:38:01 -04:00
parent ec9fa157d3
commit fc16b50fe8
1 changed files with 10 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
index.html
View File

@ -1,19 +1,17 @@
<html>
<body>
<div id="app"></div>
<script type="text/javascript">
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<script src="https://unpkg.com/react@18/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
<script type="text/jsx">
const app = document.getElementById('app');
function addElem(element, contents, attrs = {}) {
const newElem = document.createElement(element);
newElem.appendChild(document.createTextNode(contents));
for(const [key, value] of Object.entries(attrs)) {
newElem.setAttribute(key, value);
}
app.appendChild(newElem);
}
addElem('h1', 'Fart man comes to town!');
addElem('p', 'Will this controversial figure finally cause the downfall of the town? Sally Smith from town center says that she can already smell trouble brewing but other members of the town beleave the imminent winds of change will revitalize the towns central business district.');
addElem('a', 'Read more...', {href: "#"});
const root = ReactDOM.createRoot(app);
root.render(<>
<h1>Fart man approaches...</h1>
<p>Will this controversial figure finally cause the downfall of the town? Sally Smith from town center says that she can already smell trouble brewing but other members of the town beleave the imminent winds of change will revitalize the towns central business district.</p>
<a href="#">Read more...</a>
</>);
</script>
</body>
</html>