Skip to content

Instantly share code, notes, and snippets.

View kpuputti's full-sized avatar

Kimmo Puputti kpuputti

73 followers · 72 following
View GitHub Profile
@kpuputti
kpuputti / gatsby.org
Last active October 19, 2018 08:22
Sharetribe Guild Hall presentation about GatsbyJS

Gatsby

“blazing fast modern site generator for React”

Background: The CMS problem

  • We really need CMSs
@kpuputti
kpuputti / withViewport.js
Created September 5, 2017 11:56
/**
* A higher order component (HOC) that provides the current viewport
* dimensions to the wrapped component as a `viewport` prop that has
* the shape `{ width: 600, height: 400}`.
*/
export const withViewport = Component => {
// The resize event is flooded when the browser is resized. We'll
// use a small timeout to throttle changing the viewport since it
// will trigger rerendering.
const WAIT_MS = 100;
@kpuputti
kpuputti / js.md
Last active February 24, 2016 12:53

Brief History of Frontend Tooling

A few years ago, when the Frontend developer tooling craze hadn't yet started, techniques for building and optimizing JavaScript applications varied. Many were using shell scripts (cat to concatenate files etc.), tools provided by the web framework (like Play Framework's templates), or some generic Java-based tools. There might have been some manual operations (especially around minifying for production builds), and most of the tooling was not JavaScript-based.

Then Frontend developers started to notice that it was really hard to reason about lots of files that each rely on some globals (making the inclusion order significant) and expose a "namespace" (global variable) for other files to use. Then came AMD (Asynchronous Module Definition), which enabled making modules that define their dependencies and that explicitly exposed their exports. AMD modules were used together with the require.js tool and the r.js optimizer. The A in AMD (asynchronous) was a clear design choi

@kpuputti
kpuputti / core.clj
Created December 5, 2015 21:33
AWS string parser.
(ns aws-parser.core
(:require [clojure.string :as str]))
(defn whitespace? [c]
(str/blank? (str c)))
;; STATES: :default :whitespace :quoted
(defn- handle-char [{:keys [state result]} c]
(cond
@kpuputti
kpuputti / promises.md
Created September 29, 2015 11:53
Promise patterns

Promise patterns in large JavaScript applications

  • understand the abstraction
    • understand then (fmap/monadic bind)
  • know the difference of deferred and promise
  • be sure not to swallow errors
    • either return or end chain
    • error in success handler ending the chain
  • resolve with a single value (jQuery...)
  • standard error object for rejecting
@kpuputti
kpuputti / js-next-steps.md
Created September 29, 2015 11:49
JS next steps

JavaScript projects

Packages and build process

Start simple, keep simple.

  • CommonJS modules
  • Browserify
  • npm run scripts
  • Makefile
@kpuputti
kpuputti / fold.js
Last active May 6, 2024 05:20
Functional acrobatics using folds in JavaScript.
/*eslint-env es6 */
// Inspired by the paper "A tutorial on the universality and
// expressiveness of fold" by Graham Hutton (available at
// http://www.cs.nott.ac.uk/~gmh/fold.pdf), implementing some generic
// list handling functions in JavaScript in terms of `fold`.
// Personally I had an enlightnening moment when I realised the
// beautiful interplay of cons lists and foldr during the FP101x
// Haskell course. JavaScript's syntax doesn't make this very apparent
@kpuputti
kpuputti / flowtest.ts
Created November 18, 2014 21:04
Testing Flow.
/* @flow */
function wait(time: number): Promise<string> {
return new Promise((resolve, reject) => {
setTimeout(resolve.bind(null, 'resolved in ' + time + 'ms'), time);
});
}
document.addEventListener('DOMContentLoaded', () => {
console.log('start');
@kpuputti
kpuputti / haskell.md
Created August 6, 2014 12:24
Haskell

Been studying a bit of Haskell during the previous (rather hectic) weeks. Learnings this far:

  • Proper type inference (vs. Scala etc.) is wonderful and removes all the pain that have turned me off from traditional statically typed langs before
  • Type classes and parametric polymorphism seems like a very good and natural idea, easy to understand (at least at face value) and very explicit without any big hassle (like the variance/covaricance/invariance things with subtyping)
  • Monadic IO etc. are not as hard as I thought it to be with some background knowledge
  • Curried functions with minimal function call syntax seem essential for proper FP-style programming (fn composition, point-free style, etc.)
  • JavaScript seems even more dangerous now, I want me some type safety

I've favored dynamically typed languages for years now, but especially the good type inference takes most of the pain away. Using immutable values, recursion, and strong types seems very natural to me now.

@kpuputti
kpuputti / sass-3.3.md
Last active December 25, 2015 21:09