Skip to content

Instantly share code, notes, and snippets.

matthewbeta /
Created Jun 2, 2021 — forked from davidohlin/
Homestead allow CORS (with Sprig for Craft CMS)

Working allow CORS Homestead (with Sprig for Craft CMS)

Place the following in the server block of your sites nginx config, ie /etc/nginx/sites-enabled/

# Allow CORS
add_header 'Access-Control-Allow-Origin' '*' always;
add_header 'Access-Control-Allow-Credentials' 'true' always;
add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS' always;
add_header 'Access-Control-Allow-Headers' 'Accept,Authorization,Cache-Control,Content-Type,DNT,If-Modified-Since,Keep-Alive,Origin,User-Agent,X-Requested-With,hx-current-url,hx-request,hx-target,hx-t>
monachilada / gatsby-config.js
Last active Oct 16, 2020
Sample gatsby-config.js enabling live preview in Craft CMS
View gatsby-config.js
const { createHttpLink } = require('apollo-link-http');
const fetch = require('node-fetch');
const store = require('store');
const sourceNodes = require('gatsby/dist/utils/source-nodes');
const craftGqlUrl = process.env.CRAFT_GQL_URL;
const craftGqlToken = process.env.CRAFT_GQL_TOKEN;
module.exports = {
View Importing Remote GraphQL Schema into Gridsome
const { setContext } = require('apollo-link-context');
const { HttpLink } = require('apollo-link-http');
const { introspectSchema, makeRemoteExecutableSchema } = require('graphql-tools');
const fetch = require('node-fetch');
module.exports = function(api) {
api.createSchema(async function(graphql) {
const http = new HttpLink({
uri: '',
davidohlin /
Last active Jun 2, 2021
Homestead allow CORS

Working allow CORS Homestead

Place the following in the server block of your sites nginx config, ie /etc/nginx/sites-enabled/

# Allow CORS
add_header 'Access-Control-Allow-Origin' '*' always;
add_header 'Access-Control-Allow-Credentials' 'true' always;
add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS' always;
add_header 'Access-Control-Allow-Headers' 'Accept,Authorization,Cache-Control,Content-Type,DNT,If-Modified-Since,Keep-Alive,Origin,User-Agent,X-Requested-With' always;
thedaviddias / Preload CSS - Not blocking CSS.html
Last active Dec 16, 2021
Preload CSS and don't block the DOM with your CSS file request.
View Preload CSS - Not blocking CSS.html
<link rel="preload" href="css/global.min.css" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="css/global.min.css"></noscript>
/*! loadCSS. [c]2017 Filament Group, Inc. MIT License */
!function(a){"use strict";var b=function(b,c,d){function j(a){if(e.body)return a();setTimeout(function(){j(a)})}function l(){f.addEventListener&&f.removeEventListener("load",l),||"all"}var g,e=a.document,f=e.createElement("link");if(c)g=c;else{var h=(e.body||e.getElementsByTagName("head")[0]).childNodes;g=h[h.length-1]}var i=e.styleSheets;f.rel="stylesheet",f.href=b,"only x",j(function(){g.parentNode.insertBefore(f,c?g:g.nextSibling)});var k=function(a){for(var b=f.href,c=i.length;c--;)if(i[c].href===b)return a();setTimeout(function(){k(a)})};return f.addEventListener&&f.addEventListener("load",l),f.onloadcssdefined=k,k(l),f};"undefined"!=typeof exports?exports.loadCSS=b:a.loadCSS=b}("undefined"!=typeof global?global:this);
/*! loadCSS rel=preload po
ljharb /
Last active May 16, 2022
Array iteration methods summarized

Array Iteration

While attempting to explain JavaScript's reduce method on arrays, conceptually, I came up with the following - hopefully it's helpful; happy to tweak it if anyone has suggestions.


JavaScript Arrays have lots of built in methods on their prototype. Some of them mutate - ie, they change the underlying array in-place. Luckily, most of them do not - they instead return an entirely distinct array. Since arrays are conceptually a contiguous list of items, it helps code clarity and maintainability a lot to be able to operate on them in a "functional" way. (I'll also insist on referring to an array as a "list" - although in some languages, List is a native data type, in JS and this post, I'm referring to the concept. Everywhere I use the word "list" you can assume I'm talking about a JS Array) This means, to perform a single operation on the list as a whole ("atomically"), and to return a new list - thus making it mu

adactio / basicServiceWorker.js
Last active Apr 13, 2022
A basic Service Worker, for use on, say, a blog.
View basicServiceWorker.js
'use strict';
// Licensed under a CC0 1.0 Universal (CC0 1.0) Public Domain Dedication
(function() {
// Update 'version' if you need to refresh the cache
var staticCacheName = 'static';
var version = 'v1::';
jamesacampbell /
Last active Jan 25, 2018
A ever-evolving guide on how I lockdown a new digital ocean wordpress droplet.

This guide is meant to be a signpost to guide the way, not a dictionary to memorize. Your mileage may vary. Two great sites to check speed and security: &

Initial setup


Buy a new Digital Ocean droplet with Wordpress pre-installed ($10 per month).


ssh into the new instance based on the credentials Digital Ocean provided.

zacwasielewski / product-image-srcset.liquid
Last active Sep 2, 2021
Shopify responsive product images with srcset. Picturefill-compatible.
View product-image-srcset.liquid
{% comment %}
Shopify responsive product images with srcset.
Include this snippet on a product page or within a products loop:
{% include 'product-image-srcset',
sizes: '(max-width: 640px) 50vw, (min-width: 641px) and (max-width: 960px) 33vw, 25vw' %}
matthewbeta / mediaquery.less
Created Apr 27, 2015
Mixin for media queries with .no-mq fallback (for <IE9)
View mediaquery.less
@sml-bp: 480px;
@med-bp: 720px;
@lrg-bp: 970px;
.phablet(@rules) {
@media screen and (min-width: @sml-bp) {