Socials section
About Me
Software engineer for humans
Bringing together developers, by bringing together technology.
Check out my blog →Tech I love
What is a full-stack engineer?
Any fool can write code that a computer can understand. Good programmers write code that humans can understand.Martin Fowler
Full-stack engineers write code that humans can understand for web, mobile, and backend (server-side) environments.
Useful Tools
-
For Fun
-
Web Dev
-
Assets
-
Embedded
About Me
Hi! I'm Tristan, a full-stack software engineer that brings together technologies that are a joy to work with. I've seen firsthand that the right tools save immense time and effort, making teams productive, confident, and happy to work together.
I've been programming since 2012, and worked accross all sorts of software and hardware projects. From designing processors, circuit boards, and firmware to supercomputing, web development and mobile apps, I've been around the block.
I love depth and details, but have found myself valuing "impact" above all else when it comes to technical work. Being down in the weeds can be fun, but I'm going to stay up-town for a while, in the land of "delivering value to customers".
Hopefully those that I've already had the pleasure of working with don't think this site sells me short, or streches the truth too thinly. If it does... the site's in github, open an issue!
Built with
Fonts
Outfit
A beautiful geometric sans: The official typeface for brand automation company outfit.io.
Poppins
Geometric sans serif typefaces have always been popular, and with support for both the Devanagari and Latin writing systems, Poppins is an internationalist addition to the genre.
Righteous
Righteous was initially inspired by the all capitals letterforms from the deco posters of Hungarian artist Robert Berény for Modiano.
Sanchez
Sanchez is a slab serif typeface family from Chilean type foundry LatinoType.
DM Serif Text
DM Serif Text is a lower-contrast counterpart to the high-contrast DM Serif Display.
Colors
Peanut Gallery
- If I asked my customers what they wanted, they'd say "faster horses". If I asked sales what my customers wanted, they'd say "longer horses"
- “Annoyingly competent”
- "Competently annoying"
- "Tristan is the ringer you call in when you know your problem could be easy"
- “His skills are as relevant as his humor is irreverent”
Developer Links
Accessibility
- Colorblind Web Page Filter
Simulate colorblindness on web pages to improve accessibility
Backgrounds
- Subtle Patterns
Free tileable wallpaper textures
- Transparent Textures
Free tileable transparent textures
- Hero Patterns
Free tileable SVG background textures
- Pattern Monster
Free generator for tileable SVG background textures
- Vanta.js
3D animated backgrounds for websites using JavaScript
Stock Photos
Image Placeholders
- Lorem Picsum
Placeholder images, generated on-the-fly
Assets
- Kenny.nl Assets
Free game assets
- FFFUEL
Simple tools for generating SVG design assets
- Magic Pattern
Tools for generating visual effects
Image Tools
- SVGator
No-code SVG creator and animator
FE blogs
- CodePen Spark
Awesome weekly(ish) web hackathon digest
- Toptal Design Blog
Professional design case studies
Low Quality Image Placeholders
- Plaiceholder
LQIP library w/ multiple algorithms
- ThumbHash
Low (<40 byte) image preview
- Blurhash
Low (<40 byte) image preview
FE Utilities
- clsx
Simplify deriving DOM class from JS state
- tailwind-merge
Merge Tailwind classes, overriding conflicts
- CVA - Class Variance Authority
Efficiently organize CSS variants
Note: I think the right move may be to make variants into data- tags and use selectors to target them...
Dev Utilities
- Regex 101
Build, test, and debug RegExs'
UX Blogs
- Nielsen Norman Group
UX research, articles, and courses
- Smashing Magazine
Web design and development articles
- UX Matters
UX design articles and resources
- Web.dev - Patterns
Simple web component UX examples
Favicons, PWA, Metadata
- Vite PWA - Asset Generator
Library for generating PWA assets in Vite
- Favicon Nightmare 2023
Article about Favicon best practices as of 2023
- Favicon Converter
Convert images to favicons
- Maskable
Check if your PWA maskable-icon looks good
CSS Gotchas
- Viewport Units
Mobile screen heights demystified
- (oldschool) CSS image sprites
Combining small icon images to load efficiently
Software Engineering
- Alex Greco - Feature Flags
Simplified feature-flags in full-stack apps
Dev Blogs
Useful Libraries
Platforms
-
Privilege Gotchas
This one quick trick to allow a program to bind port 443 can waste hours of time!
tags:
-
iOS Native Browser Plugins
I created a custom browser to allow web apps to use custom iOS functionality. Now developers can use our mobile functionality without investing in building an mobile app of their own.
tags: