Skip to content

Instantly share code, notes, and snippets.

@dergachev
dergachev / GIF-Screencast-OSX.md
Last active April 19, 2024 11:00
OS X Screencast to animated GIF

OS X Screencast to animated GIF

This gist shows how to create a GIF screencast using only free OS X tools: QuickTime, ffmpeg, and gifsicle.

Screencapture GIF

Instructions

To capture the video (filesize: 19MB), using the free "QuickTime Player" application:

@lukehedger
lukehedger / ffmpeg-compress-mp4
Last active April 18, 2024 21:00
Compress mp4 using FFMPEG
$ ffmpeg -i input.mp4 -vcodec h264 -acodec mp2 output.mp4
@gaearon
gaearon / connect.js
Last active April 11, 2024 06:46
connect.js explained
// connect() is a function that injects Redux-related props into your component.
// You can inject data and callbacks that change that data by dispatching actions.
function connect(mapStateToProps, mapDispatchToProps) {
// It lets us inject component as the last step so people can use it as a decorator.
// Generally you don't need to worry about it.
return function (WrappedComponent) {
// It returns a component
return class extends React.Component {
render() {
return (
ffmpeg -i data/video.mp4 -vcodec h264 -b:v 1000k -acodec mp2 data/output.mp4
@linhmtran168
linhmtran168 / pre-commit-eslint
Last active February 6, 2024 12:28
Pre-commit hook to check for Javascript using ESLint
#!/bin/sh
STAGED_FILES=$(git diff --cached --name-only --diff-filter=ACM | grep ".jsx\{0,1\}$")
if [[ "$STAGED_FILES" = "" ]]; then
exit 0
fi
PASS=true
@Atinux
Atinux / async-foreach.js
Last active October 10, 2023 03:04
JavaScript: async/await with forEach()
const waitFor = (ms) => new Promise(r => setTimeout(r, ms))
const asyncForEach = async (array, callback) => {
for (let index = 0; index < array.length; index++) {
await callback(array[index], index, array)
}
}
const start = async () => {
await asyncForEach([1, 2, 3], async (num) => {
await waitFor(50)
@codegenin
codegenin / dob.html
Created October 7, 2015 10:57
Months and Days Select List
<!-- Month dropdown -->
<select name="month" id="month" onchange="" size="1">
<option value="01">January</option>
<option value="02">February</option>
<option value="03">March</option>
<option value="04">April</option>
<option value="05">May</option>
<option value="06">June</option>
<option value="07">July</option>
<option value="08">August</option>
import Document, { Head, Main, NextScript } from 'next/document';
// Import styled components ServerStyleSheet
import { ServerStyleSheet } from 'styled-components';
export default class MyDocument extends Document {
static getInitialProps({ renderPage, req }) {
// Step 1: Create an instance of ServerStyleSheet
const sheet = new ServerStyleSheet();
'use strict';
export default function (question) {
var rl = require('readline');
var r = rl.createInterface({
input: process.stdin,
output: process.stdout,
terminal: false
});
return new Promise((resolve, error) => {
function makeElement(type, text) {
const el = document.createElement(type);
const textNode = document.createTextNode(text);
el.appendChild(textNode);
return el;
}
const h1 = (text) => makeElement(`h1`, text);