MarcelCutts

{
  "id": 5,
  "description": "A lucite commemorating investment in Guildd",
  "external_url": "https://guildd.io",
  "image": "https://global-uploads.webflow.com/5fcc7c58bb24c57fabb2519a/5fcc80e1d6c18c75ea0d3e8c_logo-guildd.svg",
  "name": "PreSeed"
}

MarcelCutts

{
  "id": 4,
  "description": "A lucite commemorating investment in Guildd",
  "external_url": "https://guildd.io",
  "image": "https://global-uploads.webflow.com/5fcc7c58bb24c57fabb2519a/5fcc80e1d6c18c75ea0d3e8c_logo-guildd.svg",
  "name": "PreSeed"
}

MarcelCutts

{
  "id": 3,
  "description": "A lucite commemorating investment in Guildd",
  "external_url": "https://guildd.io",
  "image": "https://global-uploads.webflow.com/5fcc7c58bb24c57fabb2519a/5fcc80e1d6c18c75ea0d3e8c_logo-guildd.svg",
  "name": "PreSeed"
}

MarcelCutts

Guide to creating and reviewing a JavaScript PR.

JavaScript (JS) continues to devour an ever increasing portion of the software universe. It has a forgiving nature and few restrictions - allowing nearly anyone to get started with few requirements to understand complex programming concepts.

However, this trait becomes challenging when the need to manage the complexity of intricate JS applications arises, as those tools and paradigms aren’t baked into the language and standard toolchains. This leaves use leaning on tools and practices instead.

You’ll likely have to create and review JS as part of your day to day. Below is some guidance on what to look for in a PR and keeping master green.

Core concepts

MarcelCutts

let component = ReasonReact.statelessComponent("Blob");

type maxWidth = {
  small: string,
  large: string,
};

type typography = {
  light: int,
  bold: int,

MarcelCutts

type hoc = ReasonReact.reactClass => ReasonReact.reactClass;

module type CreateWithStateParams = {type state; let defaultValue: state;};

module CreateWithState = (Params: CreateWithStateParams) => {
  [@bs.module "recompose"]
  external withState : (string, string, Params.state) => hoc = "withState";
  type setState = Params.state => unit;

  type children =

MarcelCutts

Bundler investigation

Nested currently uses webpack as its bundler of choice for its front-end projects. This is a community norm, but has some drawbacks that lead to a strictly timeboxed investigation of an alternative.

Why investigate alternatives?

Webpack is best known for bundling JavaScript files, however it also has an extensive system for plugins, loaders, and general configuration that can make it an incredibly flexible tool.

Flexibility is not without cost, however, which primarily manifests in time required to understand and maintain the webpack configuration. As many engineers at Nested are still becoming comfortable in the modern front-end ecosystem, adding an understanding of webpack complexity removes time that could be spent developing features that deliver customer value.

This particular investigation sprung from spending time with the team reviewing a 21 day old PR to upgrade webpack from 3 to 4, which highlighted time invested in the tool.

MarcelCutts

TypeScript

TypeScript (TS) is a language that promises "JavaScript that scales". After running a number of investigationary projects, TS has been found lacking for a number of reasons that can be summarised in the following categories.

1. Configuration
2. Permissiveness
3. Strict mode
4. Lock-in
5. Progressive inclusion

MarcelCutts

export CC=clang CXX=clang CFLAGS="-g -O3 -fstack-protector" LDFLAGS="-fstack-protector" KERL_CONFIGURE_OPTIONS="--disable-hipe --enable-smp-support --enable-threads --enable-kernel-poll --enable-darwin-64bit --with-ssl=/usr/local/opt/openssl

MarcelCutts

Keybase proof

I hereby claim:

• I am marcelcutts on github.
• I am marcelc (https://keybase.io/marcelc) on keybase.
• I have a public key ASAOW2f941bqy_CBbdEcji1S_IXvA0fvOA9IsbVf3_WKwgo

To claim this, I am signing this object: