Articles
Node.js Development with DDEV 4/2/2024 DDEV is a tool that allows developers to work with their own sandboxed version of a website. It spins up a set of containers that behave like a regular server-hosted copy of the site. The local version gets a nice URL, has its own database, and can run PHP all in the container—regardless of whether the host machine has that software installed.
While DDEV is pretty ubiquitious in CMS communities like Drupal, WordPress, and Typo3, it's not as familiar to developers working in Node.js, Python, or other decoupled setups. This article is for those developers.
Sorting Data in JavaScript 2/14/2024 Our brains are great at identifying patterns and outliers, however, this becomes harder to do when data isn’t in some logical order. Luckily, as developers, we have tools we can use to sort data into any order we desire.
In Javascript, every single array has a
sort()method. This takes all the items in the array, and rearranges them into the default order. Consider the code below:Web Sustainability Guidelines 9/13/2023 Scrolling through my Mastodon feed this morning I came across this post:
I'm thrilled to see a set of guidelines focused on sustainability and ESG-conscious critera. The environmental, social, and governance dimensions of the tech sector and society at large have been big in the news the last few years. We just had yet another hottest summer on record, unionization is on the rise, electric vehicles are becoming more common on the roads, and the end of Affirmative Action leaves the future of corporate DEI intiatives in doubt. Not only are these topics the big news stories right now, but they're also - unfortunately - politically charged and occasionally divisive. It's great to see an organization like the W3C ignoring the noise and calmly pushing forward a list of sustainability guidelines.
Response to Pantheon's DrupalCon Round Table 7/5/2023 The blog post that follows contains my opinions, which do not necessarily reflect the opinions of organizations with which I may be associated. Special thanks to the Drupal community members that have shared their time & insight to help me craft this response: @alison, @hanpersand, @volkswagenchick, and anonymous others
On April 20, 2023, a LinkedIn post sparked a debate in the Drupal community and eventually led to Ars Technica covering the story. The post was a simple question; would the hosting platform Pantheon explain why they were hosting the website of an SPLC-designated hate group. Like so many other divisive topics in the public discourse, this quickly turned into two sides largely talking past each other. Two of the company's founders, Josh Koenig and David Strauss, hosted a round table discussion at DrupalCon Pittsburgh, to take questions from community members and attempt a dialogue.
Bitmasks in JavaScript: A Computer Science Crash Course 8/9/2022 One of the nice things about front-end web development as a career choice is that the software and coding languages are available on every modern machine. It doesn’t matter what operating system or how powerful your machine is. HTML, CSS, and JavaScript will run pretty well on it. This lets a lot of us in the industry bypass the need for formal education in computer science.
Unfortunately, this also has the side effect of leaving little gaps in our knowledge here and there, especially in strategies like bitmasking, which are seldom used in web development.
Add a Composer Script to Your Module or Theme 3/9/2022 Following Drupal 8’s ambitious overhaul to “get off the island,” the recommended way to create a new Drupal site is to use composer to manage all PHP dependencies. By now, most Drupal developers will have had a chance to install a new module or update existing modules using composer’s
requireorupdatecommands, but did you know that you can also use composer to run scripts to interact with your code?Composer scripts can do almost anything you want, from running tests to creating scaffolding for a project. In the example below, we use a composer script to assist users in creating a subtheme of the uikit contrib theme.
Understanding & Debugging Stacking Contexts (and the Z-Index) 8/18/2021 One of the great joys of front-end development is being able to wrestle a bunch of rectangular elements into different shapes and arrangements to create beautiful, intuitive layouts.
One of the great frustrations of front-end development is the unexpected interaction and overlapping of those same elements. Struggling to arrange elements along the z-axis, which extends perpendicularly through the computer screen towards and away from the viewer, is such a shared front-end experience that an element’s z-index can sometimes be used as a frustrate-o-meter gauging the developer’s mood.
Using the flag module to trigger additional actions 6/2/2021 On a recent pet project I wanted to use the flag module to provide a quick bookmarking solution so users could mark nodes they were interested in keeping an eye on, and had the thought, "there must be a way to use this to trigger side effects". There is, but it's a bit more complicated than Drupal's well-known hooks. In searching for a way to do this I came across the article Perform actions on flag/unflag in Drupal 8 by Goran Nikolovski at StudioPresent, which was incredibly helpful.
Symfony's website has some pretty good documentation around Events & Event Listeners, but the tl;dr: is
Trigger JavaScript changes at your CSS breakpoints 4/14/2021 Responsive web design has been around for a while, and is definitely the preferred way to handle displaying your website to users across a virtually infinite number of device types, shapes, and sizes. While the use of media queries is pretty well established and wide-spread for targeting specific CSS rules, what if you wanted to use device width or some other media query to trigger your javascript?
Web APIs are a marvelous thing, offloading a lot of work from the single-thread-limited javascript engines into the browser application itself to keep your web experience snappy and performant. In this case, the Window API provides a method matchMedia which allows us to effectively copy and paste our breakpoints from our S/CSS into our javascript. It works like this:
Working With DateTime Objects in Drupal 8 & 9 3/5/2021 When working with dates in Drupal, all information is stored in the database as seconds since Jan 1, 1970 (GMT). This means that times will be stored in GMT timezone, which is 4 or 5 hours shifted relative to EST. In most cases, modules do a good job shifting times back to the correct timezone, but if you need to do something custom outside a field formatter, you may have to handle timezone shifting on your own.
For instance, consider a node type
event. We can use core's Date Range field type to store the start/end datetime objects, but the node type's display settings use the "Default (All Day)" display format which leads to dates displaying the date on both the start & end datetimes (e.g. Mar 5, 2021 4pm - Mar 5, 2021 8pm).