Skip to content

Instantly share code, notes, and snippets.

Rafael R rafaelrinaldi

Block or report user

Report or block rafaelrinaldi

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
robert-stuttaford / build.clj
Last active Aug 1, 2018
Basic nREPL / cljs compile / cljs repl / figwheel script for use with clj cli command: `clj build.clj TASK`
View build.clj
(require '[ :as api]
'[clojure.string :as string]
'[figwheel-sidecar.repl-api :as figwheel]
'[figwheel-sidecar.components.nrepl-server :as figwheel.nrepl])
(def source-dir "src")
(def compiler-config
{:main 'app.main
:output-to "target/app.js"
View 0

A series of posts on css-in-js

0. styles as objects

First, an exercise. Can we represent all of css with plain data? Let's try.

let redText = { color: 'red' };

Head Over Heels for Snapshot Testing

Tests are interesting, because you're trying to test code. But to write tests, you have to write code. Who tests the tests? For tests to be worth it you need to be sure that for each line of code you add, the value being added is more than the liability.

Value > Liability

Because belive me, tests are a liability. First, they are code that

View preact.go
// Package preact provides bindings to the preact library.
package preact
import ""
var preact = js.Global.Get("preact")
// Attrs of an element.
type Attrs map[string]interface{}
bendc / randomInterval.js
Created Mar 9, 2017
rAF-based random interval
View randomInterval.js
const randomInterval = (() => {
const random = (min, max) => Math.random() * (max - min) + min;
return (callback, min, max) => {
const time = {
total: random(min, max)
const tick = now => {
if ( <= now - time.start) {
time.start = now;
tkh44 / Animation.jsx
Last active Nov 3, 2019
react-router v4 animated with data-driven-motion
View Animation.jsx
import React from 'react'
import { BrowserRouter as Router, Route, Link, Redirect, matchPath } from 'react-router-dom'
import { Motion } from 'data-driven-motion' //
const WOBBLY_SPRING = { stiffness: 200, damping: 15, precision: 0.1 }
const AnimationExample = () => (
View App.js
import React, { Component } from 'react'
import logo from './logo.svg'
import './App.css'
import { Route, Link, Redirect } from './Zero'
const paths = [ 'one', 'two', 'three' ]
class App extends Component {
render() {
developit / components.js
Created Feb 22, 2017
vdom agnostic components
View components.js
import preact from 'preact';
import createFoo from './foo';
import createBar from './bar';
export const Foo = createFoo(preact);
export const Bar = createBar(preact);
madox2 / vim_eslint_fix.vim
Created Oct 12, 2016
Function which runs eslint --fix and saves the buffer. It is mapped to :W command
View vim_eslint_fix.vim
function ESLintFix()
silent execute "!./node_modules/.bin/eslint --fix %"
edit! %
command W call ESLintFix()


Batteries-included, minimal-configuration JS bundler

A hypothetical JavaScript bundler. bundle-js aims to be your one-stop-shop for everything in the JS frontend. Goals:

  • Batteries-included: you should be able to use bundle-js without any plugins or any fancy configuration.
  • Convention over configuration: there should be little need to configure bundle-js.
  • One dependency: no more dealing with webpack, loaders, babel, babel presets, babel plugins, and so on!
  • Extensible: it should still be possible to extend functionality if necessary.
You can’t perform that action at this time.