RB-Lab

// you need to $ npm i -D babel-preset-es2015 babel-preset-react babel-preset-stage-0 babelify karma karma-browserify karma-chai karma-mocha karma-mocha-reporter karma-phantomjs-launcher phantomjs-polyfill array.from

module.exports = function conf(config) {
    config.set({
        frameworks: ['browserify', 'mocha', 'chai'],
        plugins: [
            'karma-browserify',
            'karma-mocha',
            'karma-chai',
            'karma-phantomjs-launcher',

ygotthilf

ssh-keygen -t rsa -b 4096 -m PEM -f jwtRS256.key
# Don't add passphrase
openssl rsa -in jwtRS256.key -pubout -outform PEM -out jwtRS256.key.pub
cat jwtRS256.key
cat jwtRS256.key.pub

danharper

var gulp = require('gulp');
var sourcemaps = require('gulp-sourcemaps');
var source = require('vinyl-source-stream');
var buffer = require('vinyl-buffer');
var browserify = require('browserify');
var watchify = require('watchify');
var babel = require('babelify');

function compile(watch) {
  var bundler = watchify(browserify('./src/index.js', { debug: true }).transform(babel));

domenic

Auto-deploying built products to gh-pages with GitHub Actions

This is a set up for projects which want to check in only their source files, but have their gh-pages branch automatically updated with some compiled output every time they push.

A file below this one contains the steps for doing this with Travis CI. However, these days I recommend GitHub Actions, for the following reasons:

• It is much easier and requires less steps, because you are already authenticated with GitHub, so you don't need to share secret keys across services like you do when coordinate Travis CI and GitHub.
• It is free, with no quotas.
• Anecdotally, builds are much faster with GitHub Actions than with Travis CI, especially in terms of time spent waiting for a builder.

p3t3r67x0

Styling native elements

Native HTML controls are a challenge to style. You can style any element in the web platform that uses Shadow DOM with a pseudo element ::pseudo-element or the /deep/ path selector.

video::webkit-media-controls-timeline {
  background-color: lime;
}

video /deep/ input[type=range] {

rrharvey

<!-- ... content removed --> 

  <!-- build:js({.tmp,app}) scripts/scripts.js -->
  <!-- fileblock:js scripts -->
  <script src="scripts/app.js"></script>
  <script src="scripts/controllers/main.js"></script>
  <!-- endfileblock -->
  <!-- endbuild -->
</body>
</html>

jedp

Security-Reviewing Uses of postMessage()

The postMessage() API is an HTML5 extension that permits string message-passing between frames that don't share the same origin. It is available in all modern browsers. It is not supported in IE6 and IE7.

postMessage is generally considered very secure as long as the programmer is careful to check the origin and source of an arriving

paulirish

// http://paulirish.com/2011/requestanimationframe-for-smart-animating/
// http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating

// requestAnimationFrame polyfill by Erik Möller. fixes from Paul Irish and Tino Zijdel

// MIT license

(function() {
    var lastTime = 0;
    var vendors = ['ms', 'moz', 'webkit', 'o'];

joelambert

Drop in replace functions for setTimeout() & setInterval() that 
make use of requestAnimationFrame() for performance where available
http://www.joelambert.co.uk

Copyright 2011, Joe Lambert.
Free to use under the MIT license.
http://www.opensource.org/licenses/mit-license.php