React starter with 9 lines html
Koutaro Chikuba
Posted on June 18, 2018
Save this code as index.html and open by your (modern) browser.
<div id=root />
<script type=module>
import React from 'https://dev.jspm.io/react@16'
import ReactDOM from 'https://dev.jspm.io/react-dom@16'
ReactDOM.render(
React.createElement('h1', null, 'hello'),
document.querySelector('#root')
)
</script>
Enjoy!
How it works
- This is shorthand html file without
<html>,<body>and so on. Just<div id=root>exists. -
<script type=module>means this code scope can use native ES Modules. - Import react and react-dom from
jspm.io. jspm.io is ES Module's age CDN for develop only (yet). -
ReactDOM.renderrendersReact.createElement('h1', null, 'hello'), it means<h1>hello</h1>with jsx, to<div id=root />
I like hyperscript syntax so I often use const $ = React.createElement
💖 💪 🙅 🚩
Koutaro Chikuba
Posted on June 18, 2018
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
programming Mastering JavaScript: Unleash the Power of Functional Reactive Programming with Higher-Order Streams
November 29, 2024