Skip to content

Instantly share code, notes, and snippets.

Avatar

Adam Mackintosh agm1984

View GitHub Profile
@agm1984
agm1984 / vue-sfc-snippet.json
Last active Apr 30, 2020
VS Code snippet for a Vue component scaffold
View vue-sfc-snippet.json
{
"Vue component": {
"prefix": "vue",
"body": [
"<template>",
" <div></div>",
"</template>",
"",
"<script>",
"export default {",
@agm1984
agm1984 / case-insensitive-search
Created Aug 8, 2019
Maybe you have an autocomplete field and you want to filter a list to case insensitive matches.
View case-insensitive-search
@agm1984
agm1984 / reduce.js
Created Jul 9, 2019
How Array.prototype.reduce works
View reduce.js
const poop = ['one', 'two', 'three', 'four', 'five']
// I always use `acc` and `item` by default
// acc is the thing being accumulated
// item is each item in `poop`
// basic idea: this will do nothing,
// add some console.logs in here and study the behaviour
// look at the example below that uses `i` and add it here with console.log
const ultraBasic = poop.reduce((acc, item) => {
@agm1984
agm1984 / reactScrollPositionY.js
Created Feb 23, 2018
How to get Y scroll position in React
View reactScrollPositionY.js
import React, { Component } from 'react'
import UserDetails from './UserDetails'
/**
* This utility function allows function calls to be debounced.
* @param {Function} func Function that requires debouncing
* @param {Number} wait Wait time in milliseconds between successive invocations
*/
const debounce = (func, wait) => {
let timeout
@agm1984
agm1984 / sortArrayOfObjects.js
Created Nov 19, 2018
JavaScript Sort algorithm
View sortArrayOfObjects.js
const data = [
{ first: 'David', last: 'Goldstein', age: 92 },
{ first: 'Tom', last: 'Stamper', age: 23 },
{ first: 'Sally', last: 'Brunswick', age: 76 },
{ first: 'Steve', last: 'Henderson', age: 37 },
{ first: 'Mark', last: 'Chopper', age: 75 },
{ first: 'Lucy', last: 'Steel', age: 29 },
]
// localeCompare is a String prototype:
@agm1984
agm1984 / showTimeElapsed.js
Created Nov 4, 2018
Shows the amount of time elapsed since a timestamp, with pretty formatting
View showTimeElapsed.js
const showTimeElapsed = (timestamp) => {
if (typeof timestamp !== 'number') return 'NaN'
const SECOND = 1000
const MINUTE = SECOND * 60
const HOUR = MINUTE * 60
const DAY = HOUR * 24
const MONTH = DAY * 30
const YEAR = MONTH * 12
@agm1984
agm1984 / composition-example.js
Last active Jul 21, 2018
Advanced JavaScript Object and Function composition using basic logic
View composition-example.js
// First we are creating or getting some users and placing them in `users`
const users = [
{ name: 'Bob' },
{ name: 'Alice' },
]
// Then we are creating a config object that we could pass around as needed
// Notice we are using shorthand `users` instead of `users: users`
const config = {
appOwner: 'INSERT_YOUR_NAME',
@agm1984
agm1984 / .eslintrc.json
Last active Jun 15, 2018
ES Lint config for Vue JS
View .eslintrc.json
{
"env": {
"browser": true,
"es6": true,
"node": true
},
"parserOptions": {
"parser": "babel-eslint"
},
"extends": [
View recursiveFetch.js
const axios = require('axios')
const followIDs = async (next) => {
if (next) {
const nextRes = await axios({
method: 'get',
url: next,
responseType: 'json'
})
if (nextRes.data.message) {
@agm1984
agm1984 / eslintrc.json
Created May 1, 2018
Adam ES Lint Airbnb config settings
View eslintrc.json
{
"env": {
"node": true,
"browser": true,
"es6": true
},
"parser": "babel-eslint",
"extends": "airbnb",
"parserOptions": {
"ecmaFeatures": {