(by @andrestaltz)
If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.
<!DOCTYPE html> | |
<head> | |
<title>HTML5 Camera Fun</title> | |
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script> | |
<script src="http://www.nihilogic.dk/labs/exif/exif.js" type="text/javascript"></script> | |
<script src="http://www.nihilogic.dk/labs/binaryajax/binaryajax.js" type="text/javascript"></script> | |
<script type="text/javascript"> | |
// Wrapper around MPL-licensed http://www.nihilogic.dk/labs/binaryajax/binaryajax.js | |
// to support JavaScript typed arrays since binary strings are not supported in IE 10 | |
var createBinaryFile = function(uintArray) { |
IMPORTANT | |
Please duplicate this radar for a Safari fix! | |
This will clean up a 50-line workaround. | |
rdar://22376037 (https://openradar.appspot.com/radar?id=4965070979203072) | |
////////////////////////////////////////////////////////////////////////////// | |
(Now available as a standalone repo.) |
(by @andrestaltz)
If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.
.text-xs-left { text-align: left; } | |
.text-xs-right { text-align: right; } | |
.text-xs-center { text-align: center; } | |
.text-xs-justify { text-align: justify; } | |
@media (min-width: @screen-sm-min) { | |
.text-sm-left { text-align: left; } | |
.text-sm-right { text-align: right; } | |
.text-sm-center { text-align: center; } | |
.text-sm-justify { text-align: justify; } |
var webpack = require('webpack'); | |
var HtmlWebpackPlugin = require('html-webpack-plugin'); | |
var path = require('path'); | |
var folders = { | |
APP: path.resolve(__dirname, '../app'), | |
BUILD: path.resolve(__dirname, '../build'), | |
BOWER: path.resolve(__dirname, '../bower_components'), | |
NPM: path.resolve(__dirname, '../node_modules') | |
}; |
{ | |
"keys": ["tab"], | |
"command": "expand_abbreviation_by_tab", | |
// put comma-separated syntax selectors for which | |
// you want to expandEmmet abbreviations into "operand" key | |
// instead of SCOPE_SELECTOR. | |
// Examples: source.js, text.html - source | |
"context": [ | |
{ |
Just migrated it from Codepen.io to markdown. Credit goes to David Conner.
Working with DOM | Working with JS | Working With Functions |
---|---|---|
Accessing Dom Elements | Add/Remove Array Item | Add Default Arguments to Function |
Grab Children/Parent Node(s) | Add/Remove Object Properties | Throttle/Debounce Functions |
Create DOM Elements | Conditionals |
Result: 1 | |
Items { | |
TemplateId: "BADGE_BATTLE_ATTACK_WON" | |
Badge { | |
BadgeType: BADGE_BATTLE_ATTACK_WON | |
BadgeRanks: 4 | |
Targets: "\nd\350\007" | |
} | |
} | |
Items { |
A top-level App
component returns <Button />
from its render()
method.
What is the relationship between <Button />
and this
in that Button
’s render()
?
Does rendering <Button><Icon /></Button>
guarantee that an Icon
mounts?
Can the App
change anything in the Button
output? What and how?
/* Client side, works in Chrome 55 and Firefox 52 without transpilation */ | |
//https://blogs.msdn.microsoft.com/typescript/2016/11/08/typescript-2-1-rc-better-inference-async-functions-and-more/ | |
async function fetchURLs() { | |
try { | |
// Promise.all() lets us coalesce multiple promises into a single super-promise | |
var data = await Promise.all([ | |
/* Alternatively store each in an array */ | |
// var [x, y, z] = await Promise.all([ | |
// parse results as json; fetch data response has several reader methods available: | |
//.arrayBuffer() |