Available July 2024 for contract work.

J Hoeks
Developer

Front-end software engineer. Based in Docklands, Melbourne. React developer with interests in UI/UX and establishing strong development, testing, and documentation practices.

Work

Projects

Experiments

angleVisualize angles for use in CSS transformations. Can show you angles in degrees, radians, gradians and turns.
batterySimple device battery status indicator. Shows current battery level as a percentage, charging state, and if the battery is full.
bezier-curvesVisualize and manipulate cubic Bézier curves. Handy for CSS animations. Has linear and ease in/out/in-out presets.
blacklist-whitelistCreate regular expressions for blacklisting or whitelisting ASCII characters. More robust than using character literals in regular expressions.
canvas-arcWhen drawing arcs on the canvas it can be easy to forget where 0 is. This util visualizes the start and end angles of the arc.
charExplore the unicode character set. Switch characters between different encoding schemes like hexadecimal, CSS, JavaScript and HTML entities.
chinese-tonesAdd tones to pinyin without a special keyboard. Numbers after letters represent the tone — for example "Wo3" becomes "Wǒ".
clear-clipboard-formattingIn one click remove all formatting from the text copied to your clipboard. Only paste plain text.
combinationsGet each possible combination from all given inputs. When given a set of sets, generates a table of all combinations of a single item from each set.
cursorsLists CSS cursor types. Hover over each for an example of what that cursor looks like in your browser. Test custom cursors, too.
embiggenMake text BIGGER. Resizes all text entered as you type to make it as big as possible on your screen but still fit.
file-to-data-urlGenerate a data URL from an image or any other file type. Useful for embedding anywhere an entire file may need to be stored as text.
flood-gameStart with a grid of random colors. Each click will flood-fill the grid from the top left. Try and make the board one single color.
global-composite-operationDemonstrates JS canvas composite operations. Lists all the operations with examples for each. Adjust the colors and see how the effect changes.
grid-backgroundGenerate a CSS grid background with a given size and colors, using SVG. Useful for building applications with transparent backgrounds.
modesExplore Linux file system modes and permissions. Never again will you need to remember what 0755 means — or how to add sticky bits.
modifier-keysModifier keys are used for key combinations on different operating systems. Use this tool to remember which is which on macOS and Windows.
othelloPlay against an AI in the strategy board game Othello, also known as Reversi. Turn all the white disks black to win.
openerOpen a popup window to a location of your choosing with a given width and height. Useful if you want to take a screenshot just the right size.
restRest timer for intervals at the gym. Rest for a minute, a minute and a half, or two minutes.
sizerCheck the inner and outer width and height of a window. Resize your window and see how the values change as you do.
stopwatchShows the current time and a stopwatch which counts in minutes and seconds. Built in order to easily time long tasks at a glance.
sunCalculates and charts the angle of the sun in the sky for your current location. When the angle is above 50° UVB radiation provides the body with vitamin D.
sweeperVery simple game of mine sweeper. Clear away the whole board but don't set off any mines.
unix-timestampDetermine the date/time represented by a unix timestamp whether it's expressed in seconds, milliseconds, or any other format.

Get in touch