thomasboyt

import moment from 'moment';

/**
 * XXX: Okay, so, no date library, other than moment, appears to currently
 * support _formatting a date with a specified time offset_. That is, given the
 * date string `2018-11-21T15:00:00+0100` (UTC+1:00), I want to format it as
 * `3:00 PM`, regardless of the system's current local time.
 *
 * This seems like it should be easy, right? We don't need time zone data,
 * because we're not specifying a time zone, just a UTC offset. All we need to

thomasboyt

so, let's say I have a "master/detail"-ish architecture, where my UI has a section for a specific user, and within that section is a page that shows that user's followers. it's at a route like /users/:username/followers.

in my component hierarchy, this works with something like

<FollowersPage>         <-- top level route component, matched by react-router
  <UserSectionWrapper>  <-- renders the outer wrapper for the user section
    <FollowersList />   <-- the inner content of the page
  </UserSectionWrapper>
</FollowersPage>

thomasboyt

import * as React from 'react';

import {ColorScheme} from '../../universal/resources';

interface Context {
  colorScheme: ColorScheme;
}

/**
 * Injects this.context.colorScheme as a prop

thomasboyt

Polymer({
    is: "google-legacy-loader",
    behaviors: [Polymer.IronJsonpLibraryBehavior],
    properties: {
        libraryUrl: {
            type: String,
            value: "https://www.google.com/jsapi?callback=%%callback%%"
        },
        notifyEvent: {
            type: String,

thomasboyt

redux "request" idea

(this is adapted from the redux-happy-async project I made earlier this year, but I think simplified in an easier-to-understand way)

Why?

Managing async action state in Redux is a very, very common topic of discussion. The classical way to do it is to create three action types (for start, error, and success), and then create boilerplate to set loading/error states for each action inside a reducer. This boilerplate adds up fast if you're creating an app with lots of async actions!

This library abstracts away this boilerplate with a ✨ magic ✨ requests reducer that will handle storing and retrieving this state across your application.

thomasboyt

interface PromiseExtender extends Promise<any> {
}

function bar(): PromiseExtender {
  return new Promise((resolve, reject) => {});
}

async function foo() {
  await bar(); // raises error: "Operand for 'await' does not have a valid callable 'then' member."
}

thomasboyt

> var a = [1,2,3]
undefined
> a.reverse()
[ 3, 2, 1 ]
> a
[ 3, 2, 1 ]

// [insert price is right losing horn here]

thomasboyt

Deployment Goals

1. Deploy static site frontend to somewhere that properly cache busts everything
2. Deploy Node.js WebSockets backend with to somewhere that will, long-term, give me the option to easily add a Redis instance
3. Connect frontend in (1) to (2)
4. Spend no less than like $10/month on this whole thing (excepting like a domain and DNS)

Candidates

My DigitalOcean VPS

thomasboyt

So, in my TypeScript library, I import a module and return a type from it in an exported function:

// myLib/src/index.ts
import * as SAT from 'sat';

export function getCollisionResponse(a: SAT.Polygon, b: SAT.Polygon): SAT.Response {
  const res = new SAT.Response();
  SAT.testPolygonPolygon(a, b, res);
 return res;

thomasboyt

const SixtyFps = React.createClass({
  componentDidMount() {
    this.rafCb = this.renderLoop;
    window.requestAnimationFrame(this._rafCb);
  },
  
  componentWillUnmount() {
    this.rafCb = () => {};
  },