dpraimeyuu

// 3D Dom viewer, copy-paste this into your console to visualise the DOM as a stack of solid blocks.
// You can also minify and save it as a bookmarklet (https://www.freecodecamp.org/news/what-are-bookmarklets/)
(() => {
  const SHOW_SIDES = false; // color sides of DOM nodes?
  const COLOR_SURFACE = true; // color tops of DOM nodes?
  const COLOR_RANDOM = false; // randomise color?
  const COLOR_HUE = 190; // hue in HSL (https://hslpicker.com)
  const MAX_ROTATION = 180; // set to 360 to rotate all the way round
  const THICKNESS = 20; // thickness of layers
  const DISTANCE = 10000; // ¯\\_(ツ)_/¯

dpraimeyuu

(*
An exercise in modeling. Users can be verified or banned. A user can be banned only if their username is "offensive".
Additionally, we model the "initial" state of created user which is "unverified". Such user should be a subject of a specific action,
doing a verification.

Model consists of two concepts:
    * user details - keeping all information about CRUD-ish information
    * user - implicitly denoting status, utilizes user details to satisfy business rules (at the moment of writing - only one)

Possibly those two could be separated, so that `UserDetails` could grow in details (e.g. getting new fields as email, address, etc.),

dpraimeyuu

Transcript from Outside-In TDD

• part 1
• part 2
• part 3
• Bank Kata

Part 1

dpraimeyuu

React - Functional error boundaries

Thanks to React hooks you have now happily turned all your classes into functional components.

Wait, all your components? Not quite. There is one thing that can still only be implemented using classes: Error boundaries.

There is just no functional equivalent for componentDidCatch and deriveStateFromError yet.

Proposed solution

dpraimeyuu

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Example",
      "type": "node",
      "request": "launch",
      "runtimeExecutable": "node",
      "runtimeArgs": ["--nolazy", "-r", "ts-node/register/transpile-only"],

dpraimeyuu

Architecture

• Use Onion architecture

  • Dependencies go inwards. That is, the Core domain doesn't know about outside layers

• Use pipeline model to implement workflows/use-cases/stories

  • Business logic makes decisions
  • IO does storage with minimal logic
  • Keep Business logic and IO separate

• Keep IO at edges

dpraimeyuu

{
    "version": "0.1.0",
    "command": "cmd",
    "args": [
        "/c"
    ],
    "showOutput": "always",
    "echoCommand": true,
    "tasks": [
        {

dpraimeyuu

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions

dpraimeyuu

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions

dpraimeyuu

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions