Ben Nadel
On User Experience (UX) Design, JavaScript, ColdFusion, Node.js, Life, and Love.
Ben Nadel at CFUNITED 2009 (Lansdowne, VA) with: Katie Maher
Ben Nadel at CFUNITED 2009 (Lansdowne, VA) with: Katie Maher

Recent Blog Posts by Ben Nadel

Using CSS Host-Context To Theme Components In Angular 6.1.3

After I built BigSexyPoems with Angular 6 ( www.BigSexyPoems.com ), Seema Shariat augmented the application with some theming abilities. I really like the direction this app is going in; and, I want to try and take the theming functionality to the next level. Only, I've never done any theming b... read more »


Replacing Double-Dashes With Em Dashes While Typing In JavaScript

One of the little delighters that I see many applications baking into their user experience (UX) is the auto-injection of Em Dashes whenever the user enters two normal dashes (hyphens) in a row. The Em Dash is often used used in lieu of other punctuation marks, such as commas or parenthesis, in ord... read more »


Creating A Pre-Bootstrap Loading Screen With window.postMessage() In Angular 6.1.2

Managing the UI (User Interface) within an Angular application is relatively easy. But, communicating UI changes to the greater browser context is not exactly straightforward. This challenge presents itself when creating a pre-bootstrap "loading" screen that only disappears once the Angular applica... read more »


Experimenting With CSS Variable / Custom Property DOM Inheritance

For the last couple of days, Seema Shariat and I have been discussing the concept of theming in Angular applications. And, to be honest, this is something that I know next-to-nothing about. So, I've started to read up on the matter; and it seems that CSS Custom Properties (commonly referred to as... read more »


Using style.setProperty() To Keep CSS Property Names Consistent In JavaScript

This morning, while reading an article on theming Angular components by Austin McDaniel , I saw something that I don't think I've ever seen before. Austin was using a .setProperty() method to define an element's CSS properties in JavaScript. Historically, I've mutated the style properties direct... read more »


Using "Safe Updates" To Prevent Unbounded UPDATE And DELETE Statements In MySQL

Earlier this week on Twitter, I was joking / venting about how I accidentally ran an UPDATE statement without a WHERE clause and it [obviously] ended-up affecting every row in the given table. In response to this tweet , Karl Petrow mentioned that "safe updates" must have been turned off. I ha... read more »


BigSexy Poems Uses Angular And The Datamuse API To Help You Write Poetry

Beneath my nerdy exterior, I fancy myself a romantic. And, one of the ways in which I like to express that part of my psyche is through poetry. If you've followed this blog for long enough, you'll know that I like to write poems about ColdFusion and jQuery and Regular Expressions . But, I also... read more »


Don't Let The Minimum Lovable Product (MLP) Become The Enemy Of The Good

As someone who has spent more than a decade living and breathing a "design first" product development workflow , the original concept of the "Minimum Lovable Product" was such a breath of fresh air. In my mind, the Minimum Lovable Product - or MLP - was nothing more than an acknowledgment that des... read more »


Checking To See If An Element Has A CSS Pseudo-Class In JavaScript

This morning, I sat down to see if I could detect "autofill" behaviors in the browser. In doing so, I came across several StackOverflow posts that mentioned a ":-webkit-autofill" pseudo-class getting applied to inputs in WebKit-based browsers. When I read this, it occurred to me that I didn't know ... read more »


A Book Apart: Flexible TypeSetting By Tim Brown

Over the weekend, I read Flexible TypeSetting by Tim Brown . This book, from the ABookApart series, discusses the fascinating and beautifully nuanced art-form of font selection and responsive text layout design. If you're strictly a back-end engineer, this is probably not the book for you. But, ... read more »


Implementing A "Show Password" Checkbox On A Login Form In JavaScript

More and more, I've been seeing a pattern emerging on login forms where the user is presented with a "show password" toggle. Clicking on this toggle will change the password field from an obfuscated input to a plain-text input where the user can clearly see what value they are typing. Now, if you'r... read more »


ColdFusion Client For The Word-Finding Datamuse API

As a side-project to learn more about Docker and Redis, I've been working on an application that will help me write poetry. A big part of writing poetry is understanding rhyme schemes, syllable counts, and words that have similar meanings. My application hopes to bring all of these tools together i... read more »


Downloading Text Using Blobs, URL.createObjectURL(), And The Anchor Download Attribute In JavaScript

About a month ago, I discovered that you could use Plain Text in a Data URI when programmatically prompting a user to download content . Prior to that, I had assumed that all Data URIs had to be Base64-encoded. In response to that post, several of my co-workers ( Adam DiCarlo and Dave Johnson ) ... read more »


Timezone In Date .toTimeString() Is Not Always An Abbreviation In JavaScript

The other day, when I tried to open my Incident Commander app on a different computer, nothing would load. The console was reporting some sort of parsing error. And upon digging into the issue, I discovered that the timezone substring reported by the Date's .toTimeString() method was not what I a... read more »


.NET Microservices: Architecture For Containerized .NET Applications

Last week at InVision , Tom Lee passed-around a few links to articles that discussed handling failure in a distributed system. These articles turned out to be chapters in a digital book published by Microsoft: .NET Microservices: Architecture For Containerized .NET Applications by Cesar de la... read more »


Accessing Parent Route Params Via paramsInheritanceStrategy In Angular 6.0.7

Yesterday, I took a quick look at how to access any and all route parameters in an Angular 6.0.7 application by walking the Router State tree and aggregating all params in an RxJS Observable. In response to that post, Danny Blue pointed out that recent releases of the Angular Router include a... read more »


Collecting Route Params Across All Router Segments In Angular 6.0.7

One of the really cool things about the Angular Router is that it supports location paths that implement "matrix URL notation". This matrix URL notation creates strong cohesion between the route parameters and the route segments to which they belong. This cohesion is really nice from an ActivatedRo... read more »


The Not-So-Dark Art Of Designing Database Indexes: Reflections From An Average Software Engineer

When I first started using databases in my software design, I didn't even know that databases had indexes (or "indices," for the more mathematically minded folks). In fact, I had already been building data-driven websites for a few years before I even worked on a database that was large enough to p... read more »


Open-Source, Secure, Client-Side, Network-Free, JSON Linting

When I write data to a log aggregation tool, like Loggly, I try to write said data as structured JSON (JavaScript Object Notation) values. This way, the log aggregation tool can parse and index the log payloads using something like ElasticSearch (under the hood). Unfortunately, in order to manage c... read more »


Using The LaunchDarkly Dashboard And JSON Types To Create Light-Weight Application Administrative Features

In the LaunchDarkly Lunch-n-Learn panel discussion in NYC , I had theorized that you could use LaunchDarkly as a way to "hack together" light-weight administrative features for your web application. Since the LaunchDarkly multivariate feature flag values are so open-ended, I suggested that you cou... read more »


LaunchDarkly Lunch-And-Learn Panel Discussion: New York City

Yesterday, I had the pleasure of representing InVision App in a Lunch-n-Learn panel discussion for LaunchDarkly (alongside Lena Krug of Meetup, Christopher Cosentino of Shutterstock, and Greg Ratner of Troops). As you may have seen from my blog, InVision has been a LaunchDarkly customer ... read more »


Drawing Parallels Between a Flux-Style State Management Architecture (Like Redux) And An Event-Driven Microservices Architecture

CAUTION: This post is mostly just me thinking out-loud about stuff with which I have little experience. Take the following with a grain of salt. I'm just trying to formulate a better mental model for complex architectures that have long-term maintainability. The vast majority of my experience re... read more »


Taming The State In React: Your Journey To Master Redux And MobX By Robin Wieruch

I have several projects at work, such as my Incident Commander application , that could use some refactoring love with regard to state management. I have a sense that using a technology like Redux or NgRx Store would be a value-add. However, I've been having a heck of a hard time wrapping my head ... read more »


Using invoke() To Invoke Passed-In Closure And Function References In ColdFusion

This morning, I had a huge break-through in my understanding of the invoke() function in ColdFusion. The first argument of the invoke() function is documented as being either a ColdFusion Component instance (or Java or COM or Corba or .NET instance); or, the name of a ColdFusion Component class fil... read more »


Automatically Scroll The Window When The User Approaches The Viewport Edge In JavaScript

CAUTION: This is primarily a "note to self" for future Ben. This represents a part of DOM interaction that I don't have a solid mental model for. As such, my confidence level here is not stellar. The other day, I had to a fix a bug in InVision that related to dragging DOM (Document Object Mode... read more »


Using Multivariate Feature Flags In LaunchDarkly To Gradually Ramp-Up Batched Operations Like Database Migrations

Yesterday, in my review of Distributed Systems Observability by Cindy Sridharan , I mentioned that I've never gotten a lot of value out of pre-production load-testing. Instead, I use LaunchDarkly feature flags to incrementally roll-out a new feature while monitoring the underlying database and a... read more »


Distributed Systems Observability: A Guide To Building Robust Systems By Cindy Sridharan

Over the weekend, I read Distributed Systems Observability: A Guide To Building Robust Systems by Cindy Sridharan . It's a short e-book (about 36-pages), provided as a free download by Humio (in collaboration with O'Reilly Media). And, while it's short, Sridharan paints a good overview of the co... read more »


Enable Tabbing Within A Fenced Code-Block Inside A Markdown Textarea In JavaScript

Last week, I took a look at using the Flexmark Java library to parse markdown content into HTML output in ColdFusion . Shortly thereafter, I enabled markdown formatting in my blog comments. This was a huge leap forward for usability. But, it still left something to be desired. While the markdown p... read more »


Exploring Plain-Text Data URIs And The Anchor Download Attribute In JavaScript

The other day, I took a look at using the Flexmark library to parse markdown content into HTML output in ColdFusion . As part of that exploration, I used the Prism.js JavaScript library to add syntax-highlighting to the rendered fenced code-blocks. While on the Prism.js site, I noticed something... read more »


Randomly Selecting RegEx Day Winners Using A Cryptographically Secure Pseudo-Random Number Generator (CSPRNG) In Node.js

Friday was the 11th annual Regular Expression Day celebration . And, this year, participants submitted Haiku poems about their Regular Expressions experience in an effort to win some gift cards. And, since I take every opportunity I can to learn me some programming, I figured that randomly selecti... read more »