Skip to content

Instantly share code, notes, and snippets.

Avatar
🧭
Building @code-hike

Rodrigo Pombo pomber

🧭
Building @code-hike
View GitHub Profile
@pomber
pomber / page.js
Last active October 6, 2021 17:09
View page.js
import { bundleMDX } from "mdx-bundler";
import { getMDXComponent } from "mdx-bundler/client";
import React from "react";
export async function getServerSideProps() {
const mdxSource = `
# Hello
~~~js
console.log(1);
~~~`;
@pomber
pomber / remark.md
Last active October 2, 2021 11:45
Adding props to a JSX element with remark
View remark.md

This MDX file

import { MyComponent } from "my-component"

<MyComponent foo={[1, 2, 3]} />

Generates this mdxJsxFlowElement node in the MDAST:

View slowmo.js
function slowmo(rate = 10) {
window._raf = window.requestAnimationFrame
window.requestAnimationFrame = f => window._raf(t => f(t/rate))
Date._now = Date.now
Date.now = () => Date._now() / rate
performance._now = performance.now
performance.now = () => performance._now()/rate
}
slowmo()
@pomber
pomber / timeago.js
Created February 14, 2020 17:22
Get a time ago human friendly string from a date (like dates in twitter).
View timeago.js
const MINUTE = 60,
HOUR = MINUTE * 60,
DAY = HOUR * 24,
YEAR = DAY * 365;
function getTimeAgo(date) {
const secondsAgo = Math.round((+new Date() - date) / 1000);
if (secondsAgo < MINUTE) {
return secondsAgo + "s";
@pomber
pomber / prerender.jsx
Last active October 28, 2019 22:32
Maybe some day we'll have something like this
View prerender.jsx
function App({ items }) {
const [itemId, setItemId] = useState(null)
const [startTransition, prepareTransition] = useTransition(newId => setItemId(newId), {
timeoutMs: 1000
})
return (
<Suspense fallback='Loading...'>
{itemId === null ? (
<ul>
{items.map(item => (
View dijkstra.md

Our intellectual powers are rather geared to master static relations and ... our powers to visualize processes evolving in time are relatively poorly developed. For that reason we should do (as wise programmers aware of our limitations) our utmost to shorten the conceptual gap between the static program and the dynamic process, to make the correspondence between the program (spread out in text space) and the process (spread out in time) as trivial as possible.
--- Dijkstra (1968) "A Case against the GO TO Statement" cited in: Bill Curtis (1981) Tutorial, human factors in software development. p. 109.

@pomber
pomber / mute.txt
Created June 14, 2019 17:59
Fix twitter timeline
View mute.txt
suggest_who_to_follow
suggest_recap
suggest_recycled_tweet
suggest_recycled_tweet_inline
suggest_activity_tweet
suggest_pyle_tweet
suggest_ranked_timeline_tweet
@pomber
pomber / thanos.js
Last active May 23, 2019 11:04
Decimate issues button for GitHub
View thanos.js
const buttonHtml = `
<a id="thanos" class="btn btn-primary float-right" role="button"
style="margin-left:38px">
Decimate issues
</a>`;
var css = '#thanos:hover{ background-image: linear-gradient(-180deg,#6d3678,#693270 90%) }';
var style = document.createElement('style');
@pomber
pomber / Presenter.jsx
Created May 11, 2019 15:08
mdx-deck teleprompter
View Presenter.jsx
import React from "react"
import { globalHistory } from "@reach/router"
import Zoom from "./Zoom"
import Slide from "./Slide"
import Pre from "./Pre"
import Clock from "./Clock"
// based on https://github.com/streamich/react-use/blob/master/src/useSpring.ts
import { SpringSystem } from "rebound"
import { useState, useEffect } from "react"
@pomber
pomber / __.babelrc
Last active November 26, 2018 18:06
deck-run
View __.babelrc
{
"presets": ["@babel/preset-react", "@babel/preset-env"]
}