Skip to content

Instantly share code, notes, and snippets.

@ianmcnally
ianmcnally / snake-to-camel-object-keys.js
Last active May 8, 2024 14:31
Snake to camel case object keys in javascript
function snakeToCamelObjectKeys(obj) {
return Object.keys(obj).reduce((output, key) => {
let value = obj[key]
const isObject = value.toString() === '[object Object]'
if (isObject) {
value = snakeToCamelObjectKeys(value)
}
const newKey = key.replace(/_(\w)/g, (match, $1) => $1.toUpperCase())
@ianmcnally
ianmcnally / ssr-react-with-hooks-and-hoc.js
Last active May 9, 2021 09:44
Server rendering React component that fetch data
const React = require('react')
const ReactDomServer = require('react-dom/server')
const fetch = require('node-fetch')
function App(props) {
const { repos } = props
return React.createElement('p', {
children: repos.length ? repos[0].name : 'no name',
})
@ianmcnally
ianmcnally / grid-auto-placement-polyfill.js
Last active February 24, 2019 11:21
Grid auto placement polyfill
import { columns, display, gridSpans, margin } from './css-modules-styles'
const COLUMNS = 12
const toArray = arrayLike => Array.prototype.slice.call(arrayLike)
const placeItemsOnGrid = grid => {
const withGutters = grid.classList.contains(columns.withGutters)
let currentColumnSpansInRow = 0
let currentRow = 1
@ianmcnally
ianmcnally / lazy-image.js
Last active May 15, 2021 22:14
Lazy image loading
//@flow
import React, { Component } from 'react'
import type { ElementRef } from 'react'
type Props = { src: string, alt: string }
type State = { source?: string }
export default class LazyImage extends Component<Props, State> {
state = {}
@ianmcnally
ianmcnally / mock-css-modules-for-jest.js
Last active June 5, 2018 14:56
Mocks a directory of css files with a css-modules like object
const { parse } = require('css')
const { readdirSync, readFileSync } = require('fs')
const { basename, extname, resolve } = require('path')
const camel = require('lodash.camelcase')
const baseNameForCSSFile = filename => basename(filename, '.css')
const isAClassSelector = selector => /^\./.test(selector)
const removeLeadingDotAndTrailingSelectors = selector =>
@ianmcnally
ianmcnally / .eslintrc
Last active June 27, 2016 21:48
My eslint config
{
"rules": {
"indent": [
2, 2
],
"quotes": [
2,
"single"
],
"linebreak-style": [
@ianmcnally
ianmcnally / prepush.sh
Created August 4, 2015 21:34
Stopping force pushes to master
#!/bin/sh
protectedBranch='master'
currentBranch=$(git rev-parse --abbrev-ref HEAD)
lastCommand=$(ps -ocommand= -p $PPID)
disallowedCommand='force|\-f'
if [[ $lastCommand =~ $disallowedCommand ]] && [ $currentBranch = $protectedBranch ]; then
echo "Force pushing to $protectedBranch is not allowed. Your push is rejected."
@ianmcnally
ianmcnally / gust-js-framework-talk.md
Last active August 9, 2018 12:40
Javascript frameworks for Gust

Javascript frameworks at Gust


Q: What’s it like at Gust?

  • Architecture of client-side code
  • Responsibilities

@ianmcnally
ianmcnally / .jscsrc
Last active March 3, 2016 16:42
JSCS config file
{
"disallowImplicitTypeConversion": ["numeric", "boolean", "binary", "string"],
"disallowKeywordsOnNewLine": ["else"],
"disallowMixedSpacesAndTabs": true,
"disallowTrailingWhitespace": true,
"disallowTrailingComma": true,
"disallowYodaConditions": true,
"disallowKeywords": [ "with" ],
"disallowMultipleLineBreaks": true,
"disallowMultipleVarDecl": "strict",
@ianmcnally
ianmcnally / gist:c986117b81f60bc107d3
Last active August 29, 2015 14:18
My week in angular, js, testing

A week's small victories: Angular, Equality and Testing

Our work weeks are made up of victories both big and small. What really gets me writing is the small. The a-ha! moments. The high fives (internal ones count too). The green builds. The git pushes.

I spent my week creating dynamic forms and lists in Angular. I made them, fought with them, tested them, and came out the other side in one piece. Here's my story:

Writing and testing custom form validators

Custom form validators are a powerful feature in Angular.