Skip to content

Instantly share code, notes, and snippets.

View andyjessop's full-sized avatar

Andy Jessop andyjessop

38 followers · 7 following
View GitHub Profile
@andyjessop
andyjessop / React state management with RxJS.md
Last active May 7, 2020 22:34
React state management with RxJS

This is an example of how to use RxJS to manage state within a React app.

  • The service exposes an emitter that emits the entire state whenever a change is made.
  • The React component then calls setState() with the new state.
  • The service is passed down via props so that child components can access mutator methods.
@andyjessop
andyjessop / README.md
Last active September 30, 2016 15:12

React/RxJS state management

@andyjessop
andyjessop / home.html
Created February 20, 2017 18:30
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US" dir="ltr"
xmlns:fb="http://ogp.me/ns/fb#" class="apple chrome user-logged-in">
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# game: http://ogp.me/ns/game#">
<meta http-equiv="P3P" href="/p3p.xml#policy" content='CP="ALL DSP COR LAW CURa ADMa DEVa TAIa OUR BUS IND ONL UNI COM NAV DEM CNT"' />
<meta charset="utf-8" />
<meta name="ROBOTS" content="NOODP" />
<meta name="ROBOTS" content="NOYDIR" />
<meta name="verify-v1" content="TgxixMKtxcQ+9NUdD7grKbzw3tAl3iJWlTPSPKt9t0I=" />
<meta name="p:domain_verify" content="314c7ba9469cc171a12a46b43e0e2aed" />
@andyjessop
andyjessop / best-move-usage.ts
Last active January 29, 2020 19:28
Engine API proposal
const { from, raw, san, to } = await engine.getBestMove(
fen,
{
engine: Engines.Komodo,
personality: Personalities.Aggressive,
strength: 5,
}
);
@andyjessop
andyjessop / simulator-proposal.md
Last active January 5, 2021 19:51

This is a plan of development for the simulator that will make it easier to extend incrementally, whilst keeping our core concepts of a decoupled, framework-agnostic code base.

First, the problems with the current setup for the client:

  1. Our layout is defined in HTML (well, pug), so we only have a single layout at the moment, and our elements service is tied tightly to that layout. This is fine for the simple page that we have currently, but is not flexible and makes multiple layouts or dynamic layouts difficult.
  2. We have all sorts of ideas for being able to record events, play them back, undo/redo, etc. for which a solely event-driven architecture is unsuited.

The classical solution to these, of course, is a monolithic state-driven framework like React or Vue, but those are unsuited to long-lived applications due to their vendor lock-in. cob was created to solve that and is working really well on vs-computer/vs-personalities, enabling us to write code that is not tied to a single framework

@andyjessop
andyjessop / express-app.ts
Last active December 31, 2021 14:10
import * as express from 'express';
import { Server } from 'http';
import { mathService } from './math-service';
import { CreateExpressApp } from './express-service';
export function createApp({ math }: { math: MathService }): CreateExpressApp<{ MathService }> {
const app = express();
let server: Server | null = null;
app.get('/api', async (req, res) => {
@andyjessop
andyjessop / strip-markdown
Created April 28, 2022 12:15
function stripMarkdown(md?: string, opts?: any) {
if (!md) {
return;
}
const options = opts || {};
options.listUnicodeChar = options.listUnicodeChar ? options.listUnicodeChar : false;
options.stripListLeaders = options.stripListLeaders ? options.stripListLeaders : true;
options.gfm = options.gfm ? options.gfm : true;
options.useImgAltText = options.useImgAltText ? options.useImgAltText : true;
@andyjessop
andyjessop / build-token-fields.ts
Last active August 30, 2022 15:08
A mocked service worker for Supabase auth
import { generateRandomId } from "@crux/string-utils"; // https://github.com/andyjessop/crux
export function buildTokenFields() {
return {
access_token: generateRandomId(),
token_type: "bearer",
expires_in: 604800,
refresh_token: generateRandomId(),
}
}
@andyjessop
andyjessop / slice.ts
Last active September 12, 2022 09:58
Slice config with async handlers
export function authModule(authHttpApi: Auth, toaster: Toaster) {
return createSlice('auth', {
// In order to update the state, return a new state just as in a normal reducer.
// [name]: (state: S, Payload | Action) => S
// But if you want to make side effects, just return an async function instead of the state.
// The async function is passed a context with the API of the current slice.
// [name]: (state: S, Payload | Action) => async ({ api }) => {
// ...side effects
@andyjessop
andyjessop / draggable.ts
Created October 25, 2022 15:10
Draggable directive
import { Directive, directive } from 'lit/directive.js';
import type { ElementPart, PartInfo } from 'lit/directive.js';
import { noChange } from 'lit';
export class Draggable extends Directive {
registered = false;
render({
id,
onDrag,