jamonholmgren

This was a late-night forey into trying to improve on MobX-State-Tree's ergonomics and implementation.

MST is pretty good.

type MSTActions = {
    [key: string]: Function
}

type MSTViews = {

jamonholmgren

Advice to freelance React Native developers from Jamon

On-stream, February 28, 2022 (https://youtube.infinite.red)

• Network

• Get to know as many other React Native developers as you can
• Other developers are a great source of recommendations to potential clients • Let them know that you are available for work, and how much time you have, and what time period
• But don't be annoying
• "Hey Bob, hope things are good! Just letting you know I have availability starting March for 32 hours a week if you hear of anyone looking for a React Native freelancer. Really appreciate any referrals."

jamonholmgren

import { Maze } from "./maze";

const state = {
  x: 1,
  y: 1,
  destX: 1,
  destY: 1,
  path: []
};

jamonholmgren

import { Maze } from "./maze";

const state = {
  x: 1,
  y: 1,
  destX: 1,
  destY: 1,
  path: [[1, 2], [2, 2], [3, 2], [3, 1], [4, 1], [5, 1], [5, 2]]
};

jamonholmgren

import { Maze } from "./maze";

const state = {
  x: 1,
  y: 1,
  destX: 1,
  destY: 1,
  path: [[1, 2], [2, 2], [3, 2], [3, 1], [4, 1], [5, 1], [5, 2]]
};

jamonholmgren

  // did we find the destination?
  if (lowestCostNode.x === state.destX && lowestCostNode.y === state.destY) {
    // retrace our steps back to the beginning!
    function retrace(node, path) {
      // did we find the origin? if so, we're done!
      if (node.previous === undefined) return [node, ...path]
      // not yet ... let's keep retracing our steps
      return retrace(node.previous, [ node, ...path ])
    }
    // kick off the retracing!

jamonholmgren

function exploreNodes(nodes, exploredNodes) {
  if (nodes.length === 0) return

  // sort nodes by cost
  nodes.sort((a, b) => a.cost < b.cost ? -1 : 0)

  // remove the lowest cost node from the list
  const lowestCostNode = nodes.shift()

  // add it to the explored nodes

jamonholmgren

import { Maze } from "./maze";

const Main = document.createElement("main");
Object.assign(Main.style, {
  backgroundColor: "#602F6B",
  width: "600px",
  height: "600px",
  position: "relative"
});

jamonholmgren

function updateHamster() {
  Object.assign(hamster.style, {
    left: `${state.x * 30}px`,
    top: `${state.y * 30}px`,
    transitionDuration: "0.5s"
  });
}

jamonholmgren

const hamster = document.createElement("div");
Object.assign(hamster.style, {
  width: "30px",
  height: "30px",
  backgroundColor: "#b6102a",
  borderRadius: "15px",
  position: "absolute"
});
Main.appendChild(hamster);