scottcorgan

/**
 * If have any hooks that use Remix hooks, this helper will save you headaches
 */

import { createRemixStub } from "@remix-run/testing";
import { renderHook } from "@testing-library/react";

const renderRemixHook = <T,>(callback: () => T) => {
  const RemixStub = ({ children }: PropsWithChildren) => {
    const Remix = createRemixStub([

scottcorgan

How to make VSCode work with Elm 0.18 again

With the update to Elm to 0.19, extensions in IDEs are going to start getting weird for 0.18. It's really hard to support to different versions of language. Because of this, I recently needed to figure out how to install a different version of an extension in VSCode (my IDE of choice). I am not quite ready to update all my code to Elm 0.19, so I want to make sure I still have the best experience in my IDE.

Some of the problems I was facing was no error/warning highlighting in the text editor, and no errors showing up in the output/problems panel.

Here are the steps to do that:

1. Remove current installation of vscode-elm from VSCode

scottcorgan

Storing Your App's State in the URL

I'm not the first person to think of this, but I thought I'd explore this really quickly. Is this a good idea? Probably not, but it is interesting as far as local and remote debuggability are concerned.

Normally, an app would need some special code to get 2 things we get for free when you store our app's state in the URL

1. Time travel debugging (state history)
2. Remote debugging (recreating a bad state from another user's data)

Let's take the following code as a rudimentary example of how to do this (here's a link to the working code http://jsbin.com/wituha/4/edit?js,output):

scottcorgan

const { execSync } = require('child_process')
const prompt = require('readline-sync')

const DAYS_OF_COMMITS = 30

try {
  const email = execSync('git config user.email').toString().split('\n')[0]
  const command = `git log --since=${DAYS_OF_COMMITS}.days --oneline --author="${email}"`
  const logs = execSync(command).toString().split('\n').filter(log => log !== '')

scottcorgan

const fs = require('fs')
const path = require('path')
const { promisify } = require('util')
const express = require('express')
const elmStaticHtml = require('elm-static-html-lib').default

const readFile = promisify(fs.readFile)
const app = express();

const pathToClient = path.resolve(__dirname, '../client/src')

scottcorgan

#!/usr/bin/env node
/* eslint-disable import/no-dynamic-require,global-require,no-return-assign */

const { resolve, join } = require('path');
const parseOpts = require('minimist');
const md5File = require('md5-file');
const fs = require('fs-extra');
const dependencyTree = require('dependency-tree');
const _ = require('lodash');
const tape = require('tape');

scottcorgan

function someFunction () {}
const someFunction = () => {}
const someFunction = function (){}

const someObject = {
  someFunction() {},
  someFunction: function (){},
  someFunction: () => {},
  someFunction
}

scottcorgan

-- HELP me make a type for this please!
-- The values should be able to be Css.rem, Css.px, etc., according to elm-css's types

defaultStyleGuide =
    { fontSize1 = (Css.rem 3)
    , fontSize2 = (Css.rem 2.25)
    , fontSize3 = (Css.rem 1.5)
    , fontSize4 = (Css.rem 1.25)
    , fontSize5 = (Css.rem 1)
    , fontSize6 = (Css.rem 0.875)

scottcorgan

@MyComponent =
  props: ['myProp']
  template: '<div>A custom component with {{myProp}}</div>'

scottcorgan

module Writeable exposing (..)


import Html.App as App
import Html exposing (..)
import Html.Attributes exposing (..)
import Html.Events exposing (..)
import Json.Decode
import Json.Encode