Skip to content

Instantly share code, notes, and snippets.

@romansorin
romansorin / .storybook
Created November 10, 2019 00:52
Gatsby, TailwindCSS, Storybook configuration
- addons.js
- config.js
- webpack.config.js
@swyxio
swyxio / Gatsby-bootstrap-lifecycle.md
Last active April 1, 2022 11:19
Gatsby bootstrap lifecycle

Sequence of Gatsby's bootstrap lifecycle with links to source code as of v2.0.0

  1. open and validate gatsby-config (get-config-file.js) 1.5 load themes (swyx added this note July 2019)
  2. load plugins (load-plugins/index.js) from the list given in gatsby-config.js
  3. onPreBootstrap: runs onPreBootstrap if it is implemented in any plugins, for example gatsby-plugin-typography. Receives handy [apiCallArgs](https://github.com/gatsbyjs/gatsby/blob/ffd8b2d691c9
@maciejmatu
maciejmatu / email-response.js
Created May 3, 2018 21:01
Lambda function I use for email auto-response with Netlify forms.
require("dotenv").config(); // read .env file if present.
const nodemailer = require("nodemailer");
const createHtmlMail = require("./modules/mail-template"); // this function returns html email code
exports.handler = function(event, context, callback) {
const user = process.env.MAIL_USER; // some@mail.com
const pass = process.env.MAIL_PASSWORD; // 42isthecoolestnumber
let transporter = nodemailer.createTransport({
@marick
marick / about_those_lava_lamps.md
Last active June 22, 2022 21:08
About Those Lava Lamps

Around 2006-2007, it was a bit of a fashion to hook lava lamps up to the build server. Normally, the green lava lamp would be on, but if the build failed, it would turn off and the red lava lamp would turn on.

By coincidence, I've actually met, about that time, (probably) the first person to hook up a lava lamp to a build server. It was Alberto Savoia, who'd founded a testing tools company (that did some very interesting things around generative testing that have basically never been noticed). Alberto had noticed that people did not react with any urgency when the build broke. They'd check in broken code and go off to something else, only reacting to the breakage they'd caused when some other programmer pulled the change and had problems.

@paulirish
paulirish / what-forces-layout.md
Last active July 30, 2024 18:27
What forces layout/reflow. The comprehensive list.

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
@wesbos
wesbos / settings.json
Created July 21, 2015 13:46
Wes Bos' Sublime Text Settings
{
"added_words":
[
"Mockup",
"plugins",
"coffeescript",
"sourcemaps",
"html",
"plugin",
"init",
@rafibomb
rafibomb / gist:f08ed757b04a782aa5ea
Last active July 19, 2021 02:23
Foundation Mega-menu html
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Foundation Mega Menu</title>
<link rel="stylesheet" href="css/app.css" />
<link href="http://cdnjs.cloudflare.com/ajax/libs/foundicons/3.0.0/foundation-icons.css" rel="stylesheet">
<script src="bower_components/modernizr/modernizr.js"></script>
</head>
@ericelliott
ericelliott / essential-javascript-links.md
Last active July 30, 2024 20:53
Essential JavaScript Links
@addyosmani
addyosmani / README.md
Last active July 24, 2024 10:54 — forked from 140bytes/LICENSE.txt
108 byte CSS Layout Debugger

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

@alexhawkins
alexhawkins / AllUnderscoreMethods.js
Last active January 12, 2023 05:12
Basic Implementation of 'most' Underscore Methods from Scratch
var _ = {};
/*********IDENTITY**********/
_.identity = function(val) {
return val;
};
/*********FIRST**********/
_.first = function(array, n) {