Menu

Dev

Scroll Shadows With JavaScript

October 5th, 2021

Scroll shadows are when you can see a little inset shadow on elements if (and only if) you can scroll in that direction. It’s just good UX. You can actually pull it off in CSS. Except… it just doesn’t work on iOS Safari. It used to work, and then it broke in iOS 13, along…

Links on React and JavaScript

October 1st, 2021

How To Use The Vite Build Tool with React — Vite is hot, in part, because it’s based on esbuild and wickedly fast. It’s from Evan You of Vue fame, but it’s not a Vue-specific tool. Here, NARUHODO covers how to configure it to work with React. React Architecture: How to Structure and Organize a…

How online tool helps to convert XML to JSON format.

September 12th, 2021

It has been a bone of contention for the programmers and developers to use a single most efficient data encoding and transporting format.  They are always looking for a better option that can optimize their work. With that said, the journey for a standard all-to-use format was not less than a rollercoaster ride. However, with…

The State Of Web Workers In 2021

August 4th, 2021

You gotta appreciate the tenacity of Surma. He’s been advocating for Web Workers as a path forward to better-feeling websites for a lot of years now. He’s at it again making sure we all understand the landscape: […] regardless of where you look, multithreading is used everywhere. iOS empowers developers to easily parallelize code using Grand Central…

Web Features That May Not Work As You’d Expect

July 23rd, 2021

As the web gets more and more capable, developers are able to make richer online experiences. There are times, however, where some new web capabilities may not work as you would expect in the interest of usability, security, and privacy. I have run into situations like this. Like lazy loading in HTML. It’s easy to…

Adding Shadows to SVG Icons With CSS and SVG Filters

June 11th, 2021

Why would we need to apply shadows to SVG? Shadows are a common design feature that can help elements, like icons, stand out. They could be persistent, or applied in different states (e.g. :hover, :focus, or :active) to indicate interaction to users. Shadows happen in real life, so they can be used on screens to…

Links on Accessibility

June 7th, 2021

Show/Hide password accessibility and password hints tutorial — Nicolas Steenhout goes deep on <input type=”password”> accessibility. For one thing, being able to toggle it to type=”text” should be possible, while announcing, politely, the change. But also, put the password hints (for choosing a password) before the input and programmatically connect them. And a bunch of…

Serverless Functions: The Secret to Ultra-Productive Front-End Teams

May 31st, 2021

Modern apps place high demands on front-end developers. Web apps require complex functionality, and the lion’s share of that work is falling to front-end devs: building modern, accessible user interfaces creating interactive elements and complex animations managing complex application state meta-programming: build scripts, transpilers, bundlers, linters, etc. reading from REST, GraphQL, and other APIs middle-tier…

To $ or Not to $: Displaying Terminal Code Snippets

May 27th, 2021

It’s very popular to put a $ on lines that are intended to be a command in code documentation that involves the terminal (i.e. the command line). Like this: $ brew install somepackage The point of that is that it mimics the prompt that you (may) see on your command line. Here’s mine: So the…

svg-loader: A Different Way to Work With External SVG

May 19th, 2021

SVGs are awesome: they are small, look sharp on any scale, and can be customized without creating a separate file. However, there is something I feel is missing in web standards today: a way to include them as an external file that also retains the format’s customization powers. For instance, let’s say you want to…