treshugart

import hify from './create-element';
import React from 'react';
import { render } from 'react-dom';

const h = hify(React.createElement.bind(React));

class Test extends HTMLElement {
  static observedAttributes = ['attr']
  attributeChangedCallback (name, oldValue, newValue) {
    this.innerHTML = `Hello, ${this.getAttribute('attr')}!`;

learncodeacademy

var debug = process.env.NODE_ENV !== "production";
var webpack = require('webpack');

module.exports = {
  context: __dirname,
  devtool: debug ? "inline-sourcemap" : null,
  entry: "./js/scripts.js",
  output: {
    path: __dirname + "/js",
    filename: "scripts.min.js"

yoavniran

The Ultimate Unit Testing Cheat-sheet

---

• Sinon Chai
• Chai
• Sinon

dwayne

Problem: What does a Modern Front-End Development Workflow Look Like?

I want to start writing libraries and large applications using the JavaScript language. However, I don't know how to setup the project and which build tools to use. What I do know is that the JavaScript community has moved way beyond using browser developer tool plugins and strategically-placed console.log() statements to debug, test, and build code.

I need help.

Below, I will keep track of articles, tutorials and tools I come across as I search for a way to bring my front-end development chops up-to-date.

The Ultimate Resource

mdellanoce

(function($) {
  function parseImagesFromCSS(doc) {
    var i, j,
      rule,
      image,
      pattern = /url\((.*)\)/,
      properties = ['background-image', '-webkit-border-image'],
      images = {};

    if (doc.styleSheets) {

utsengar

/*
 * This decorates Handlebars.js with the ability to load
 * templates from an external source, with light caching.
 * 
 * To render a template, pass a closure that will receive the 
 * template as a function parameter, eg, 
 *   T.render('templateName', function(t) {
 *       $('#somediv').html( t() );
 *   });
 * Source: https://github.com/wycats/handlebars.js/issues/82

jphorn

javascript:(function(F,i,r,e,b,u,g,L,I,T,E){if(F.getElementById(b))return;E=F[i+'NS']&&F.documentElement.namespaceURI;E=E?F[i+'NS'](E,'script'):F[i]('script');E[r]('id',b);E[r]('src',I+g+T);E[r](b,u);(F[e]('head')[0]||F[e]('body')[0]).appendChild(E);E=new%20Image;E[r]('src',I+L);})(document,'createElement','setAttribute','getElementsByTagName','FirebugLite','4','firebug-lite.js','releases/lite/latest/skin/xp/sprite.png','https://getfirebug.com/','#startOpened');