Skip to content

Instantly share code, notes, and snippets.

View robphoenix's full-sized avatar
Design Systems 4 lyfe

Rob Phoenix robphoenix

Design Systems 4 lyfe
View GitHub Profile
alanbsmith /
Created October 19, 2022 23:14
Some brief styling thoughts

On CSS-in-JS


This is not an argument for or against any particular library or solution for styling UI. Instead I’d like to bring a bit of context and nuance to the conversation in a way that doesn’t add to the ongoing flame war.

First-Gen CSS-in-JS Wins

There are some things Emotion and Styled Components do very well, especially considering the styling landscape when they was created.

alanbsmith / Design Systems
Last active October 13, 2022 19:11
Design Systems Resources | A Primer

Design Systems Resources | A Primer

Design Systems

  • [Design Systems][1] by Alla Kholmatova - the canonical design systems book, in my opinion
  • [Expressive Design Systems][2] by Yesenia Perez-Cruz - a great follow-up to Kholmatova's book
  • [Atomic Design][3] by Brad Frost - written before we were using the term 'design system' for web interfaces, but many popular ideas extend from these ideas

Systems Thinking

utvk / gist:c1b22332fcbec037c357e2edcc1f3e42
Last active January 6, 2023 16:44
jscodeshift add type attribute to jsx buttons
module.exports = function(fi, api) {
var j = api.jscodeshift;
const hasNoTypeAttribute = function(path) {
return !path.value.openingElement.attributes.some(function(typePath) {
if ( !== 'type') {
return false;
return true;
s = status --short --branch --ignore-submodules=untracked
find = log --pretty=\"format:%Cgreen%H\n%s\n\n%b\" --name-status --grep
amend = commit --amend --no-edit
undo = reset HEAD~
upload = "!git push rakyll $(git rev-parse --abbrev-ref HEAD)"
prune = "!git co master && git branch --merged | grep -v '\\*' | xargs -n 1 git branch -d"
delete = branch -D
pr = "!git fetch origin pull/$1/head:pr$1"
sync = "!git pull -q -r origin master"
rosston / find-lodash-method.js
Last active January 9, 2024 20:22
jscodeshift "transform" to find uses of any lodash method
'use strict';
// Usage:
// jscodeshift -t find-lodash-method.js /path/to/dir/or/file --method-name=<lodash_method> [--min-args=<min_num_args>] [--chain-only=1]
// Prints all locations of matching uses of the lodash method (e.g., `map`).
// Function copied from
danidiaz / netrw.txt
Created October 7, 2016 20:57
Vim's netrw commands.
--- ----------------- ----
Map Quick Explanation Link
--- ----------------- ----
< <F1> Causes Netrw to issue help
<cr> Netrw will enter the directory or read the file |netrw-cr|
<del> Netrw will attempt to remove the file/directory |netrw-del|
<c-h> Edit file hiding list |netrw-ctrl-h|
<c-l> Causes Netrw to refresh the directory listing |netrw-ctrl-l|
<c-r> Browse using a gvim server |netrw-ctrl-r|
<c-tab> Shrink/expand a netrw/explore window |netrw-c-tab|
pauldambra / checkout-kata.exs
Created December 29, 2015 15:33
the checkout kata in elixir
defmodule Checkout do
defstruct [
basket: %{A: 0, B: 0, C: 0, D: 0}
def scan(checkout, code) do
new_value = checkout.basket[code] + 1
%{checkout | basket: Map.put(checkout.basket, code, new_value)}
ivanbatic / typescript-async-await-demo.ts
Last active January 12, 2021 21:55
Typescript async/await demo
"use strict";
class Cheese {
private state = "hard";
public async melt() {
return new Promise((resolve) => {
setTimeout(() => {
this.state = "melted";
jonathanpmartins /
Last active July 28, 2019 03:14
Install Libsodium on Ubuntu 14.04.3 LTS Trusty
sudo add-apt-repository ppa:chris-lea/libsodium;
sudo echo "deb trusty main" >> /etc/apt/sources.list;
sudo echo "deb-src trusty main" >> /etc/apt/sources.list;
sudo apt-get update && sudo apt-get install libsodium-dev;
kotakanbe / ipcalc.go
Created September 17, 2015 02:59
get all IP address from CIDR in golang
package main
import (
func Hosts(cidr string) ([]string, error) {