This shows the execution order given JavaScript's Call Stack, Event Loop, and any asynchronous APIs provided in the JS execution environment (in this example; Web APIs in a Browser environment)
Given the code
#!/bin/bash | |
# | |
# Convert ssh-agent output to fish shell | |
# | |
eval "$(ssh-agent)" >/dev/null | |
echo "set SSH_AUTH_SOCK \"$SSH_AUTH_SOCK\"; export SSH_AUTH_SOCK" | |
echo "set SSH_AGENT_PID \"$SSH_AGENT_PID\"; export SSH_AGENT_PID" |
.rounded-corners-gradient-borders { | |
width: 300px; | |
height: 80px; | |
border: double 4px transparent; | |
border-radius: 80px; | |
background-image: linear-gradient(white, white), radial-gradient(circle at top left, #f00,#3020ff); | |
background-origin: border-box; | |
background-clip: padding-box, border-box; | |
} |
/**************************\ | |
Basic Modal Styles | |
\**************************/ | |
.modal { | |
font-family: -apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif; | |
} | |
.modal__overlay { | |
position: fixed; |
const cons = (x, y) => (m) => m(x, y) | |
const car = (z) => z((p, q) => p) | |
const cdr = (z) => z((p, q) => q) | |
const someLinkedList = cons(1, cons(2, cons(3 , null))) | |
// iterating |
See how a minor change to your commit message style can make a difference.
Tip
Take a look at git-conventional-commits , a CLI util to ensure these conventions, determine version and generate changelogs
import * as React from 'react' | |
import { Link as GatsbyLink, GatsbyLinkProps } from 'gatsby' | |
interface Props extends GatsbyLinkProps<HTMLAnchorElement> { | |
to: string | |
className?: string | |
target?: string | |
} | |
const checkLinkType = (to: Props['to']) => { |
import * as React from "react"; | |
import { useMousePosition } from "~/hooks/useMousePosition"; | |
/** Component to cover the area between the mouse cursor and the sub-menu, to allow moving cursor to lower parts of sub-menu without the sub-menu disappearing. */ | |
export function MouseSafeArea(props: { parentRef: React.RefObject<HTMLDivElement> }) { | |
const { x = 0, y = 0, height: h = 0, width: w = 0 } = props.parentRef.current?.getBoundingClientRect() || {}; | |
const [mouseX, mouseY] = useMousePosition(); | |
const positions = { x, y, h, w, mouseX, mouseY }; | |
return ( | |
<div |
import React, { useState } from "react"; | |
import ReactDOM from "react-dom"; | |
const style = { | |
table: { | |
borderCollapse: "collapse", | |
}, | |
tableCell: { | |
border: "1px solid gray", | |
margin: 0, |
const cons = (x, y) => (m) => m(x, y) | |
const car = (z) => z((p, q) => p) | |
const cdr = (z) => z((p, q) => q) | |
const someLinkedList = cons(1, cons(2, cons(3 , null))) | |
// iterating |