Skip to content

Instantly share code, notes, and snippets.

@jmmarco

jmmarco/App.js

Created February 19, 2020 13:02
Show Gist options
  • Star 3 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jmmarco/3e7c4621d4ffc9d5bcf0c1e94a609dbf to your computer and use it in GitHub Desktop.
Save jmmarco/3e7c4621d4ffc9d5bcf0c1e94a609dbf to your computer and use it in GitHub Desktop.
Download ZIP
Add React to a Website with ES6 Capabilities
Raw
App.js
import Header from "./Header"
const App = () => {
return (
<div>
<Header />
</div>
)
}
export default App
ReactDOM.render(<App />, document.getElementById('root'))
Raw
Header.js
const Header = () => {
return (
<header>
<h1>Hi this header! Awesome? Yes, of course!</h1>
</header>
)
}
export default Header
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Basic React</title>
<script src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
</head>
<body>
<div id="root"></div>
<script data-plugins="transform-es2015-modules-umd" type="text/babel" src="./Header.js"></script>
<script data-plugins="transform-es2015-modules-umd" type="text/babel" src="./App.js"></script>
</body>
</html>
@jmmarco
Copy link
Author

jmmarco commented Feb 19, 2020 •
edited

Run project locally using a lightweight server like http-server:

npx http-server

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment