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
version: '2' | |
services: | |
api: | |
volumes: | |
- "nfsmount:${CONTAINER_DIR}" | |
volumes: | |
nfsmount: | |
driver: local | |
driver_opts: |
$ cd /usr/local/lib | |
$ sudo ln -s ../../lib/libSystem.B.dylib libgcc_s.10.5.dylib | |
$ sudo ln -s ../../lib/libSystem.B.dylib libgcc_s.10.4.dylib |
// Conditional Rendering with enums | |
function Notification({ text, state }) { | |
return ( | |
<div> | |
{{ | |
info: <Info text={text} />, | |
warning: <Warning text={text} />, | |
error: <Error text={text} />, | |
}[state]} | |
</div> |
<svg xmlns="http://www.w3.org/2000/svg" version="1.1"> | |
<defs> | |
<filter id="blur"> | |
<feGaussianBlur in="SourceGraphic" stdDeviation="14"></feGaussianBlur> | |
</filter> | |
</defs> | |
</svg> | |
.svgblur{ | |
filter: url(#blur); |
#!/usr/bin/env bash | |
# Copy the url of the active ngrok connection to the clipboard. | |
# Usage: | |
# ngrok-copy # copies e.g. https://3cd67858.ngrok.io to clipboard. | |
# ngrok-copy -u # copies e.g. http://3cd67858.ngrok.io to clipboard. | |
if [[ "$1" == "-u" ]]; then | |
NGROK_URL=`curl -s http://127.0.0.1:4040/status | grep -P "http://.*?ngrok.io" -oh` | |
else | |
NGROK_URL=`curl -s http://127.0.0.1:4040/status | grep -P "https://.*?ngrok.io" -oh` |
var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://example.com/', true);
xhr.withCredentials = true;
xhr.send();
fetch('https://example.com', {
/** | |
* BrowserSync config: serve static assets, and proxy the HTML | |
* | |
* Let's say we have the codebase for the front-end of a website, | |
* and we want to develop CSS/JS or debug against the HTML of | |
* a remote development, staging or production server. | |
* | |
* Using BrowserSync (2.4 needed), we want to serve to our browser(s): | |
* - the distant HTML pages and content images from the server | |
* - local static assets (including or changes) |