sol Solomko2

Eric Elliott's "Composing Software" Series

A collection of links to the excellent"Composing Software" series of medium stories by Eric Elliott.

To have a gulp workflow that with a single process,

960 Grid System - An effort to streamline web development workflow by providing commonly used dimensions, based on a width of 960 pixels. There are two variants: 12 and 16 columns, which can be used separately or in tandem.
Compass - Open source CSS Authoring Framework.
Bootstrap - Sleek, intuitive, and powerful mobile first front-end framework for faster and easier web development.
Font Awesome - The iconic font designed for Bootstrap.
Zurb Foundation - Framework for writing responsive web sites.
SASS - CSS extension language which allows variables, mixins and rules nesting.
Skeleton - Boilerplate for responsive, mobile-friendly development.

	<div class="calendar">
	<div class="calendar-navs">
	<div class="month-nav">
	<button (click)="prevMonth()"><</button>
	<span class="p4">{{ currentDate.format('MMMM') }}</span>
	<button (click)="nextMonth()">></button>
	</div>
	<div class="year-nav">
	<button (click)="prevYear()"><</button>
	<span>{{ currentDate.format('YYYY') }}</span>

	<!DOCTYPE HTML>
	<html lang="en">
	<head>
	<meta http-equiv="Content-type" content="text/html; charset=utf-8">
	<title>OpenTok API Sample — Basic Tutorial</title>
	<link href="samples.css" type="text/css" rel="stylesheet" >
	<script src="http://staging.tokbox.com/v0.91/js/TB.min.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
	<script type="text/javascript" charset="utf-8">

	function getSwipeEvent(deltaX, deltaY) {
	switch(true) {
	case deltaX >= 50: return new Event('swipeLeft');
	case deltaX <= -50: return new Event('swipeRight');
	case deltaY >= 50: return new Event('swipeUp');
	case deltaY <= -50: return new Event('swipeDown');
	}
	}

	function swipeEvents() {

	'use strict';

	var gulp = require('gulp');
	var sass = require('gulp-sass');
	var ts = require('gulp-typescript');
	var tsProject = ts.createProject('tsconfig.json', {typescript: require('typescript')});

	var paths = {
	sass: ['./resources/sass/*/.scss'],
	ts: ['./resources/app/*/.ts'],

	var gulp = require("gulp");
	var gutil = require("gulp-util");
	var notify = require('gulp-notify');
	var source = require("vinyl-source-stream");
	var buffer = require('vinyl-buffer');
	var browserify = require("browserify");
	var watchify = require("watchify");
	var babelify = require("babelify");

	var browserSync = require("browser-sync").create();

	<script type="text/javascript">
	(function () {
	"use strict";
	// once cached, the css file is stored on the client forever unless
	// the URL below is changed. Any change will invalidate the cache
	var css_href = './index_files/web-fonts.css';
	// a simple event handler wrapper
	function on(el, ev, callback) {
	if (el.addEventListener) {
	el.addEventListener(ev, callback, false);