View docker-compose.yml
version: '3'
driver: bridge
# gaia-postgres:
# container_name: gaia-postgres
# image: postgres:latest

There's nothing great or particularly amazing about Angular and its build processes.

Everything Angular does is fighting against its own architectural decisions. On a high level it's like this:

  • We write in Typescript, we need to compile to Javascript
  • Typescript cannot compile our templates because they are custom templates
  • We need to compile templates
  • Typescript compiler barfs at some of our code, we need to fix the code, or the compiler, or both, or hack in between them
  • The resulting Javascript is hundreds of kilobytes larger than any competition.
  • We need to somehow reduce the size
View webpack.config.js
module.exports = {
devtool: 'source-map',
entry: ['./src/index.tsx'],
output: {
filename: 'bundle.js',
path: __dirname + '/dist/'
module: {
rules: [
View webpack.config.js
* TypeScript runs separately, not through loader, and outputs compiled files to
* .build_cache
var path = require('path')
var webpack = require('webpack')
var HtmlWebpackPlugin = require('html-webpack-plugin')
var InlineManifestWebpackPlugin = require('inline-manifest-webpack-plugin')
View defer.ts
let deferreds = {} as { [key : string] : any[] }
let deferred_timers = {} as { [key : string] : number }
* If you're waiting wor a `window.something`, and are not sure when it
* will appear (for example, you defer async load it), you can do the following:
* defer('something', (something) => ...)
* You can also check nested props:
type any = Js.t {.};
type key =
| String string
| Int int;
type hero = {id: string};
type attach_data = Js.t {. placeholder : option any, real : option string}; /* TODO */
View извращения точка жэ эс парт тво.md
<div class="toast toast-success" id='status-color'>
  <button class="btn btn-clear float-right" id='start-stop-button'>START!</button>
  <span id='status-text'>Retrieving status...</span>
View package.json
"devDependencies": {
"@types/jasmine": "2.5.43",
"@types/jquery": "2.0.40",
"@types/react": "15.0.12",
"@types/react-dom": "0.14.23",
"@types/router5": "0.0.28",
"autoprefixer-stylus": "0.13.0",
"babel-core": "6.23.1",
"babel-loader": "6.2.10",
View webpack.config.js
var path = require('path');
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var InlineManifestWebpackPlugin = require('inline-manifest-webpack-plugin');
// var BabiliPlugin = require('babili-webpack-plugin');
var paths = {
src: path.join(__dirname, '.build_cache'),
entry: path.join(__dirname, '.build_cache', 'app', 'index.js'),
profile: path.join(__dirname, '.build_cache', 'app', 'profile.js'),

Lose-lose situation with Web Components.

Polymer is the leading implementation of Web Components and functionality on top of Web Components.

If this is Web Components spec, it's horrible. Lose

    <div>[[name.first]] [[name.last]]</div>