Published in JavaScript in Plain English·Sep 21, 2021What the Heck Is Ref Forwarding?Passing refs to a child component — Compared to the rest of the React framework, refs are definitely a bit quirky. React utilizes a declarative design pattern that discourages direct manipulation of the DOM, but for a few use cases—focusing or selecting an input field for example—direct, imperative code is necessary. …React5 min readReact5 min read
Published in CodeX·Aug 24, 2021Low Coupling and High CohesionCrafting Well Organized Code — As I gain experience as a programmer, I’ve come to appreciate well written code more and more. Nothing’s worse than discovering a library that claims to be the answer to your problems that, upon closer inspection, turns out to be a jumbled, disorganized mess of functions and variables. …Programming3 min readProgramming3 min read
Published in JavaScript in Plain English·Aug 16, 2021Understanding Callback RefsAn alternative implementation of React refs — React utilizes a virtual DOM which prevents the use of querySelectorAll() or getElementById() methods to imperatively modify specific nodes. Instead, your site dynamically responds to input by storing attributes in state and re-rendering elements as needed. …React2 min readReact2 min read
Published in JavaScript in Plain English·Aug 9, 2021What’s a Ref Anyway?React Refs — Imperatively Modifying Child Nodes — In vanilla JavaScript, imperative modification of the DOM is relatively straightforward. You grab a DOM node via document.querySelector() or document.getElementById(), and either immediately modify it or store it in a variable for later reference. React, however, precludes these methods due to its usage of a virtual DOM. …React2 min readReact2 min read
Published in JavaScript in Plain English·Aug 3, 2021How to Implement Infinite Scroll BehaviorUtilizing MDN’s Intersection Observer — This past week I decided to incorporate an infinite scrolling feature into my current project. Anyone who’s spent even the smallest amount of time on the internet is likely familiar with this behavior. Given a feed, news page, list, etc., …Java Script3 min readJava Script3 min read
Published in JavaScript in Plain English·Jul 27, 2021How to Remove Duplicate Objects in a JavaScript ArrayFilter Data With the Help of a Dictionary — This past week, I ran into a problem while working on the reducer logic of my application. I needed to ensure the reducer was not adding duplicate data to state. …Java Script2 min readJava Script2 min read
Published in Geek Culture·Jul 20, 2021Writing Custom Rake TasksNamespacing, Modules, and Meta Tasks — Rake, which stands for “Ruby Make”, is a ruby utility that takes the place of the common Unix make utility. If you’ve worked with rails at all I’m sure you’re familiar with using commands such as rake db:migrate or rake db:rollback to manage your server’s database. …Ruby On Rails2 min readRuby On Rails2 min read
Published in JavaScript in Plain English·Jul 13, 2021I Cloned the Instagram Search Field using React (And What I Learned Along the Way)useRef, onClick events, and more — Though I’ve moved on to other pursuits, the knowledge and wisdom I gathered while studying music will always stay with me. One such nugget of wisdom comes from the great Clark Terry: “Imitate. Assimilate. Innovate.” …React6 min readReact6 min read
Published in Geek Culture·Jul 5, 2021What’s the Deal With Box Sizing?Margins, padding, borders, and more — When it comes to CSS, everything is a box. It doesn’t matter if it’s a button, an input, a div, a span, etc. At the end of the day, they’re all boxes in the viewport. …CSS4 min readCSS4 min read
Published in Geek Culture·Jun 29, 2021Intro To Algorithms: Understanding QuickSortA foundational algorithm explained — The QuickSort algorithm is one of many examples that utilize the divide and conquer paradigm. As the name suggests, this paradigm involves breaking the problem down into smaller and smaller chunks until a base case is reached. At that point, you’ve broken the problem down into small enough bits that…Algorithms5 min readAlgorithms5 min read
