Teochew Thunder

Always code as if the guy who ends up maintaining your code will be a violent psychopath who knows where you live.

John Woods

Any fool can write code that a computer can understand. Good programmers write code that humans can understand.

Martin Fowler

If you think it's simple, then you have misunderstood the problem.

Bjarne Stroustrup

Most of you are familiar with the virtues of a programmer. There are three, of course: laziness, impatience, and hubris.

Larry Wall

Intelligence is the ability to avoid doing work, yet getting the work done.

Linus Torvalds

Adding manpower to a late software project makes it later.

Brook's Law

CNY Rat SVG Animation
SVG Animation of the words "2020" morphing into a stylized rat head.

Source Demo

Tic-tac-toe Valentine's Day Edition
Valentine's Day Edition of Tic-tac-toe, with simulated intelligence

Source Demo

D3 Animated Bar Chart
Animated bar chart rendered in D3 and SVG.

Source Demo

Easter Memory Game
An Easter-themed paired cards memory game written using ReactJS.

Source Demo

D3 Animated Line Chart
Animated line chart rendered in D3 and SVG.

Source Demo

Slide Carousel
A slide carousel implemented in HTML, CSS and JavaScript

Source Demo

D3 Animated Pie Chart
Animated pie chart rendered in D3 and SVG.

Source Demo

Fade Carousel
A fade carousel implemented in HTML/CSS/JavaScript

Source Demo

Louver Carousel
A louver carousel implemented in HTML/CSS/JavaScript

Source Demo

WordSearch Puzzle
Children's wordsearch game in jQuery/HTML/CSS

Source Demo

12 Days of Christmas
A frivolous Christmas-themed ReactJS app to illustrate SVG usage.

Source Demo

INFO

A collection of widgets and little programs I've compiled (and sometimes use) over the years. Some of it is obviously just for fun, and some of it can be used (and has been used) in various projects. Quite a few of them are Proofs of Concept. This is the stuff I get up to in my free time.

Please note that not all of them conform to accepted best practices. In fact, many of them don't. The key thing here is the idea behind, not so much the implementation.

I have made a point of indicating the technologies used (predominantly HTML, CSS and JavaScript) and the browsers I have tested the code on. If the code does not run on the browser indicated, check out the GitHub source; likely there is a branch within the repository that will work as advertised.

COMPLEXITY

Measures how many interconnected moving parts it took to produce this demo, and how complex these parts are.

Commercial or enterprise-level complexity.

Multiple moving parts, moderate complexity and properly abstracted.

Multiple moving parts with moderate complexity.

Multiple simple moving parts.

Student or hobbyist level. Minimal moving parts.

APPLICABILITY

Application in the real world.

Ubiquitious usage.

Widespread usage.

Useful functionality for general use cases.

Useful functionality for narrow use cases.

Theoretical only, or very simple functionality.

Demos for 2020