This commit is contained in:
tatianamac
2019-11-26 14:50:43 -08:00
parent 8a55660ed0
commit 6d5445ecc5
13894 changed files with 2233957 additions and 0 deletions

View File

@ -0,0 +1,35 @@
.hello-world {
margin: 200px 0;
font-size: 70px;
text-align: center;
}
.hello-world__i {
display: inline-block;
-webkit-animation: rotate 4000ms infinite linear;
animation: rotate 4000ms infinite linear;
}
@keyframes rotate {
from {
-webkit-transform: rotate(0);
transform: rotate(0);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes rotate {
from {
-webkit-transform: rotate(0);
transform: rotate(0);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}

View File

@ -0,0 +1,16 @@
<!doctype html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Browsersync, Webpack + React Hot Loader Example</title>
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<h1>Browsersync, Webpack + React Hot Loader Example</h1>
<div id="react-root"></div>
<script src="js/bundle.js"></script>
</body>
</html>

View File

@ -0,0 +1,14 @@
import React, { Component } from 'react';
export default class HelloWorld extends Component {
render() {
// Play with it...
const name = 'World';
return (
<h2 className="hello-world">
<span className="hello-world__i">Hello, {name}</span>
</h2>
);
}
}

View File

@ -0,0 +1,7 @@
import React from 'react';
import { render } from 'react-dom';
// It's important to not define HelloWorld component right in this file
// because in that case it will do full page reload on change
import HelloWorld from './HelloWorld.jsx';
render(<HelloWorld />, document.getElementById('react-root'));