Skip to content

Instantly share code, notes, and snippets.

Avatar
💫

Cheng Lou chenglou

💫
View GitHub Profile
@chenglou
chenglou / classnames.md
Created Mar 14, 2021
interpolation classnames
View classnames.md

(+) infix operator

Before:

Cn.("one" + "two" + "three")

After:

`one two three`

append

@chenglou
chenglou / code.re
Last active Jul 18, 2021
Recommended way to do HTTP requests in ReScript
View code.re
// bindings can be isolated/upstreamed. I'm inlining it just for the example
type request;
type response;
[@bs.new] external makeXMLHttpRequest: unit => request = "XMLHttpRequest";
[@bs.send] external addEventListener: (request, string, unit => unit) => unit = "addEventListener";
[@bs.get] external response: request => response = "response";
[@bs.send] external open_: (request, string, string) => unit = "open";
[@bs.send] external send: request => unit = "send";
[@bs.send] external abort: request => unit = "abort";
// =========
View FetchedDogPictures.re
// This is a proper alternative to
// https://github.com/BuckleScript/bucklescript/blob/b9508105b1a35537bdea9a1fabd10f6c65f776b4/jscomp/bsb/templates/react-hooks/src/FetchedDogPictures/FetchedDogPictures.re#L14
// The one in that file uses Promise, but that's *wrong*.
// We only used promise as a demo of its API. We'll remove it soon.
// As you can see below, the pure XMLHttpRequest code is just as clean,
// less mysterious for all, more performant, extensible, and actually correct.
// Ignore these externals for now. They're just for illustration
// purposes. I just copy pasted the Js code from
View test.re
open Result
open TopTypes
open Infix
let extend = (obj, items) => Json.obj(obj) |?>> current => Json.Object(current @ items)
let log = Log.log
let maybeHash = (h, k) => if Hashtbl.mem(h, k) { Some(Hashtbl.find(h, k)) } else { None }
View foo.md
title
Reason 3.2.0

This release is best used in conjunction with upgrading your project to bs-platform 3.1.4.

Rejoice! The release you've all been waiting for. This fixes bring three major quality-of-life improvements when using Reason's formatter, refmt.

Foo

View proposal.re
reducer: {
| Edit => (state) => ReasonReact.Update({...state, editText: todo.title})
| Submit => submitHelper
| Change(text) =>
(state) =>
editing ?
ReasonReact.Update({...state, editText: text}) :
ReasonReact.NoUpdate
| KeyDown(27) =>
/* escape key */
@chenglou
chenglou / batching.md
Last active Dec 16, 2017
Getting batched re-rerendering back
View batching.md

Problem Setup

Assuming JS (this transfers to ReasonReact too): owner renders <Child onClick={this.onClick} />. Child renders <div onClick={this.onClick} />.

Upon div DOM click event:

  • Child's onClick is called, sets its state for whatever purpose, then call this.props.onClick (from owner)
  • Child re-renders following setState
  • Owner's onClick sets owner's own state for whatever purpose
  • Owner re-renders following setState
  • Owner re-render causes Child to re-render again
@chenglou
chenglou / alternative1.re
Last active Sep 7, 2017
Revised syntax labelled function argument. **The only difference is between ~ and :**
View alternative1.re
/* == definition == */
/* two labelled arguments, one unlabelled */
let display = (~message, ~person, time) => 1;
/* with default value */
let display = (~message="hello", ~person="Reason", time) => 1;
/* with type annotation */
let display = (~message: string, ~person: string, time: float) => 1;
/* type annoation and with default */
let display = (~message: string="hello", ~person: string="Reason", time: float) => 1;
@chenglou
chenglou / .zshrc
Created Aug 31, 2017
Auto-fu installation instructions
View .zshrc
# npm/make/brew autocompletions are super slow. Disable them so that auto-fu's
# completion doesn't trigger for these
noopt() {}
compdef noopt npm
compdef noopt make
compdef noopt brew
# Fork with cleaned-up readme:
# https://github.com/HerringtonDarkholme/auto-fu.zsh
View template-function-syntax.re
/* Template for proposals to update the syntax. Base template: https://gist.github.com/jordwalke/6935739b74eb9b8496670cc7860f5acf */
let a = 10;
let b = 20;
/* A */
let nonNamed = (a, b) => a + b;
type nonNamed = (int, int) => int;