Skip to content

Instantly share code, notes, and snippets.

@JulianG
JulianG / createStrictContext.js
Created August 9, 2020 14:07
Create React Strict Context
import React from 'react';
export function createStrictContext(options = {}) {
const Context = React.createContext(undefined);
Context.displayName = options.name;
function useContext() {
const context = React.useContext(Context);
if (!context) {
throw new Error(options.errorMessage || `${name || ''} Context Provider is missing`);
}
@JulianG
JulianG / machine.js
Last active December 30, 2019 09:37
Generated by XState Viz: https://xstate.js.org/viz
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
@JulianG
JulianG / escape-the-mines.ts
Last active November 11, 2019 15:04
Daily Challenge #107 - Escape the Mines
// Daily Challenge #107 - Escape the Mines
// A poor miner is trapped in a mine and you have to help him to get out!
// The mine is completely dark so you have to tell him where to go.
// https://dev.to/thepracticaldev/daily-challenge-107-escape-the-mines-2036
// Based on: https://www.redblobgames.com/pathfinding/a-star/introduction.html
// by @redblobgames
@JulianG
JulianG / machine.js
Created October 6, 2019 20:39
Generated by XState Viz: https://xstate.js.org/viz
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
@JulianG
JulianG / ts-generics.md
Last active July 19, 2023 09:12
A use case for TypeScript Generics

A use case for TypeScript Generics

The following may be a bit obvious for some. But something just clicked in my head and I thought I'd write it down.

When generics are a good idea

Imagine we write a function that returns the "oldest" item in a set/array:

function getOldest(items: Array<{ age: number }>) {
@JulianG
JulianG / no-implicit-any.md
Last active July 19, 2019 06:31
Catching bugs with stricter TypeScript

Catching bugs with stricter TypeScript

We recently enabled "noImplicitAny" in a relatively old TypeScript project. It resulted in 269 new errors. Most of those were missing type annotations but in a few cases, we found problems with the code. These had been around for months and were not caught by our test suite.

TL;DR;

We should prefer strict TypeScript configurations to catch issues, not just at compile-time, but (with a good IDE) as we type.

We should try to keep up-to-date with TypeScript versions to benefit from the ever-improving error messages; saving development time.

@JulianG
JulianG / spread-vs-slice.md
Last active July 18, 2019 15:31
spread vs slice

DON'T DO THIS!

When working on legacy projects it may be tempting to go around changing

const myCopy = arr.slice();

with:

@JulianG
JulianG / testing-opinions.md
Last active February 27, 2019 14:06
Testing Opinions

Testing Opinions

⚠️ Warning! This article is highly opinionated.

It happens often at work that my colleagues and I discuss the best way or the proper way to test a specific React component. We don't always agree.

Testing the output of a function is not the same as testing its implementation details.

Avoid Testing Implementation Details

@JulianG
JulianG / introducing-bananatabs.md
Last active February 18, 2019 12:31
Introducing Banana Tabs!

Introducing Banana Tabs!

Has this ever happened to you?

You keep lots of tabs in a single window to the point where you can't tell what's what anymore.

too many tabs

Or worse: you try -like me- to group your tabs by task, or subject, or anything, and as a result you end up with too many windows instead:

@JulianG
JulianG / null-checking.md
Last active February 8, 2019 15:34
Null Checking in TypeScript

Null Checking in TypeScript

Following up on the previous gist about avoiding non-null-assertion operator I think it would be good to see some examples of null checking in TypeScript.

Assumming we're using TypeScript with --strictNullChecks, and that this is what a banana looks like:

type Banana = {
  id: number,
  open: () => void
};