Hello, IndieWeb!
Some thoughts on tinkering around with my digital playground and getting more involved with the IndieWeb.
Monica's Digital Playground
Monica Powell is a Senior Software Engineer who crafts innovative educational software for classrooms.
Latest posts
Fetch Webmentions Automatically with GitHub Actions
An overview of how in addition to using Brid.gy and Webmentions.io I'm adding GitHub Actions and soon Webmentions.app (or its closely related CLI tool) to automate updating my website with the latest Webmentions and sending outgoing Webmentions to other websites.
Organizing Content with Astro Content Schemas
With Astro's Content Collection Schema functionality, you can enforce structured, uniform tags to keep your content organized and SEO-friendly. In this post, we’ll dive into how you can define and validate tags using Astro’s schema system, ensuring every post follows the same tagging conventions. Whether you’re managing a blog, documentation site, or any content-heavy project, this guide will help…
Gradients with Lerp
This tutorial walks through how linear interpolation (or lerp) can be used to automagically generate gradients
Custom ZSH Startup Message
This post discusses how to customize the ZSH startup message that appears when opening a new terminal window.
Advent of Code - Day 01 2022
This article walks through how I solved Day 1 of Advent of Code 2022
How to Check Bundled Netlify Function Size Locally
Is everything working locally but you're having trouble deploying a Netlify function due to it being greater than 50 MB? This article walks through how to use the Netlify CLI to determine the size of the bundled Netlify function locally.
Tips for Debugging Software like a Detective
Strategic ways engineers can approach software with detective-like debugging skills
Setting Up Shell with zsh and Autosuggestions
This post is an overview of my recent migration from bash to zsh.
My SVG Creation Process
An overview of my creative process for creating SVG files for CSS animation
Getting Started with SVG Animation
Guide to programmatically animating SVGs
Creating Protected Routes In NextJS With Supabase
This articles walks through how to create protected routes on NextJS with Supabase's user management.
Creating New Supabase Users In NextJS
This article walks through how to create new users for a Supabase database with an API written in NextJS
How to Add Instagram Timeline To a NextJS Site
This article walks through how to integrate Instagram on a NextJS site.
Getting Started With Webmention and NextJS
An overview of setting up Webmention on a NextJS site to collect comments from across the decentralized social web (i.e., Twitter, GitHub, Pinterest, Reddit) in a centralized place.
Set Yourself Up For Success During Hacktoberfest
This article walks through some tips for making meaningful contributions to Open Source software during Hacktoberfest and beyond.
How To Render Relevant Icons Based on Content
This article walks through how I use React to render icons that are tailored to the specific content.
Hanselminutes Podcast: Leaning Into Learning In Public
Monica Powell on the Hanselminutes podcast
How to Make Your VSCode Sparkle
This article shows you how to customize your VSCode set up to display animated sparkles while you are typing. There's a VSCode extension, Power Mode that adds animated flair while you're typing. It has a few different default animations but none of them quite sparkle.
Migrating To MDX Talk
Here's a talk I gave at MDX Conf, sharing more about my migration from Remark to MDX, how you can migrate your site and what problems you might run into. MDX allows you to write Markdown that includes React components and enables a lot more flexibility than Markdown traditionally does.
Adding Environment Variables To GitHub Actions
This article walks through how to pass environment variables to GitHub Action Workflows
6 Transformative Tech Conference Talks
Here's a roundup of some of my favorite conference talks that have shaped the way that I think about web development, the workplace, and community organizing.
Keeping Server-Side Rendering Cool With React Hydration
The purpose of this article is to share some helpful things to keep in mind to render a seamless experience as a Server-Side Rendered (SSR) site transitions from a window-less (server) environment to a browser.
Working In Public Book Notes
Notes for the book Working In Public by Nadia Eghbal
How To Create A GitHub Profile README
Tips and inspiration for enhancing your GitHub Profile
Exploring Art Direction With Gatsby-Image
I recently used Gatsby's Image's Art direction to update my header to display different images based on viewport size.
Initial Thoughts On Migrating from gatsby-transformer-remark to gatsby-plugin-mdx
Some of my initial thoughts from migrating this Gatsby site from gatsby-transformer-remark to gatsby-plugin-mdx in order to support MDX in addition to Markdown.
Give Your CSS Superpowers with CSS Variables
This post will introduce what CSS variables are, how to use them and why to consider using them.
Top Gatsby Plugins For Developer Blogs
I've published dozens of articles on my Gatsby site and these are the top plugins I recommend to enhance your blog's SEO and user experience.
Refactoring useState() To useReducer()
This article walks through how to combine multiple useState() React hooks logic into a single useReducer().
Understanding Reduce in JavaScript
This article will walk through various ways to use ES6 reduce to map, filter and construct objects from arrays.
Automating File Creation With JavaScript
Guide to using Plop a micro-generator to generate new text-based files.
2019 into 2020, Year in Review
I could go on and on about the last 10 years but it's officially 2020 and I've decided to start by writing my first public year in review!
Egghead Podcast: "Personal Growth From Open-Source And Meetups"
This episode of the Egghead podcast gives listeners a better glimpse into my journey into landing my first engineering role and more.
How to Add Search Functionality to a Gatsby Blog
This tutorial will walk through how to create functionality to allow users to filter posts on a Gatsby site by description, title and, tags.
Delete Your Code and Other Reflections from Coderetreat Day
Some of my reflections from participating in the 2019 Global Coderetreat Day where I solved Conway's Game of Life various ways with different people and principles each time.
Less JavaScript Makes Font Awesome More Awesome
Recently, I looked into tackling a rendering issue with Font Awesome fonts used on this site by removing JavaScript...
Grey's Anatomy Lorem Ipsum Generator Tutorial
This tutorial is going to walk through how to create a Grey’s Anatomy or other-themed Lorem Ipsum generator with React and Netlify Functions
git is hard, but time travel in git is easy.
This article explains how it's possible to commit code that is dated in the future.
4 Meetups That Helped Me Grow as A Woman of Color in Tech
Attending various tech Meetups over the years has been pivotal to my growth as a technologist
How I automatically created a Twitter List of FreeCodeCampers in 5 minutes
Using Twython Twitter API wrapper to add users to a Twitter List
Conquering the Command Line
When I was first introduced to the command line I really had to adjust to navigating my computer in a black box with just text. So I avoided the command line as much as possible. I was accustomed to…
Overcoming the Goldilocks Complex
Lately, I’ve felt a bit stuck with my progress on learning how to code as I think I’m comfortable with the fundamentals. As I’m starting to immerse myself in coding, reading article’s like the Viking…
How to Change Repo Language in GitHub
I recently started working on a Weather app in Flask to auto-detect a user’s location based off of their IP address. After committing some updates to GitHub my app switched from being labeled as…
Hide Your API Keys
If you plan on programming any applications and storing your code in a public GitHub repository then it is important that you protect your API keys 🔑 by ensuring that they are not searchable or…