hui.liu hulufei

Elm best practices

Style guide

Answering the Front-end developer JavaScript interview questions to the best of my ability.

Explain event delegation

Sometimes you need to delegate events to things.

Explain how this works in JavaScript

This references the object or "thing" defined elsewhere. It's like "hey, thing I defined elsewhere, I'm talkin' to you."

Explain how prototypal inheritance works.

Hello, visitors! If you want an updated version of this styleguide in repo form with tons of real-life examples… check out Trellisheets! https://github.com/trello/trellisheets

Trello CSS Guide

“I perfectly understand our CSS. I never have any issues with cascading rules. I never have to use !important or inline styles. Even though somebody else wrote this bit of CSS, I know exactly how it works and how to extend it. Fixes are easy! I have a hard time breaking our CSS. I know exactly where to put new CSS. We use all of our CSS and it’s pretty small overall. When I delete a template, I know the exact corresponding CSS file and I can delete it all at once. Nothing gets left behind.”

You often hear updog saying stuff like this. Who’s updog? Not much, who is up with you?

Better local require() paths for Node.js

Problem

When the directory structure of your Node.js application (not library!) has some depth, you end up with a lot of annoying relative paths in your require calls like:

const Article = require('../../../../app/models/article');

Those suck for maintenance and they're ugly.

Possible solutions

Backend Development

node.js
- Installation paths: use one of these techniques to install node and npm without having to sudo.
- Node.js HOWTO: Install Node+NPM as user (not root) under Unix OSes
- Felix's Node.js Guide
- Creating a REST API using Node.js, Express, and MongoDB
- Node Cellar Sample Application with Backbone.js, Twitter Bootstrap, Node.js, Express, and MongoDB
- JavaScript Event Loop
Node.js for PHP programmers

Frontend Development

Attention: the list was moved to

https://github.com/dypsilon/frontend-dev-bookmarks

This page is not maintained anymore, please update your bookmarks.

	type binarySearchTree('a) =
	\| Empty
	\| Node(node('a))
	and node('a) = {
	value: 'a,
	left: binarySearchTree('a),
	right: binarySearchTree('a),
	};

	let compare = (f, s) =>

	/*
	Demo: https://jsfiddle.net/elky/f6khaf2t/

	<div class="element">
	<div class="truncate">
	Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt
	ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
	laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
	voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
	non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

	import Html
	import Html.App as App
	import Html.Attributes as Attributes
	import Html.Events as Events
	import Json.Decode as Json
	import String


	main =
	App.beginnerProgram

	$ = jQuery

	TRANSFORM_TYPES = ['PUT', 'POST', 'DELETE']

	$.activeTransforms = 0

	$(document).ajaxSend (e, xhr, settings) ->
	return unless settings.type in TRANSFORM_TYPES
	$.activeTransforms += 1