Tony Brown anthonybrown

#sdm

"simple dom module" for selecting and making dom elements. it exposes two globals in the window namespace $ and $$

api:

// NOTE: all functions either return the element or an array
// no NodeLists, so you can call `forEach` and friends directly

At AT Media we publish ApartmentTherapy.com and TheKitchn.com. This is our current engineering stack & toolchain as of 10/21/2015.

WE ARE HIRING.

Who We Are

Our engineering & design teams currently consist of 9 (incredibly talented, friendly & collaborative) engineers (3 senior, 3 junior), web designer, product manager and CTO/short stop. We're currently hiring a second product manager and designer.

Our team (and much of the company) works remotely. Slack has quickly become our critical communication channel. We make heavy use of Slack integrations including our own bot to manage code deployment & staging environments.

Folder Structure

Please note

While this gist has been shared and followed for years, I regret not giving more background. It was originally a gist for the engineering org I was in, not a "general suggestion" for any React app.

Typically I avoid folders altogether. Heck, I even avoid new files. If I can build an app with one 2000 line file I will. New files and folders are a pain.

Disclaimer: This is an unofficial post by a random person from the community. I am not an official representative of io.js. Want to ask a question? open an issue on the node-forward discussions repo

io.js - what you need to know

io is a fork of node v0.12 (the next stable version of node.js, currently unreleased)
io.js will be totally compatible with node.js
the people who created io.js are node core contributors who have different ideas on how to run the project
it is not a zero-sum game. many core contributors will help maintain both node.js and io.js

	// with static data, do filtering and sorting in the client
	<Autocomplete
	initialValue="Ma"
	items={getUnitedStates()}
	getItemValue={(item) => item.name}
	shouldItemRender={(item, value) => (
	state.name.toLowerCase().indexOf(value.toLowerCase()) !== -1 \|\|
	state.abbr.toLowerCase().indexOf(value.toLowerCase()) !== -1
	)}
	sortItems={(a, b, value) => (

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title></title>
	<link rel="stylesheet" href="../assets/css/main.css">
	</head>
	<body>
	<div id='wrap'>
	<header>

	<?php

	// Get all images attached to post that have "Include in Rotator" marked as "Yes"
	global $post;
	$args = array(
	'post_parent' => $post->ID,
	'post_type' => 'attachment',
	'post_mime_type' => 'image',
	'post_status' => 'inherit',
	'posts_per_page' => '-1',

	// declaration
	function foo (n) { return n + 1; }

	// expression
	// note, fat arrow functions have very different meaning (usually what I want, though)
	var foo = function (n) { return n + 1; };
	var foo = (n) => { return n + 1; };
	var foo = n => n + 1;

	// object methods

	import { Component } from "React";

	export var Enhance = ComposedComponent => class extends Component {
	constructor() {
	this.state = { data: null };
	}
	componentDidMount() {
	this.setState({ data: 'Hello' });
	}
	render() {

	{
	// http://eslint.org/docs/rules/

	"ecmaFeatures": {
	"binaryLiterals": false, // enable binary literals
	"blockBindings": false, // enable let and const (aka block bindings)
	"defaultParams": false, // enable default function parameters
	"forOf": false, // enable for-of loops
	"generators": false, // enable generators
	"objectLiteralComputedProperties": false, // enable computed object literal property names