Skip to content

Instantly share code, notes, and snippets.

View mikoloism's full-sized avatar
💻
@ry 🥇

mikoloism mikoloism

💻
@ry 🥇
View GitHub Profile
@jalbam
jalbam / requestAnimationFrame-polyfill.js
Last active April 26, 2025 03:30
window.requestAnimationFrame polyfill (with high resolution timing, very precise)
'use strict';
// requestAnimationFrame polyfill by Erik Möller.
// Fixes from Paul Irish, Tino Zijdel, Andrew Mao, Klemen Slavic, Darius Bacon and Joan Alba Maldonado.
// Adapted from https://gist.github.com/paulirish/1579671 which derived from
// http://paulirish.com/2011/requestanimationframe-for-smart-animating/
// http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating
// Added high resolution timing. This window.performance.now() polyfill can be used: https://gist.github.com/jalbam/cc805ac3cfe14004ecdf323159ecf40e
// MIT license
// Gist: https://gist.github.com/jalbam/5fe05443270fa6d8136238ec72accbc0
@akirattii
akirattii / BarcodeScanner.js
Created January 31, 2019 01:39
HTML: Barcode Scanner on modern browser
/**
Barcode Scanner library
@author: Akira TANAKA <[email protected]> (http://mint.pepper.jp)
@dependencies:
+ jquery
+ quagga (https://serratus.github.io/quaggaJS/)
## Usage example:
@dfoverdx
dfoverdx / JavaScript Members Not Bound to Instances.md
Last active September 11, 2024 22:29
Why JavaScript class members are not automatically bound to the instance of the class

It took a few years, but I finally understand why member functions of classes in JavaScript aren't automatically bound to their objects, in particular when used in callback arguments.

In most object-oriented languages, functions are members of a class--they exist in memory only once, and when they are called, this is simply a hidden argument of the function which is assigned to the object that's calling it. Python makes this explicit by requiring that the first argument of a class's member function be self (Python's equivalent of this--you can name self whatever you want, but self is the convention).

class MyClass:
<button onclick="recordStop()" id="record-stop-button">Record</button>
<button onclick="playAudio()" disabled id="play-audio-button">Play</button>
<script>
const recordAudio = () =>
new Promise(async resolve => {
const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
const mediaRecorder = new MediaRecorder(stream);
const audioChunks = [];
mediaRecorder.addEventListener("dataavailable", event => {
@akirattii
akirattii / example-read-write-mysql-blob.js
Created April 17, 2018 05:47
node-mysql example: How to write & read BLOB
/*
DDL:
CREATE TABLE `bindata` (
`id` INT NOT NULL AUTO_INCREMENT,
`data` BLOB,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
*/
const fs = require("fs");
@akirattii
akirattii / background.js
Last active June 4, 2021 11:04
an example of chrome extension, which can be opened as new tab by click its browser icon.
console.log("background");
chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.create({
'url': chrome.extension.getURL('popup.html')
}, function(tab) {
// Tab opened.
});
});

Using the classnames.bind method

Many people who work with React are familiar with the excellent classnames library. If you aren't familiar, it provides a simple function for gluing classnames together. In web programming in general, there are many times that we need to add or remove multiple classes based on conditional logic. The classnames library makes this easy.

More and more developers are embracing CSS Next and the power of CSS modules. However, when you add CSS modules to your react components, working with classnames gets more difficult. Typically, CSS modules is implemented with class name mangling. Transforming human readable class name strings into unique identifiers helps ensure that every class name in your app is unique.

This means that you can write your component CSS in isolation without worrying about the dreaded class name collisions that have plagued CSS

@rahman541
rahman541 / ES6-Setup.md
Last active May 22, 2023 04:04
ES6 Setup with nodemon

ES6 Setup

npm init -y
npm i --save-dev nodemon
npm add babel-preset-env babel-cli

Create a .babelrc config in your project root. Insert the following

{
 "presets": ["env"]
const nodemailer = require('nodemailer');
// const env = process.env.NODE_ENV || 'development';
// const config = require(path.join(__dirname, '/../config/config.json'))[env];
module.exports = (data) => {
nodemailer.createTestAccount((err, account) => {
// create reusable transporter object using the default SMTP transport
let transporter = nodemailer.createTransport({
host: 'smtp.gmail.com',
port: 587,