Commit 4319a92e authored by jnsone11's avatar jnsone11
Browse files

add lectures

parent ada4307f
/// <reference types="react" />
import { Component } from 'react';
declare class HelloComponent extends Component {
render(): JSX.Element;
}
export default HelloComponent;
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const React = require("react");
const react_1 = require("react");
class HelloComponent extends react_1.Component {
render() {
return React.createElement("div", null, "Hello!");
}
}
exports.default = HelloComponent;
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const React = require("react");
const react_dom_1 = require("react-dom");
const Hello_1 = require("./components/Hello");
const App = (React.createElement(Hello_1.default, null));
react_dom_1.hydrate(App, document.getElementById('react-root'));
{
"name": "01-react-typescript",
"version": "1.0.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
"@types/node": {
"version": "9.4.0",
"resolved": "https://registry.npmjs.org/@types/node/-/node-9.4.0.tgz",
"integrity": "sha512-zkYho6/4wZyX6o9UQ8rd0ReEaiEYNNCqYFIAACe2Tf9DrYlgzWW27OigYHnnztnnZQwVRpwWmZKegFmDpinIsA==",
"dev": true
},
"@types/react": {
"version": "16.0.36",
"resolved": "https://registry.npmjs.org/@types/react/-/react-16.0.36.tgz",
"integrity": "sha512-q33EVfy4i+fwhM31PL6/c6Job/DyjOiExHuR163bJK3rEMRf2ENkBrN4thQH5cwA+TiiN1vWDZU6D5H1AvQTlA==",
"dev": true
},
"@types/react-dom": {
"version": "16.0.3",
"resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-16.0.3.tgz",
"integrity": "sha512-xAvZiGhQlEhjStoKktoai8CelXVFBaSN6JX4vy1UQioRba3c2vum1TGzR0thHoEauZtIwzWg8mos0AHu2ne4jw==",
"dev": true,
"requires": {
"@types/node": "9.4.0",
"@types/react": "16.0.36"
}
},
"asap": {
"version": "2.0.6",
"resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
"integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY="
},
"core-js": {
"version": "1.2.7",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
"integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
},
"encoding": {
"version": "0.1.12",
"resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz",
"integrity": "sha1-U4tm8+5izRq1HsMjgp0flIDHS+s=",
"requires": {
"iconv-lite": "0.4.19"
}
},
"fbjs": {
"version": "0.8.16",
"resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.16.tgz",
"integrity": "sha1-XmdDL1UNxBtXK/VYR7ispk5TN9s=",
"requires": {
"core-js": "1.2.7",
"isomorphic-fetch": "2.2.1",
"loose-envify": "1.3.1",
"object-assign": "4.1.1",
"promise": "7.3.1",
"setimmediate": "1.0.5",
"ua-parser-js": "0.7.17"
}
},
"iconv-lite": {
"version": "0.4.19",
"resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.19.tgz",
"integrity": "sha512-oTZqweIP51xaGPI4uPa56/Pri/480R+mo7SeU+YETByQNhDG55ycFyNLIgta9vXhILrxXDmF7ZGhqZIcuN0gJQ=="
},
"is-stream": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
"integrity": "sha1-EtSj3U5o4Lec6428hBc66A2RykQ="
},
"isomorphic-fetch": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz",
"integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=",
"requires": {
"node-fetch": "1.7.3",
"whatwg-fetch": "2.0.3"
}
},
"js-tokens": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.2.tgz",
"integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls="
},
"loose-envify": {
"version": "1.3.1",
"resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.3.1.tgz",
"integrity": "sha1-0aitM/qc4OcT1l/dCsi3SNR4yEg=",
"requires": {
"js-tokens": "3.0.2"
}
},
"node-fetch": {
"version": "1.7.3",
"resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.3.tgz",
"integrity": "sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ==",
"requires": {
"encoding": "0.1.12",
"is-stream": "1.1.0"
}
},
"object-assign": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
"integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM="
},
"promise": {
"version": "7.3.1",
"resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
"integrity": "sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==",
"requires": {
"asap": "2.0.6"
}
},
"prop-types": {
"version": "15.6.0",
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.0.tgz",
"integrity": "sha1-zq8IMCL8RrSjX2nhPvda7Q1jmFY=",
"requires": {
"fbjs": "0.8.16",
"loose-envify": "1.3.1",
"object-assign": "4.1.1"
}
},
"react": {
"version": "16.2.0",
"resolved": "https://registry.npmjs.org/react/-/react-16.2.0.tgz",
"integrity": "sha512-ZmIomM7EE1DvPEnSFAHZn9Vs9zJl5A9H7el0EGTE6ZbW9FKe/14IYAlPbC8iH25YarEQxZL+E8VW7Mi7kfQrDQ==",
"requires": {
"fbjs": "0.8.16",
"loose-envify": "1.3.1",
"object-assign": "4.1.1",
"prop-types": "15.6.0"
}
},
"react-dom": {
"version": "16.2.0",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.2.0.tgz",
"integrity": "sha512-zpGAdwHVn9K0091d+hr+R0qrjoJ84cIBFL2uU60KvWBPfZ7LPSrfqviTxGHWN0sjPZb2hxWzMexwrvJdKePvjg==",
"requires": {
"fbjs": "0.8.16",
"loose-envify": "1.3.1",
"object-assign": "4.1.1",
"prop-types": "15.6.0"
}
},
"setimmediate": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz",
"integrity": "sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU="
},
"typescript": {
"version": "2.7.1",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-2.7.1.tgz",
"integrity": "sha512-bqB1yS6o9TNA9ZC/MJxM0FZzPnZdtHj0xWK/IZ5khzVqdpGul/R/EIiHRgFXlwTD7PSIaYVnGKq1QgMCu2mnqw=="
},
"ua-parser-js": {
"version": "0.7.17",
"resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.17.tgz",
"integrity": "sha512-uRdSdu1oA1rncCQL7sCj8vSyZkgtL7faaw9Tc9rZ3mGgraQ7+Pdx7w5mnOSF3gw9ZNG6oc+KXfkon3bKuROm0g=="
},
"whatwg-fetch": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-2.0.3.tgz",
"integrity": "sha1-nITsLc9oGH/wC8ZOEnS0QhduHIQ="
}
}
}
{
"name": "01-react-typescript",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"build": "node_modules/.bin/tsc",
"watch": "node_modules/.bin/tsc -w"
},
"author": "",
"license": "ISC",
"dependencies": {
"react": "^16.2.0",
"react-dom": "^16.2.0",
"typescript": "^2.7.1"
},
"devDependencies": {
"@types/react": "^16.0.36",
"@types/react-dom": "^16.0.3"
}
}
import * as React from 'react'
import {Component} from 'react'
class HelloComponent extends Component {
render(){
return <div>Hello!</div>
}
}
export default HelloComponent;
import * as React from 'react'
import {hydrate} from 'react-dom'
import Hello from './components/Hello'
const App = (
<Hello/>
);
hydrate(App,document.getElementById('react-root'))
\ No newline at end of file
{
"compilerOptions": {
"target": "es2016",
"module": "commonjs",
"jsx": "react",
"strict": true,
"outDir": "./dist",
"declaration": true,
"rootDir": "./src"
}
}
\ No newline at end of file
webpackJsonp([0],{
/***/ 19:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const React = __webpack_require__(0);
const react_dom_1 = __webpack_require__(22);
const Hello_1 = __webpack_require__(36);
const App = (React.createElement(Hello_1.default, null));
react_dom_1.hydrate(App, document.getElementById('react-root'));
;(function register() { /* react-hot-loader/webpack */ if (true) { if (typeof __REACT_HOT_LOADER__ === 'undefined') { return; } /* eslint-disable camelcase, no-undef */ var webpackExports = typeof __webpack_exports__ !== 'undefined' ? __webpack_exports__ : module.exports; /* eslint-enable camelcase, no-undef */ if (typeof webpackExports === 'function') { __REACT_HOT_LOADER__.register(webpackExports, 'module.exports', "/Users/jnsone11/repos/react-workshop/lectures/02-Webpack/src/client/client.tsx"); return; } /* eslint-disable no-restricted-syntax */ for (var key in webpackExports) { /* eslint-enable no-restricted-syntax */ if (!Object.prototype.hasOwnProperty.call(webpackExports, key)) { continue; } var namedExport = void 0; try { namedExport = webpackExports[key]; } catch (err) { continue; } __REACT_HOT_LOADER__.register(namedExport, key, "/Users/jnsone11/repos/react-workshop/lectures/02-Webpack/src/client/client.tsx"); } } })();
/***/ }),
/***/ 36:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const React = __webpack_require__(0);
const react_1 = __webpack_require__(0);
class HelloComponent extends react_1.Component {
render() {
return React.createElement("div", null, "Hello!");
}
}
exports.default = HelloComponent;
;(function register() { /* react-hot-loader/webpack */ if (true) { if (typeof __REACT_HOT_LOADER__ === 'undefined') { return; } /* eslint-disable camelcase, no-undef */ var webpackExports = typeof __webpack_exports__ !== 'undefined' ? __webpack_exports__ : module.exports; /* eslint-enable camelcase, no-undef */ if (typeof webpackExports === 'function') { __REACT_HOT_LOADER__.register(webpackExports, 'module.exports', "/Users/jnsone11/repos/react-workshop/lectures/02-Webpack/src/client/components/Hello.tsx"); return; } /* eslint-disable no-restricted-syntax */ for (var key in webpackExports) { /* eslint-enable no-restricted-syntax */ if (!Object.prototype.hasOwnProperty.call(webpackExports, key)) { continue; } var namedExport = void 0; try { namedExport = webpackExports[key]; } catch (err) { continue; } __REACT_HOT_LOADER__.register(namedExport, key, "/Users/jnsone11/repos/react-workshop/lectures/02-Webpack/src/client/components/Hello.tsx"); } } })();
/***/ }),
/***/ 8:
/***/ (function(module, exports, __webpack_require__) {
__webpack_require__(9);
module.exports = __webpack_require__(19);
/***/ })
},[8]);
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8vLi9zcmMvY2xpZW50L2NsaWVudC50c3giLCJ3ZWJwYWNrOi8vLy4vc3JjL2NsaWVudC9jb21wb25lbnRzL0hlbGxvLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7OztBQUFBLHFDQUE4QjtBQUM5Qiw0Q0FBaUM7QUFFakMsd0NBQXNDO0FBRXRDLE1BQU0sR0FBRyxHQUFHLENBQ1Isb0JBQUMsZUFBSyxPQUFFLENBQ1gsQ0FBQztBQUVGLG1CQUFPLENBQUMsR0FBRyxFQUFDLFFBQVEsQ0FBQyxjQUFjLENBQUMsWUFBWSxDQUFDLENBQUM7Ozs7Ozs7Ozs7Ozs7QUNUbEQscUNBQThCO0FBQzlCLHVDQUErQjtBQUUvQixvQkFBcUIsU0FBUSxpQkFBUztJQUNsQyxNQUFNO1FBQ0YsTUFBTSxDQUFDLDBDQUFpQjtJQUM1QixDQUFDO0NBQ0o7QUFFRCxrQkFBZSxjQUFjLENBQUMiLCJmaWxlIjoiY2xpZW50LmpzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0ICogYXMgUmVhY3QgZnJvbSAncmVhY3QnXG5pbXBvcnQge2h5ZHJhdGV9IGZyb20gJ3JlYWN0LWRvbSdcblxuaW1wb3J0IEhlbGxvIGZyb20gJy4vY29tcG9uZW50cy9IZWxsbydcblxuY29uc3QgQXBwID0gKFxuICAgIDxIZWxsby8+XG4pO1xuXG5oeWRyYXRlKEFwcCxkb2N1bWVudC5nZXRFbGVtZW50QnlJZCgncmVhY3Qtcm9vdCcpKVxuXG5cbi8vIFdFQlBBQ0sgRk9PVEVSIC8vXG4vLyAuL3NyYy9jbGllbnQvY2xpZW50LnRzeCIsImltcG9ydCAqIGFzIFJlYWN0IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHtDb21wb25lbnR9IGZyb20gJ3JlYWN0J1xuXG5jbGFzcyBIZWxsb0NvbXBvbmVudCBleHRlbmRzIENvbXBvbmVudCB7XG4gICAgcmVuZGVyKCl7XG4gICAgICAgIHJldHVybiA8ZGl2PkhlbGxvITwvZGl2PlxuICAgIH1cbn1cblxuZXhwb3J0IGRlZmF1bHQgSGVsbG9Db21wb25lbnQ7XG5cblxuXG4vLyBXRUJQQUNLIEZPT1RFUiAvL1xuLy8gLi9zcmMvY2xpZW50L2NvbXBvbmVudHMvSGVsbG8udHN4Il0sInNvdXJjZVJvb3QiOiIifQ==
\ No newline at end of file
This diff is collapsed.
/******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, {
/******/ configurable: false,
/******/ enumerable: true,
/******/ get: getter
/******/ });
/******/ }
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "";
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 1);
/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/***/ (function(module, exports) {
module.exports = require("webpack");
/***/ }),
/* 1 */
/***/ (function(module, exports, __webpack_require__) {
module.exports = __webpack_require__(2);
/***/ }),
/* 2 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const express = __webpack_require__(3);
const IS_PRODUCTION = process.env.NODE_ENV === 'production';
const PORT = 8081;
const HOST = 'localhost';
const server = express();
if (!IS_PRODUCTION) {
const webpackDevMiddleware = __webpack_require__(4);
const webpack = __webpack_require__(0);
const webpackConfig = __webpack_require__(5);
const compiler = webpack(webpackConfig);
server.use(webpackDevMiddleware(compiler, {
publicPath: "/",
noInfo: true
}));
server.use(__webpack_require__(12)(compiler));
}
else {
server.use('/', express.static('dist/client', {}));
}
server.get('*', (req, res) => {
res.status(200);
res.end(`<!DOCTYPE html>
<html>
<head>
<link rel="apple-touch-icon" sizes="57x57" href="/icon.png" />
</head>
<body>
<div id="react-root"></div>
<script type="text/javascript" src="/vendor.js"></script>
<script type="text/javascript" src="/client.js"></script>
</body>
</html>`);
});
server.listen(PORT, HOST, () => {
console.log(`listening on: ${HOST}:${PORT}`);
});
;(function register() { /* react-hot-loader/webpack */ if (process.env.NODE_ENV !== 'production') { if (typeof __REACT_HOT_LOADER__ === 'undefined') { return; } /* eslint-disable camelcase, no-undef */ var webpackExports = typeof __webpack_exports__ !== 'undefined' ? __webpack_exports__ : module.exports; /* eslint-enable camelcase, no-undef */ if (typeof webpackExports === 'function') { __REACT_HOT_LOADER__.register(webpackExports, 'module.exports', "/Users/jnsone11/repos/react-workshop/lectures/02-Webpack/src/server/server.tsx"); return; } /* eslint-disable no-restricted-syntax */ for (var key in webpackExports) { /* eslint-enable no-restricted-syntax */ if (!Object.prototype.hasOwnProperty.call(webpackExports, key)) { continue; } var namedExport = void 0; try { namedExport = webpackExports[key]; } catch (err) { continue; } __REACT_HOT_LOADER__.register(namedExport, key, "/Users/jnsone11/repos/react-workshop/lectures/02-Webpack/src/server/server.tsx"); } } })();
/***/ }),
/* 3 */
/***/ (function(module, exports) {
module.exports = require("express");
/***/ }),
/* 4 */
/***/ (function(module, exports) {
module.exports = require("webpack-dev-middleware");
/***/ }),
/* 5 */
/***/ (function(module, exports, __webpack_require__) {
/* WEBPACK VAR INJECTION */(function(__dirname) {const path = __webpack_require__(6);
const webpack = __webpack_require__(0);
const UglifyJSPlugin = __webpack_require__(7);
const ExtractTextPlugin = __webpack_require__(8);
const StatsWriterPlugin = __webpack_require__(9).StatsWriterPlugin;
const BundleAnalyzerPlugin = __webpack_require__(10).BundleAnalyzerPlugin;
const CompressionPlugin = __webpack_require__(11)
const IS_PRODUCTION = process.env.NODE_ENV === 'production';
console.log('IS_PRODUCTION: ', IS_PRODUCTION);
let plugins = [
new webpack
.optimize
.CommonsChunkPlugin({
name: 'vendor',
filename: 'vendor.js',
minChunks: function (module, count) {
return module.context && module
.context
.indexOf("node_modules") !== -1;
}
}),
new webpack.DefinePlugin({
'process.env': {
'NODE_ENV': IS_PRODUCTION ? JSON.stringify('production') : JSON.stringify('develop')
}
})
];
if (IS_PRODUCTION) {
plugins.push(new BundleAnalyzerPlugin({analyzerMode: 'static'}));
plugins.push(new webpack.optimize.AggressiveMergingPlugin());
plugins.push(new webpack.optimize.OccurrenceOrderPlugin());
plugins.push(new UglifyJSPlugin());
plugins.push(new webpack.LoaderOptionsPlugin({minimize: true, debug: false}));
plugins.push(new CompressionPlugin({
asset: "[path].gz[query]",
algorithm: "gzip",
test: /\.(js|html|css)$/,
threshold: 0,
minRatio: 0.8
}));
} else {
plugins.push(new webpack.HotModuleReplacementPlugin());
plugins.push(new webpack.NoEmitOnErrorsPlugin());
}
const loaders = IS_PRODUCTION
? [
{
loader: 'awesome-typescript-loader'
}
]
: [
{
loader: 'react-hot-loader/webpack'
}, {
loader: 'awesome-typescript-loader'
}
];
module.exports = {
entry: IS_PRODUCTION
? ['./src/client/client.tsx']
: [
'webpack-hot-middleware/client', './src/client/client.tsx'
],
output: {
filename: 'client.js',
path: path.resolve(__dirname, 'dist/client'),
publicPath: '/'
},
// Enable sourcemaps for debugging webpack's output.
devtool: IS_PRODUCTION ? "source-map" : "inline-source-map",
resolve: {
// Add '.ts' and '.tsx' as resolvable extensions.
extensions: [".ts", ".tsx", ".js", ".json"]
},
plugins,
module: {
rules: [
// All files with a '.ts' or '.tsx' extension will be handled by
// 'awesome-typescript-loader'.
{
test: /\.tsx?$/,
exclude: /(node_modules|bower_components)/,
use: loaders
},
// All output '.js' files will have any sourcemaps re-processed by
// 'source-map-loader'.
{
enforce: 'pre',
test: /\.js$/,
loader: "source-map-loader",
exclude: [/node_modules/, /build/, /__test__/]
}
]
}
};
/* WEBPACK VAR INJECTION */}.call(exports, "/"))
/***/ }),
/* 6 */
/***/ (function(module, exports) {
module.exports = require("path");
/***/ }),
/* 7 */
/***/ (function(module, exports) {
module.exports = require("uglifyjs-webpack-plugin");
/***/ }),
/* 8 */
/***/ (function(module, exports) {
module.exports = require("extract-text-webpack-plugin");
/***/ }),
/* 9 */
/***/ (function(module, exports) {
module.exports = require("webpack-stats-plugin");