Posts tagged with "technical"
- Making a simple React microphone component
The browser has some nice built-ins for building a microphone recording component, so you don't have to use third-party libraries! - Why JavaScript variables don't always update
The way JavaScript assigns and references variables is sometimes weird, let's learn why. - Layering CSS gradients
You can layer CSS gradients as background images, even for text! Check out how I did it for making a marker-like highlight. - Building the Micro Journal
I built myself a digital typewriter! - I rewrote my blog! And website! They are one!
I merged my personal website and my blog into one beautiful baby—er, website. - Building W-9 Crafter
I built an app for generating Form W-9s for U.S. contractors and freelancers, here's how! - Styling a CSS pseudo-element with JavaScript
JavaScript can't target pseudo-elements, but that doesn't mean you can't mess with them! - Jumblie has a database!
Using the power of Supabase and Netlify Build Plugins, I was able to make Jumblie a bit cleaner under the hood! - How to test a browser extension locally
Here's a step-by-step guide for quickly testing browser extensions locally in Edge or Chrome. - Sorting Git branches
If you're tired of your git branches being alphabetically sorted, you can change that! - Use CSS accent-color to style your inputs
If you want a quick styling win, you can set a color for your input and progress HTML tags! - HTML "self-awareness" with sibling indexing in JavaScript
Make your HTML more "self-aware" with a fun little trick to get its own index. - Base CSS for your text-based pages
Sometimes the defaults your web browser gives you aren't very cute. Here's a lil snippet I use to fix that. - Kind of annoyed at React
Just a little ranty rant about my fave JS library, ya know. - Jumblie 100
Today is the 100th Jumblie puzzle day! - Publishing to my blog from Obsidian
This is how I publish to my Git-based blog straight from Obsidian (kind of) - Making a single line break in markdown
Here's how you can add single line breaks in your markdown documents! - Jumblie Build Log
I built Jumblie, a jumbled word search game. Here's how! - A use-case for CSS :has()
I found an unexpected use case for the newly, fully supported :has() selector! - Adding co-authors to TinaCMS's Git commits
You can add co-authors to the TinaCMS bot now more easily - How and when to use keys in React
When you render lists in React, you need to use keys. - Thirteen Potions Build Log
I made a game called Thirteen Potions for js13kgames, here's how I did it! - Trying out TinaCMS
I'm trying out TinaCMS to make it faster and easier to post here! - Calling an imported API at runtime in Astro
When you want to call an API at runtime in an Astro component, you have to import it in a different spot! - Co-authoring Git commits
Sometimes you want to be able to credit others in a single Git commit, and luckily that's possible! - Why I like Astro
Astro is the latest framework on the block that I've really been liking! - Removing trailing space underlines from groups of anchor tags
Sometimes when you have a bunch of anchor tags, the trailing spaces around them are underlined. Here's how to fix that. - Three ways to set headers with Netlify and Astro
If you need to set headers in your Astro site to deal with CORS or custom requests, here's a few ways how! - When useEffect runs
useEffect can be challenging to understand, and manipulating exactly when it runs is a good skill to have! - Setting up Netlify Redirects with Astro
Making Netlify Redirects work with Astro is a quick one-line change! - Importing SVG files as React components with Vite
With create-react-app, it was easy to import SVG files as components. Now with Vite, you can do the same! - Passing Markdown components to React or Preact in Astro
When you want to pass Markdown components to a non-Astro component (while using Astro itself), you need slots! - Hello, world
Lorem ipsum dolor sit amet (but for real) - Customizing my Zsh Prompt
Cassidy updated her Zsh prompt to have some fun colors, the date, and git information. Here's how! - Renaming a folder on the GitHub website
Sometimes when you're working with the GitHub UI, you need to rename a folder before cloning it to your computer. Here's how! - Make line breaks work when you render text in a React or Vue component
Sometimes you just want those pesky newline characters to actually work! - Use Unicode characters for bullet points in CSS using ::marker
If you don't want to use plain bullets, the ::marker psuedo-element is for you! - Adding a lang attribute to your Next.js site
Updating your Next.js sites to have a language set for screen readers is important for accessibility, and only takes a few lines of code! - Build wicked fast sites with Astro: An Introduction
Astro is the latest new framework that seems pretty dang nice! - React 18 Alpha is out! Now what?
They kept us in Suspense!! - Shallow Routing in Next.js
Shallow routing isn't a deep topic. Heh. Heh heh. - An Incredibly Serious Discussion about Next.js at Reactathon
Next.js is very, very serious and you should never, ever joke about it. Ever. - Enabling AMP in your Next.js projects
You must appease the SEO gods. - Adding Babel presets and plugins in Next.js
Babel presets and plugins help you add even more functionality to your code! - React Children: The misunderstood prop
Both human and React children could use some help being understood. - Query an API at both build time and runtime with Next.js
There's pros and cons to calling APIs at different times! - How to turn off telemetry in Next.js
Don't let 'em catch ya! - Add Web Monetization to your sites with Snippet Injection
You can use Netlify's snippet injection to add web monetization to any of your apps! - Logging in Next.js
Where will your logs be? Depends on where you call them. - Deploy from CodePen to Netlify in less than 30 seconds
It's faster to deploy from CodePen to Netlify than it is to read this blog post. - React Strict Mode in Next.js
Strict mode helps you, help yourself. - Environment variables in Next.js and Netlify
Environment variables in Next.js are pretty straightforward, and importing them to Netlify ain't too bad either! - Global Styles in Next.js
Sometimes you'll want some styles that can be applied across your Next.js applications. - Making a custom 404 page in Next.js
Don't be lost, don't be unfound, a 404 page gives you steady ground! - Absolute Imports in Next.js
Get rid of those long, gross import statements in your Next.js apps! - Building a custom React media query hook for more responsive apps
CSS only gets you so far, sometimes, when you want to pay attention to window sizes! - "Escaping" Next.js to access the browser
When things are server-side, there's some tricks to get back to client-land! - What is React Fast Refresh?
Hot module reloading has a new look! - Next.js: Should I use SSR or SSG?
Next.js allows you to both server-side render and statically generate websites. Why would you choose one over the other? Read and find out! - Using React Context for state management in Next.js
Ever wondered how you should manage state information across your Next.js applications without installing anything extra? Look no further! - Follow your dreams (literally): How I designed and launched the Official Scrabble Keyboard
The Scrabble keyboard has been a passion project of mine, and now it's real! - Building todometer: a meter-based to-do list
Just released my latest side project with Electron, React, and Redux! - Building My S60-X Keyboard
After a bunch of trial and error, I built and programmed my first mechanical keyboard! - Pure CSS3 Text Carousel
I built a pure CSS text carousel because I couldn't find one I liked. Here's how I did it, and tweaks for later. - Closures in JavaScript
Closures in JavaScript are an important concept that all JS devs should know. So here's a summary for you. - Adding Keyboard Shortcuts to your React Apps
Using the Mousetrap library, you can add keyboard shortcuts to your React apps. - Making the Whitney Houston API
I made a Whitney Houston API. Because why not. - A Brief History of the PNG
The PNG file format has been around forever... sort of. Not really. - The CSS Image Values Spec
The CSS Image Values Spec allows you to cleanly blow up pixel art on the web. - HTML+CSS Tutorial, Part 2
This is part 2 of a two-part tutorial for beginners as an introduction to HTML and CSS. - HTML+CSS Tutorial, Part 1
This is part 1 of a two-part tutorial for beginners as an introduction to HTML and CSS. - Design Your First iPhone App
It's not too bad to start building the phone app of your dreams!