adding back docs

This commit is contained in:
Ken
2019-02-22 20:25:09 -08:00
parent 78368cdf39
commit f70417f6ae
166 changed files with 4344 additions and 516 deletions

View File

@@ -0,0 +1,6 @@
<!DOCTYPE html>
<html>
<body>
<div id="app"></div>
<script src="../../step1-04/final/step1-04/final.js"></script></body>
</html>

View File

@@ -6,7 +6,8 @@ export class App extends React.Component {
return (
<div>
<h2>My App</h2>
<Counter start={2} />
<Counter text="Chickens" />
<Counter text="Ducks" />
</div>
);
}

View File

@@ -1,4 +1,5 @@
.Button {
display: block;
background: #0078d4;
color: white;
padding: 5px 10px;

View File

@@ -0,0 +1,25 @@
import React from 'react';
import { Button } from './Button';
export class Counter extends React.Component<any, any> {
constructor(props) {
super(props);
this.state = {
counter: 0
};
}
render() {
const { counter } = this.state;
const { text } = this.props;
return (
<div>
{text}: {counter}
<Button onClick={this._onButtonCLick}>Click</Button>
</div>
);
}
_onButtonCLick = () => {
this.setState({ counter: this.state.counter + 1 });
};
}

View File

@@ -0,0 +1,4 @@
import React from 'react';
import ReactDOM from 'react-dom';
import { App } from './App';
ReactDOM.render(<App />, document.getElementById('app'));

View File

@@ -81,19 +81,19 @@
/******/
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = "./step1-04/src/index.tsx");
/******/ return __webpack_require__(__webpack_require__.s = "./step1-04/final/src/index.tsx");
/******/ })
/************************************************************************/
/******/ ({
/***/ "./node_modules/css-loader/dist/cjs.js!./step1-04/src/components/Button.css":
/*!**********************************************************************************!*\
!*** ./node_modules/css-loader/dist/cjs.js!./step1-04/src/components/Button.css ***!
\**********************************************************************************/
/***/ "./node_modules/css-loader/dist/cjs.js!./step1-04/final/src/components/Button.css":
/*!****************************************************************************************!*\
!*** ./node_modules/css-loader/dist/cjs.js!./step1-04/final/src/components/Button.css ***!
\****************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
eval("exports = module.exports = __webpack_require__(/*! ../../../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\")(false);\n// Module\nexports.push([module.i, \".Button {\\n background: #0078d4;\\n color: white;\\n padding: 5px 10px;\\n outline: none;\\n border: none;\\n}\\n.Button:hover {\\n background: #005a9e;\\n}\\n\\n.Button:active {\\n background: #004578;\\n}\\n\", \"\"]);\n\n\n\n//# sourceURL=webpack:///./step1-04/src/components/Button.css?./node_modules/css-loader/dist/cjs.js");
eval("exports = module.exports = __webpack_require__(/*! ../../../../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\")(false);\n// Module\nexports.push([module.i, \".Button {\\n display: block;\\n background: #0078d4;\\n color: white;\\n padding: 5px 10px;\\n outline: none;\\n border: none;\\n}\\n.Button:hover {\\n background: #005a9e;\\n}\\n\\n.Button:active {\\n background: #004578;\\n}\\n\", \"\"]);\n\n\n\n//# sourceURL=webpack:///./step1-04/final/src/components/Button.css?./node_modules/css-loader/dist/cjs.js");
/***/ }),
@@ -274,62 +274,62 @@ eval("var g;\n\n// This works in non-strict mode\ng = (function() {\n\treturn th
/***/ }),
/***/ "./step1-04/src/App.tsx":
/*!******************************!*\
!*** ./step1-04/src/App.tsx ***!
\******************************/
/***/ "./step1-04/final/src/App.tsx":
/*!************************************!*\
!*** ./step1-04/final/src/App.tsx ***!
\************************************/
/*! exports provided: App */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"App\", function() { return App; });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _components_Counter__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./components/Counter */ \"./step1-04/src/components/Counter.tsx\");\nvar __extends = (undefined && undefined.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n\n\nvar App = /** @class */ (function (_super) {\n __extends(App, _super);\n function App() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n App.prototype.render = function () {\n return (react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"div\", null,\n react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"h2\", null, \"My App\"),\n react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Counter__WEBPACK_IMPORTED_MODULE_1__[\"Counter\"], { start: 2 })));\n };\n return App;\n}(react__WEBPACK_IMPORTED_MODULE_0___default.a.Component));\n\n\n\n//# sourceURL=webpack:///./step1-04/src/App.tsx?");
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"App\", function() { return App; });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _components_Counter__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./components/Counter */ \"./step1-04/final/src/components/Counter.tsx\");\nvar __extends = (undefined && undefined.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n\n\nvar App = /** @class */ (function (_super) {\n __extends(App, _super);\n function App() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n App.prototype.render = function () {\n return (react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"div\", null,\n react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"h2\", null, \"My App\"),\n react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Counter__WEBPACK_IMPORTED_MODULE_1__[\"Counter\"], { text: \"Chickens\" }),\n react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_Counter__WEBPACK_IMPORTED_MODULE_1__[\"Counter\"], { text: \"Ducks\" })));\n };\n return App;\n}(react__WEBPACK_IMPORTED_MODULE_0___default.a.Component));\n\n\n\n//# sourceURL=webpack:///./step1-04/final/src/App.tsx?");
/***/ }),
/***/ "./step1-04/src/components/Button.css":
/*!********************************************!*\
!*** ./step1-04/src/components/Button.css ***!
\********************************************/
/***/ "./step1-04/final/src/components/Button.css":
/*!**************************************************!*\
!*** ./step1-04/final/src/components/Button.css ***!
\**************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
eval("\nvar content = __webpack_require__(/*! !../../../node_modules/css-loader/dist/cjs.js!./Button.css */ \"./node_modules/css-loader/dist/cjs.js!./step1-04/src/components/Button.css\");\n\nif(typeof content === 'string') content = [[module.i, content, '']];\n\nvar transform;\nvar insertInto;\n\n\n\nvar options = {\"hmr\":true}\n\noptions.transform = transform\noptions.insertInto = undefined;\n\nvar update = __webpack_require__(/*! ../../../node_modules/style-loader/lib/addStyles.js */ \"./node_modules/style-loader/lib/addStyles.js\")(content, options);\n\nif(content.locals) module.exports = content.locals;\n\nif(false) {}\n\n//# sourceURL=webpack:///./step1-04/src/components/Button.css?");
eval("\nvar content = __webpack_require__(/*! !../../../../node_modules/css-loader/dist/cjs.js!./Button.css */ \"./node_modules/css-loader/dist/cjs.js!./step1-04/final/src/components/Button.css\");\n\nif(typeof content === 'string') content = [[module.i, content, '']];\n\nvar transform;\nvar insertInto;\n\n\n\nvar options = {\"hmr\":true}\n\noptions.transform = transform\noptions.insertInto = undefined;\n\nvar update = __webpack_require__(/*! ../../../../node_modules/style-loader/lib/addStyles.js */ \"./node_modules/style-loader/lib/addStyles.js\")(content, options);\n\nif(content.locals) module.exports = content.locals;\n\nif(false) {}\n\n//# sourceURL=webpack:///./step1-04/final/src/components/Button.css?");
/***/ }),
/***/ "./step1-04/src/components/Button.tsx":
/*!********************************************!*\
!*** ./step1-04/src/components/Button.tsx ***!
\********************************************/
/***/ "./step1-04/final/src/components/Button.tsx":
/*!**************************************************!*\
!*** ./step1-04/final/src/components/Button.tsx ***!
\**************************************************/
/*! exports provided: Button */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"Button\", function() { return Button; });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _Button_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Button.css */ \"./step1-04/src/components/Button.css\");\n/* harmony import */ var _Button_css__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_Button_css__WEBPACK_IMPORTED_MODULE_1__);\n\n\nvar Button = function (props) {\n return (react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"button\", { className: \"Button\", onClick: props.onClick }, props.children));\n};\n\n\n//# sourceURL=webpack:///./step1-04/src/components/Button.tsx?");
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"Button\", function() { return Button; });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _Button_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Button.css */ \"./step1-04/final/src/components/Button.css\");\n/* harmony import */ var _Button_css__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_Button_css__WEBPACK_IMPORTED_MODULE_1__);\n\n\nvar Button = function (props) {\n return (react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"button\", { className: \"Button\", onClick: props.onClick }, props.children));\n};\n\n\n//# sourceURL=webpack:///./step1-04/final/src/components/Button.tsx?");
/***/ }),
/***/ "./step1-04/src/components/Counter.tsx":
/*!*********************************************!*\
!*** ./step1-04/src/components/Counter.tsx ***!
\*********************************************/
/***/ "./step1-04/final/src/components/Counter.tsx":
/*!***************************************************!*\
!*** ./step1-04/final/src/components/Counter.tsx ***!
\***************************************************/
/*! exports provided: Counter */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"Counter\", function() { return Counter; });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Button */ \"./step1-04/src/components/Button.tsx\");\nvar __extends = (undefined && undefined.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n\n\nvar Counter = /** @class */ (function (_super) {\n __extends(Counter, _super);\n function Counter(props) {\n var _this = _super.call(this, props) || this;\n _this.state = {\n counter: props.start\n };\n return _this;\n }\n Counter.prototype.render = function () {\n var _this = this;\n return (react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"div\", null,\n react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"span\", null,\n \" \",\n this.state.counter,\n \" \"),\n react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_1__[\"Button\"], { onClick: function () {\n _this.setState({ counter: _this.state.counter + 1 });\n } }, \"Click Me\")));\n };\n return Counter;\n}(react__WEBPACK_IMPORTED_MODULE_0___default.a.Component));\n\n\n\n//# sourceURL=webpack:///./step1-04/src/components/Counter.tsx?");
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"Counter\", function() { return Counter; });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Button */ \"./step1-04/final/src/components/Button.tsx\");\nvar __extends = (undefined && undefined.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n\n\nvar Counter = /** @class */ (function (_super) {\n __extends(Counter, _super);\n function Counter(props) {\n var _this = _super.call(this, props) || this;\n _this._onButtonCLick = function () {\n _this.setState({ counter: _this.state.counter + 1 });\n };\n _this.state = {\n counter: 0\n };\n return _this;\n }\n Counter.prototype.render = function () {\n var counter = this.state.counter;\n var text = this.props.text;\n return (react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"div\", null,\n text,\n \": \",\n counter,\n react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_1__[\"Button\"], { onClick: this._onButtonCLick }, \"Click\")));\n };\n return Counter;\n}(react__WEBPACK_IMPORTED_MODULE_0___default.a.Component));\n\n\n\n//# sourceURL=webpack:///./step1-04/final/src/components/Counter.tsx?");
/***/ }),
/***/ "./step1-04/src/index.tsx":
/*!********************************!*\
!*** ./step1-04/src/index.tsx ***!
\********************************/
/***/ "./step1-04/final/src/index.tsx":
/*!**************************************!*\
!*** ./step1-04/final/src/index.tsx ***!
\**************************************/
/*! no exports provided */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"./node_modules/react-dom/index.js\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _App__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./App */ \"./step1-04/src/App.tsx\");\n\n\n\nreact_dom__WEBPACK_IMPORTED_MODULE_1___default.a.render(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_App__WEBPACK_IMPORTED_MODULE_2__[\"App\"], null), document.getElementById(\"app\"));\n\n\n//# sourceURL=webpack:///./step1-04/src/index.tsx?");
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"./node_modules/react-dom/index.js\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _App__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./App */ \"./step1-04/final/src/App.tsx\");\n\n\n\nreact_dom__WEBPACK_IMPORTED_MODULE_1___default.a.render(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_App__WEBPACK_IMPORTED_MODULE_2__[\"App\"], null), document.getElementById('app'));\n\n\n//# sourceURL=webpack:///./step1-04/final/src/index.tsx?");
/***/ })

View File

@@ -1,8 +0,0 @@
<!DOCTYPE html>
<html>
<body>
<div id="app"></div>
<script type="text/javascript" src="../step1-04/step1-04.js"></script></body>
</html>

View File

@@ -1,25 +0,0 @@
import React from 'react';
import { Button } from './Button';
export class Counter extends React.Component<any, any> {
constructor(props) {
super(props);
this.state = {
counter: props.start
};
}
render() {
return (
<div>
<span> {this.state.counter} </span>
<Button
onClick={() => {
this.setState({ counter: this.state.counter + 1 });
}}
>
Click Me
</Button>
</div>
);
}
}

View File

@@ -1,4 +0,0 @@
import React from "react";
import ReactDOM from "react-dom";
import { App } from "./App";
ReactDOM.render(<App />, document.getElementById("app"));