budo + LiveReactLoad integration
- stubs out index.html
- runs watchify
- serves on port 9966
- notifies LiveReactLoad on bundle update
- reloads HTML with LiveReload
- injects CSS with LiveReload
- pretty-prints requests to console
deebloo
/ web-component-class-example.js
Last active
December 28, 2017 05:29
Its extremely easy to create vanilla custom elements with classes and template strings.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| 'use strict'; | |
| class NameCard extends HTMLElement { | |
| set name(val) { | |
| this._name = val; | |
| this.render(); | |
| } | |
| get name() { | |
| return this._name; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <dom-module id="slack-login"> | |
| <style> | |
| :host { | |
| display: block; | |
| } | |
| #card { | |
| min-width: 500px; | |
| } | |
ebidel
/ unused-html-imports-bookmarket.js
Last active
March 16, 2020 03:45
Bookmarklet to help prune unnecessary HTML Imports loaded on a page.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| javascript:(function(){'use strict';var _temporalUndefined={};function _temporalAssertDefined(val,name,undef){if(val===undef){throw new ReferenceError(name+' is not defined - temporal dead zone');}return true;}(function(){'use strict';var els=_temporalUndefined;var allCustomElements=_temporalUndefined;var polymerRegisteredElements=_temporalUndefined;var diff=_temporalUndefined;function isCustomEl(el){return el.localName.indexOf('-')!=-1||el.getAttribute('is');}els=[].slice.call(document.querySelectorAll('html /deep/ *')).filter(function(el){return isCustomEl(el);}).map(function(el){return el.getAttribute('is')||el.localName;});allCustomElements=new Set(_temporalAssertDefined(els,'els',_temporalUndefined)&&els);polymerRegisteredElements=Polymer.telemetry.registrations.map(function(el){return el.is;}).filter(function(name){var blacklist=_temporalUndefined;blacklist=['dom-template','array-selector','custom-style'];return(_temporalAssertDefined(blacklist,'blacklist',_temporalUndefined)&&blacklist).indexOf(name)== |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| (ns test123.core | |
| (:require [test123.limo :as l])) | |
| (defn -main [] (l/foo "Marco")) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <style> | |
| body.loading #splash { | |
| opacity: 1; | |
| } | |
| #splash { | |
| position: absolute; | |
| top: 0; |
domenic
/ 0-github-actions.md
Last active
April 8, 2024 23:35
Auto-deploying built products to gh-pages with Travis
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.
mathisonian
/ index.md
Last active
March 22, 2023 05:31
requiring npm modules in the browser console
The final result: require() any module on npm in your browser console with browserify
This article is written to explain how the above gif works in the chrome (and other) browser consoles. A quick disclaimer: this whole thing is a huge hack, it shouldn't be used for anything seriously, and there are probably much better ways of accomplishing the same.
Update: There are much better ways of accomplishing the same, and the script has been updated to use a much simpler method pulling directly from browserify-cdn. See this thread for details: mathisonian/requirify#5
staltz
/ introrx.md
Last active
May 6, 2024 01:44
The introduction to Reactive Programming you've been missing
(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.
omo
/ gist:9986103
Created
April 5, 2014 01:08
HTML Imports: Discussion over Async/Progressive Loading
There are concerns around HTML Imports that does sync or blocking loading as the default. I’d like to address these concerns. Especially I’d like to understand the actual use cases that “sync” loading hurts. This document aims to be a portal of that effort.
Before discussing use cases, let’s clarify which part of page loading process HTML Imports possibly blocks. The blocking model of HTML Imports is modeled after the one for external stylesheets. There are two main bits of the blocking:
NewerOlder