Skip to content

Instantly share code, notes, and snippets.

View _document.js
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();
@Atinux
Atinux / async-foreach.js
Last active December 9, 2022 22:44
JavaScript: async/await with forEach()
View async-foreach.js
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)
View makeEl-2.js
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);
View ffmpeg-compress
ffmpeg -i data/video.mp4 -vcodec h264 -b:v 1000k -acodec mp2 data/output.mp4
@gaearon
gaearon / connect.js
Last active November 5, 2022 12:26
connect.js explained
View connect.js
// 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 (
View node_prompt_es6_promises.js
'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) => {
@codegenin
codegenin / dob.html
Created October 7, 2015 10:57
Months and Days Select List
View dob.html
<!-- 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>
@linhmtran168
linhmtran168 / pre-commit-eslint
Last active January 20, 2023 14:30
Pre-commit hook to check for Javascript using ESLint
View pre-commit-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
@lukehedger
lukehedger / ffmpeg-compress-mp4
Last active February 2, 2023 16:52
Compress mp4 using FFMPEG
View ffmpeg-compress-mp4
$ ffmpeg -i input.mp4 -vcodec h264 -acodec mp2 output.mp4
@dergachev
dergachev / GIF-Screencast-OSX.md
Last active February 2, 2023 17:13
OS X Screencast to animated GIF
View GIF-Screencast-OSX.md

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: