Skip to content

Instantly share code, notes, and snippets.

@ngbrown
ngbrown / BlurImg.tsx
Last active Apr 2, 2021 — forked from WorldMaker/use-blurhash.ts
useBlurhash hook
View BlurImg.tsx
import React, { useState, useCallback } from "react";
import { useBlurhash } from "./use-blurhash";
import { useInView } from "react-intersection-observer";
type Props = React.DetailedHTMLProps<
React.ImgHTMLAttributes<HTMLImageElement>,
HTMLImageElement
> & { blurhash?: string | null };
// Uses browser-native `loading="lazy"` to lazy load images
@ngbrown
ngbrown / AuthProvider.tsx
Last active Jan 1, 2021
useAuth React authentication with oidc-client
View AuthProvider.tsx
import React, {
createContext,
useReducer,
useEffect,
useState,
useContext,
} from 'react';
import * as Oidc from 'oidc-client';
// Inspired by https://github.com/Swizec/useAuth
@Manouchehri
Manouchehri / rfc3161.txt
Last active Apr 20, 2021
List of free rfc3161 servers.
View rfc3161.txt
http://timestamp.globalsign.com/scripts/timstamp.dll
http://timestamp.globalsign.com/?signature=sha2
http://rfc3161timestamp.globalsign.com/advanced
https://timestamp.geotrust.com/tsa
http://timestamp.sectigo.com
http://timestamp.wosign.com
http://tsa.startssl.com/rfc3161
http://time.certum.pl
http://timestamp.digicert.com
https://freetsa.org
@AndyCross
AndyCross / calendar.css
Created Oct 11, 2015
How the Calendar Visual might look in a few files
View calendar.css
.day {
fill: #fff;
stroke: #ccc;
}
.month {
fill: none;
stroke-width: 2px;
}
@OlegIlyenko
OlegIlyenko / Event-stream based GraphQL subscriptions.md
Last active Mar 9, 2021
Event-stream based GraphQL subscriptions for real-time updates
View Event-stream based GraphQL subscriptions.md

In this gist I would like to describe an idea for GraphQL subscriptions. It was inspired by conversations about subscriptions in the GraphQL slack channel and different GH issues, like #89 and #411.

Conceptual Model

At the moment GraphQL allows 2 types of queries:

  • query
  • mutation

Reference implementation also adds the third type: subscription. It does not have any semantics yet, so here I would like to propose one possible semantics interpretation and the reasoning behind it.

View folder-structure.md

Folder Structure

Please note

While this gist has been shared and followed for years, I regret not giving more background. It was originally a gist for the engineering org I was in, not a "general suggestion" for any React app.

Typically I avoid folders altogether. Heck, I even avoid new files. If I can build an app with one 2000 line file I will. New files and folders are a pain.

@deiu
deiu / linkheaderparser.js
Last active Jul 25, 2019
Parse HTTP Link header in Javascript
View linkheaderparser.js
// parse a Link header
//
// Link:<https://example.org/.meta>; rel=meta
//
// var r = parseLinkHeader(xhr.getResponseHeader('Link');
// r['meta'] outputs https://example.org/.meta
//
function parseLinkHeader(header) {
var linkexp = /<[^>]*>\s*(\s*;\s*[^\(\)<>@,;:"\/\[\]\?={} \t]+=(([^\(\)<>@,;:"\/\[\]\?={} \t]+)|("[^"]*")))*(,|$)/g;
var paramexp = /[^\(\)<>@,;:"\/\[\]\?={} \t]+=(([^\(\)<>@,;:"\/\[\]\?={} \t]+)|("[^"]*"))/g;
@branneman
branneman / better-nodejs-require-paths.md
Last active Apr 16, 2021
Better local require() paths for Node.js
View better-nodejs-require-paths.md

Better local require() paths for Node.js

Problem

When the directory structure of your Node.js application (not library!) has some depth, you end up with a lot of annoying relative paths in your require calls like:

const Article = require('../../../../app/models/article');

Those suck for maintenance and they're ugly.

Possible solutions

@thoemmi
thoemmi / PreBuild.targets.xml
Created Sep 14, 2012
Embed referenced assemblies, because ILMerge won't work with WPF applications
View PreBuild.targets.xml
<?xml version="1.0" encoding="utf-8" ?>
<Project ToolsVersion="4.0" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
<!--
Originally written by Daniel Chambers (http://www.digitallycreated.net)
http://www.digitallycreated.net/Blog/61/combining-multiple-assemblies-into-a-single-exe-for-a-wpf-application
-->
<Target Name="EmbedReferencedAssemblies" AfterTargets="ResolveAssemblyReferences">
<ItemGroup>
<!-- get list of assemblies marked as CopyToLocal -->
<AssembliesToEmbed Include="@(ReferenceCopyLocalPaths)" Condition="'%(Extension)' == '.dll'"/>
@alex-seville
alex-seville / jsViews in Backbone
Created Jun 7, 2012
Using jsViews in backbone to make an editable area (http://jsfiddle.net/XuXtS/4/)
View jsViews in Backbone
var Form = Backbone.Model.extend({});
var FormView = Backbone.View.extend({
events: {
"click .save": "save",
"click .edit": "edit",
"click .cancel": "cancel"
},
initialize: function() {
//set up our input form template
$.templates({