David Kern davidkern13

System Design Cheatsheet

Picking the right architecture = Picking the right battles + Managing trade-offs

Basic Steps

Clarify and agree on the scope of the system

User cases (description of sequences of events that, taken together, lead to a system doing something useful)
- Who is going to use it?
- How are they going to use it?

Inspired by dannyfritz/commit-message-emoji

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics

elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent

#Adding an existing project to GitHub using the command line

Simple steps to add existing project to Github.

1. Create a new repository on GitHub.

In Terminal, change the current working directory to your local project.

##2. Initialize the local directory as a Git repository.

git init

Whether you're trying to give back to the open source community or collaborating on your own projects, knowing how to properly fork and generate pull requests is essential. Unfortunately, it's quite easy to make mistakes or not know what you should do when you're initially learning the process. I know that I certainly had considerable initial trouble with it, and I found a lot of the information on GitHub and around the internet to be rather piecemeal and incomplete - part of the process described here, another there, common hangups in a different place, and so on.

In an attempt to coallate this information for myself and others, this short tutorial is what I've found to be fairly standard procedure for creating a fork, doing your work, issuing a pull request, and merging that pull request back into the original project.

Creating a Fork

Just head over to the GitHub page and click the "Fork" button. It's just that simple. Once you've done that, you can use your favorite git client to clone your repo or j

Sort object properties by value (values are text)

I have following object:

var cities={10:'Tashkent', 14:'Karakalpakiya', 16:'Andijan'};

I want sort it by city names, so after sort it should be:

var cities={16:'Andijan', 14:'Karakalpakiya', 10:'Tashkent'};

But I can't sort object properties, instead can convert object into array, then sort items.

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">

	<title>Chat</title>

	<script src="./socket.io/socket.io.js"></script>
	<script type="text/javascript">

Commit type	Emoji
Initial commit	🎉 `:tada:`
Version tag	🔖 `:bookmark:`
New feature	✨ `:sparkles:`
Bugfix	🐛 `:bug:`

	// the main app file
	import express from "express";
	import loadDb from "./loadDb"; // dummy middleware to load db (sets request.db)
	import authenticate from "./authentication"; // middleware for doing authentication
	import permit from "./authorization"; // middleware for checking if user's role is permitted to make request

	const app = express(),
	api = express.Router();

	// first middleware will setup db connection

	// This code is public domain, share and enjoy.

	window.ui = window.ui \|\| {};

	/** @constructor */
	ui.ListView = function(element, collection) {
	this.el = element;
	this.cellHeight = 30;
	this.collection = collection;

	// set-up a connection between the client and the server
	var socket = io.connect();

	// let's assume that the client page, once rendered, knows what room it wants to join
	var room = "abc123";

	socket.on('connect', function() {
	// Connected, let's sign-up for to receive messages for this room
	socket.emit('room', room);
	});