Skip to content

Instantly share code, notes, and snippets.

clicking; clacking;

Chris Zhou chrisrzhou

clicking; clacking;
View GitHub Profile

Main resource:

  • Typescript is a superset of Javascript. The type system in Typescript is designed to be optional so that your Javascript is Typescript. It does not block Javascript emit in the presence of type errors, allowing users to progressively update JS to TS.
  • Upgrading to TS without anyone noticing:
  • Migrating JS -> TS
    • Add a tsconfig.json.
    • Convert files from .js to .ts. Suppress errors using any.
    • Write new code in TS avoiding using any.
    • Go back to old code and start adding type annotations and fixing bugs.
    • Use ambient definitions for third party JS code.
chrisrzhou /
Last active Feb 25, 2020
Unified Search Spec
chrisrzhou / code1.js
Created Mar 21, 2019
React Hooks + Threejs
View code1.js
function useResponsiveCanvas<T>(
initialSize?: MinMaxPair,
): State {
const canvasRef = useRef<HTMLCanvasElement>();
const mountRef = useRef<HTMLDivElement>();
const [size, setSize] = useState<MinMaxPair>([0, 0]);
// set initial svg and size
useEffect(() => {
const canvas = document.createElement('canvas');
View react-threejs-globe.js
import React from 'react';
import * as THREE from 'three';
import OrbitControls from 'three-orbitcontrols';
export default class Scene extends React.Component {
static defaultProps = {
radius: 600,
create-react-app testapp
cd testapp

// dev flow
yarn start

// build flow
yarn build
cd build

Cryptography Notes

Stanford Class: Crypto I

What is Cryptography

  • Central Theorem: Anything that can be done with a trusted authority can also be done without.
    • Instead of passing inputs x1, x2, ..., xn to some Authority object, which then outputs the result f(x1, x2, ..., xn), the inputs themselves can talk to each other and output the same result f(x1, x2, ..., xn)
  • Crypto Magic
    • Privately outsourcing computation: e.g. Google can compute encrypted results E[result] of an encrypted query E[query] without every knowing the contents of query itself.
    • Zero knowledge (proof of knowledge): It is provable that you can give the solution of any puzzle to another person without giving the details of the solution itself. WTF???
  • Cryptography is a rigorous science with 3 key steps:
chrisrzhou /
Last active Sep 5, 2017
Useful/quality react libraries

Core Libraries in React Applications

  • react
  • react-redux
  • react-router
  • recompose
  • redux
  • react devtools (chrome)
  • redux devtools (chrome)
chrisrzhou / patterns.js
Created Aug 10, 2017
Flow + React patterns
View patterns.js
// basics
type TSimpleType = {
// prefer to name flow types with 'T*' syntax
stringProp: string,
nullableStringProp: ?string,
optionalStringProp?: string,
optionalAndNullableStringProp?: ?string,
type: 'a' | 'b' | 'c',
chrisrzhou /
Last active Nov 14, 2016
closure and module examples in JS (from


// no closure
for (var i=1; i<=5; i++) {
  setTimeout(() => {
    console.log(i);  // 6, 6, 6, 6, 6
  }, i*1000);