Artem Vitiuk viart

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

some tools for diagrams in software documentation

Diagrams For Documentation

Obvious Choices

ASCII

Web Components Resources

Specs / standardization

W3C Introduction to Web Components - explainer/overview of the technologies

I'm having trouble understanding the benefit of require.js. Can you help me out? I imagine other developers have a similar interest.

From Require.js - Why AMD:

The AMD format comes from wanting a module format that was better than today's "write a bunch of script tags with implicit dependencies that you have to manually order"

I don't quite understand why this methodology is so bad. The difficult part is that you have to manually order dependencies. But the benefit is that you don't have an additional layer of abstraction.

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

	'use strict';
	var gulp = require('gulp');
	var gutil = require('gulp-util');
	var del = require('del');
	var uglify = require('gulp-uglify');
	var gulpif = require('gulp-if');
	var exec = require('child_process').exec;


	var notify = require('gulp-notify');

	// Just before switching jobs:
	// Add one of these.
	// Preferably into the same commit where you do a large merge.
	//
	// This started as a tweet with a joke of "C++ pro-tip: #define private public",
	// and then it quickly escalated into more and more evil suggestions.
	// I've tried to capture interesting suggestions here.
	//
	// Contributors: @r2d2rigo, @joeldevahl, @msinilo, @_Humus_,
	// @YuriyODonnell, @rygorous, @cmuratori, @mike_acton, @grumpygiant,

	from datetime import datetime
	from sqlalchemy import Column, Integer, DateTime, ForeignKey
	from sqlalchemy.orm import relationship
	from sqlalchemy.ext.declarative import declared_attr
	from flask_security import current_user


	class AuditMixin(object):
	created_at = Column(DateTime, default=datetime.now)
	updated_at = Column(DateTime, default=datetime.now, onupdate=datetime.now)

	<!-- standard viewport tag to set the viewport to the device's width
	, Android 2.3 devices need this so 100% width works properly and
	doesn't allow children to blow up the viewport width-->
	<meta name="viewport" id="vp" content="initial-scale=1.0,user-scalable=no,maximum-scale=1,width=device-width" />
	<!-- width=device-width causes the iPhone 5 to letterbox the app, so
	we want to exclude it for iPhone 5 to allow full screen apps -->
	<meta name="viewport" id="vp" content="initial-scale=1.0,user-scalable=no,maximum-scale=1" media="(device-height: 568px)" />
	<!-- provide the splash screens for iPhone 5 and previous -->
	<link href="assets/splashs/splash_1096.png" rel="apple-touch-startup-image" media="(device-height: 568px)">
	<link href="assets/splashs/splash_iphone_2x.png" rel="apple-touch-startup-image" sizes="640x960" media="(device-height: 480px)">

	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title></title>
	<link rel="stylesheet" href="../libs/mocha.css" type="text/css" media="screen" title="no title" charset="utf-8">
	</head>
	<body>
	<div id="mocha"></div>
	<script src="../libs/mocha.js" type="text/javascript" charset="utf-8"></script>