-
Can migrate applications from one presentation layer (e.g. Angular) to another (e.g. React). Makes migrations less risky, since only the presentation is changing and you know the application logic will continue behaving the same way.
-
Can develop and test application logic independently of the UI. Makes new features quicker to implement since they are smaller changes to make to the app.
j-
/ measure-scrollbar.html
Created
September 27, 2018 00:22
Easily measure scrollbar width and height
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div id="outer"> | |
| <div id="inner"> | |
| </div> | |
| </div> | |
| <style> | |
| #outer { | |
| width: 2em; | |
| height: 2em; | |
| overflow: scroll; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| body { | |
| font-size: 3em; | |
| } | |
| .spinner { | |
| width: 1em; | |
| height: 1em; | |
| position: relative; | |
| color: #09c; | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| function pad (val) { | |
| return (val < 10 ? '0' : '') + val; | |
| } | |
| function getTime (x) { | |
| const h = Math.floor(x) || 12; | |
| const m = Math.floor((x * 60) % 60); | |
| const s = Math.floor((x * 360) % 60); | |
| const mm = pad(m); |
j-
/ screen.json
Created
June 15, 2018 05:23
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| [ | |
| { | |
| "availHeight": 1080, | |
| "availLeft": 0, | |
| "availTop": -1080, | |
| "availWidth": 1920, | |
| "colorDepth": 24, | |
| "height": 1080, | |
| "orientationAngle": 0, | |
| "orientationType": "landscape-primary", |
j-
/ Separating state and presentation.md
Created
June 6, 2018 01:18
j-
/ entitymap.ts
Created
May 25, 2018 07:10
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * @example | |
| * | |
| * export interface ActionReceiveChatActionParticipantJoined extends Action { | |
| * type: 'ReceiveChatActionParticipantJoined'; | |
| * data: { | |
| * sessionId: string; | |
| * result: string; | |
| * entities: EntityMap<{ | |
| * actions: ChatActionParticipantJoined; |
j-
/ css-attribute-selectors.html
Created
March 15, 2018 03:22
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <meta charset="utf-8"> | |
| <title>CSS Attribute Selectors</title> | |
| <form id="main"> | |
| <label for="html">HTML</label><br /> | |
| <textarea id="html" autocomplete="false" spellcheck="false"><a href="/">Home</a></textarea><br /> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="outer"> | |
| <div class="middle"> | |
| <div class="inner"> | |
| Hello world | |
| </div> | |
| </div> | |
| </div> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Splits a string given in the format `31 Jan` into an array of `[0, 31]`. | |
| */ | |
| const parseMonthDate = (input) => { | |
| const [dateString, monthString] = input.split(' '); | |
| const date = Number(dateString); | |
| switch (monthString) { | |
| case 'Jan': return [0, date]; | |
| case 'Feb': return [1, date]; | |
| case 'Mar': return [2, date]; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* These are regular expressions that will | |
| never be matched by any string ever */ | |
| [ | |
| // http://stackoverflow.com/a/1845111 | |
| /$./, | |
| // http://stackoverflow.com/a/1845097 | |
| /(?!x)x/, | |