Parker Codes
LightNews LightNews
banner
parker-codes.dev
Parker Codes
@parker-codes.dev
100 followers 43 following 43 posts
Code Wizard • Director of Technology • Statecharts • a11y • UX Design • Architecture • Security • Proud Father of 3
Posts Replies Media Videos
parker-codes.dev
Thoughts on @tailwindcss.com syntax for the new if() function support?
Instead of this: <div class="bg-blue-500 {isError ? 'bg-red-500' : ''}"> Hello </div> It could look like: <div data-error={isError} class="bg-blue-500 if(--data-error):bg-red-500"> Hello </div>
July 8, 2025 at 5:53 PM
parker-codes.dev
These are my go-to desk snacks.

For me, they meet the sweet spot of tasty yet somewhat healthy, and I only need to have small portions.

Eating a full meal can cause me to feel drowsy, but if I pair these with lots of water and some short breaks from the screen, I'm golden!
Grain-free tortilla chips, raisins, sunflower seeds, and Triscuits
April 30, 2025 at 6:33 PM
parker-codes.dev
Latest Blog Post: Make Real Friends

parker-codes.dev/blog/make-re...
Wall-E movie shot depicting an overweight man watching a screen with no care for reality
December 31, 2024 at 8:15 PM
parker-codes.dev
Oh, no. ChatGPT is now asking me to do things before it answers?!
Bot thought about HTML content in request string for 9 seconds, then said "Before I can help you with that, please solve this challenge first: Type the letter 'D'."
December 16, 2024 at 10:02 PM
parker-codes.dev
New blog post: Top Tips for Freelance and Agency Developers: Hourly Billing and Beyond

parker-codes.dev/blog/freelan...
An office desk of a freelancer burdened by many thoughts.
December 14, 2024 at 7:02 PM
parker-codes.dev
Answer: Every condition is evaluated, even if the first false would do the trick.

Instead, we can utilize functions to keep the code readable.

A simple trick would be to use inline functions, only adding a few characters per line, and then call those functions like so:
Code snippet: const isValidFormat = () => validateFormat(input); const isNotBlacklisted = () => checkBlacklist(input); const hasValidSession = () => verifySession(user); if (isValidFormat() && isNotBlacklisted() && hasValidSession()) { // Proceed with processing }
December 4, 2024 at 5:53 PM
parker-codes.dev
Code performance tip:

In programming, "short-circuit evaluation" refers to how logical operators like && and || evaluate from left to right and stop as soon as the result is determined.

Do you see what could be slow about this code?
Code snippet: const isValidFormat = validateFormat(input); const isNotBlacklisted = checkBlacklist(input); const hasValidSession = verifySession(user); if (isValidFormat && isNotBlacklisted && hasValidSession) { // Proceed with processing }
December 4, 2024 at 5:53 PM
parker-codes.dev
Here's an example of using :not(:has(*)) in @css instead of the :empty pseudo-selector, because that one doesn't work if there is any markup inside such as an empty HTML comment..
The code: <html> <head> <style> .test { margin-top: 1rem; width: 10rem; height: 2rem; } .with-pseudo-empty { border: 5px solid blue; } .with-pseudo-empty:empty { border: none; } .with-pseudo-not-has { border: 5px solid green; } .with-pseudo-not-has:not(:has(*)) { border: none; } </style> </head> <body> <div class="test with-pseudo-empty"> <!-- --> </div> <div class="test with-pseudo-not-has"> <!-- --> </div> </body> </html>
November 14, 2024 at 1:23 AM
parker-codes.dev
Back before Father's Day, I made this Yes/No Button for any of you with kids who are Bluey fans (sound on):

yes-no.parker-codes.dev
A yellow keychain with a "Y" button and an "N" button. It looks just like the one from the show "Bluey" for kids.
November 4, 2024 at 9:40 PM