Latest posts from Steve Polito

Process slow network requests with Turbo and Active Model

Learn how to build a dynamic loading screen without writing a line of JavaScript.

Build a (better) search form in Rails with Active Model

Harness the power of Active Model to supercharge your search forms.

Conditionally render a Turbo Frame shared between multiple views

We explore several solutions to a common Hotwire problem.

A pragmatic guide for adding React to an existing Rails application (and still use Hotwire)

For a long time, I thought that using React with Rails was an "all-or-nothing" proposition. I'm now realizing that the two can be integrated on a spectrum.

Configure GitHub Actions to work with rspec-rails

The next release of Rails will ship with a CI template that will "work out of the box"... unless you're using RSpec.

Rails advanced routing constraints

Learn how to authorize requests at the routing layer to improve security and ergonomics.

Are your polymorphic relationships correctly enforced?

My client project uses a polymorphic relationship between several models in an effort to create a flexible system of associations.

Database View Backed Scopes In Rails

How do you manage queries when your Rails application isn't the only thing reading your database?

Are you absolutely sure you know how to use the button element?

Read this the next time you need to build a complicated form.

Speed up your Rack application with HTTP

You don't need a sophisticated caching mechanism to improve your application's performance. All you need is a basic understanding of the HTTP specification.

A pragmatic guide to building a Rack application from scratch

Learn how to build a production ready Rack application without a framework like Rails or Sinatra.

Are you absolutely sure your Rails caching strategy isn't leaking sensitive information?

Rails writes a new cache entry based on the first request. But what happens when that request is from an admin?

Building Value Objects in Rails with composed_of

Learn how to improve the interface of your existing Active Record Models with this underutilized API.

Inspecting Ruby's inspect method

Because 0x0000000103f70c98 never helped anyone.

Are you absolutely sure your `has_one` association really has one association?

Learn about an unexpected limitation with this API and how to combat it universally.

How to encrypt files with Ruby and Active Support

Password managers aren't the only way to store and share sensitive information. Learn how to create a simple CLI for encrypting files.

How to click links in Rails Mailers when writing tests

When writing an integration or system test in Rails, have you ever needed to click a link in an email? This is especially important for testing links with a unique token or that expire, such as password reset emails. Simply checking that the link exists is not sufficient, since the page it leads to is ephemeral.

Your flaky tests might be time dependent

Time dependent tests are difficult to diagnose, and the symptoms don’t present themselves until it’s too late. This article will help you determine if your test suite is time dependent.

Automate manual deployments with Git and binstubs

Your team’s manual deployment process doesn’t have to be so manual. Here’s how we automated our team’s deployment process with a few lines of bash and basic Git knowledge.

Detect anomalies in user behavior using Rails and PostgreSQL

You probably use some type of error monitoring software to notify you when an exception is raised in your application, but are you being notified when there is an anomaly in user behavior?

Query by Duration in Active Record

How do you even save a “duration”, let alone query for records by that value? It’s actually easier than you think.

Rails Server Side Analytics From Scratch

Learn how to track user events without sacrificing privacy and performance.

Rails Setup Script Improvements

Rails ships with a setup script that automates bootstrapping a new application, but did you know that you’re free to edit this script? In this quick tutorial, I’ll show you how you can improve the default Rails setup script to create a more consistent and helpful onboarding experience for folks on your team.

Hotwire: Asynchronously loaded tooltips

Learn how to effectively render tooltips in Rails without writing any JavaScript.

Rails Authentication From Scratch

If you’re like me then you probably take Devise for granted because you’re too intimidated to roll your own authentication system. As powerful as Devise is, it’s not perfect. There are plenty of cases where I’ve reached for it only to end up constrained by its features and design, and wished I could customize it exactly to my liking.

Rails Remote Elements Tutorial

Do you need to create real-time features in your Rails app, but either can’t use Turbo or don’t want to use a front end framework like React? Fortunately older versions of Rails actually provide this functionality of the box. In this tutorial I’ll show you how to create a single page app in Rails from scratch using remote elements and Stimulus.

Lazy Load Content in Rails from Scratch

Are certain pages on your Rails app loading slowly? You might want to consider loading those requests in the background. It’s easier than you think. In this tutorial I’ll show you how to lazy load content in Rails without Hotwire.

Automatically Unsubscribe from Emails in Rails (and Control Email Preferences)

In this tutorial, I’ll show you how to add a link to any Rails Mailer that will allow a user to automatically unsubscribe from that email. As an added bonus, we’ll build a page allowing a user to update their email preferences across all mailers.

Build an API in Rails with Authentication

In this tutorial, we’ll build a full-featured API in Rails with authentication. Below is what we’ll cover.

Search Across Multiple Models in Rails

In this tutorial you’ll learn how to search across multiple models in Rails. Below is a demo of what we’ll be building. Note how both Post and User records appear in the search. As an added bonus, we highlight the search query in the results.

Use Pundit as a Rails Feature Flag System

In this tutorial, I’ll show you how to create a feature flag system in Rails using pundit and a features column on the users table.

Real-time Form Validation in Ruby on Rails

Learn how to validate a form in real-time while conditionally preventing it from being submitted.

Create an infinite scrolling blog roll in Rails with Hotwire

In this tutorial, I’ll show you how to add an infinitely scrolling blog roll using Rails and Hotwire. Note that this is different than Chris Oliver’s awesome infinite scroll tutorial, in that we’re loading a new post once a user scrolls to the bottom of a current post. Below is a demo.

Generate Link Previews in Rails with Microlink

In this tutorial I’ll show you how to leverage the Microlink API to generate link previews in Ruby on Rails.

Auto Save Form Data in Rails

In this tutorial I’m going to show you how to automatically save form data in Rails. Instead of saving a draft to the database, we’ll simply leverage Stimulus JS to save the data to localStorage. Below is what we’ll be creating.

Easily find elements with XPath in Capybara by using Chrome's Dev Tools

Imagine you have multiple identical elements on a page and that you need to select a specific element during a system test.

Install Bootstrap 4 on a Rails 6 App with Webpacker

I know many existing tutorials explain how to install Bootstrap 4 on a Rails 6 application with Webpacker (like the GoRails example). However, I wanted to create this tutorial to highlight a few gotchas, as well as highlight why and how I made some of my choices.

Configure Travis CI for Ruby on Rails

In this tutorial I am going to show you how to configure Travis CI to run your Rails’ test suite and system tests everytime you push a new change to your repository.

Developers: Use Your Platform To Start a Discussion

I am uncomfortable talking about polarizing topics, even when I agree with the majority. I steer away from political discussions because they make me feel uncomnfortable. I avoid confrontation because I’m not assertive. In short, I am a bystander. I sit back and passively watch events unfold around me, but never take action because I’m afraid of standing out. Specifically, I am talking about institutional racism in America.

Add Tailwind CSS Color Palette to Bootstrap

You might be wondering why anyone would want to add Tailwind’s default color palette to Bootstrap. It comes down to personal preference, but below are the key reasons I think this is beneficial.

PaperTrail Gem Tutorial

In this tutorial I am going to show you how to revert and restore records using the PaperTrail Gem.

Obfuscate Numerical IDs in Rails

By default, Rails displays the record’s ID in the URL (e.g. http://localhost:3000/articles/1). Although there is nothing inherently wrong with this approach, sometimes it’s helpful to obfuscate the record’s ID (e.g. http://localhost:3000/articles/xb3mm6k). In this tutorial I will show you how to obfuscate numerical IDs in Rails.

How to Deploy a Sage Theme to WP Engine

Sage is WordPress starter theme with a modern development workflow. However, deploying a Sage theme can be difficult because of its dependencies, most notably Composer and Yarn. In order to deploy a Sage theme, you need to be able to run both Composer and Yarn on your server. Furthermore, Sage doesn’t officially support hosting at WP Engine. You could deploy Sage via FTP, but this approach is error prone and inefficient. Fortunately, there are services such as DeployBot and DeployHQ that can run these builds, and them push the distributed files to the server. For this tutorial, I am going to be using DeployHQ.

Ruby on Rails with React Tutorial

Many Rails+React tutorials demonstrate how to create an API only application using Rails, and then create a separate front-end application to digest the API with React. Other React tutorials have you work with something like Firebase to handle the back-end of the application. Although both of these approaches are common and acceptable, I wanted to create an application that has all the benefits of a non API only Rails application, without the limitations and vendor lock-in of a third party service like Firebase.

In Defense of WordPress

WordPress is said to power 35% of the internet, yet it seems to get a lot of criticism amongst developers. I’ve been developing with WordPress for roughly 5 years and can empathize with many of the critiques. However, I think that most of the complaints can be attributed to misconceptions and bad first impressions. WordPress is just another technology, and is only as good as the developer it’s used by.

Why I'm Using Bootstrap In 2020

I recently needed to redevelop our agency’s website. We moved from Drupal to Jekyll in an effort to keep things simple. However, we didn’t end up changing the design much. The original design was totally custom, which meant it was up to me to create a typography system, layout system, as well as style any and all elements and components that could exist. As a web developer I’m used to this, but often overlook the complexity and redundancy involved in making the same decisions over and over again. Because of this, I decided to reach for Bootstrap, which has matured a lot in this newest release. Below are several reasons why I will continue to use Bootstrap in 2020.

Forestry CMS Snippets Demo

Snippets in Forestry are pre-defined chunks of text that can be inserted into your content. Think of them like WordPress Shortcodes. In this tutorial I will show you how to create a reusable snippet to embed responsive iframes.

Forestry CMS Blocks Field Demo

Foresty CMS allows content editors to easily manage a staticly generated site without needing to know markdown or HTML. This works really well if you’re just editing a page with a title and a body, but sometimes you need to offer more diversity. Luckily Forestry has a Block Field which allows a content editor to easily add robust content to a page. The example below shows how we can create a block field that displays highlights anywhere on a page.

Create a Nested Form in Rails from Scratch

The Rails Guides give a great example of how to create nested forms. However, Rails does not support adding fields on the fly out of the box. The cocoon Gem is one alternative, as is Ryan Bates’ excellent tutorial. However, both require jQuery which does not ship with Rails 6.

Redirect a Parent Page to its Child in WordPress

Sometimes you need to redirect a parent page to its child page, especially if you need to keep a specific type of menu hierarchy. There are several ways to do this, but I prefer using Advanced Custom Fields. This is because it allows content editors control over the redirect, and also allows for greater flexibility in the future.

Add a Featured Image to the Events Calendar Month, List and Day Views in WordPress

By default, WordPress allows you to assign a featured image to a page or post. However, if you’re using The Events Calendar, you’ll notice there’s no easy way to assign a featured image to the events month, list or day views.

Rails Ajax Examples (Without jQuery)

Rails ships with turbolinks which creates a reactive, fast application. However, there are times when turbolinks is not enough, and you’ll want to roll your own AJAX solutions.

Create a Bootstrap Starter Theme in Eleventy

With the rise in the JAMStack way of thinking, there has been a lot of development in static site generators. One that is quickly gaining popularity is Eleventy. Eleventy is very similar to Jekyll, but compiles much faster because it’s built on Node. What makes Eleventy stand out is its simplicity and flexibility.

Why I Think Rails is Still Relevant in 2019

There is currently a high demand for Javascript developers, which in turn dictates the content and curriculum of many tutorials, articles and Boot Camps. Therefore, if you’re new to web development or maybe strictly just a front end web developer, you probably don’t hear a lot about Ruby on Rails these days. I’m here to make a case that Rails is still a very relevant tool in 2019, and should not be overlooked when starting a new project.

Create Dependent Associations in FactoryBot

Imagine the following set of models and relationships: A user can add a time_entry to a job. The time_entry has a task, and that task has a rate which depends upon the job. So I need to validate that the associated time_entry on a job is associated with a rate that is also associated with that job. Basically, I want to make sure the correct rate is being applied to the job.

Use a Custom Column Name With a belongs_to Association in Rails

There may be times when you want to customize the column name to be more expressive.

Working with Radio Buttons in Netlify and Gatsby

I recently ran into an issue with Netlify form submissions on a Gatsby site. Specifically, it had to do with a group of radio buttons. I was using Bootsrap, and just used the example code as a starting point to build my form. However, I noticed that my results for that field were not saving correctly.

Pro Tip: Use the esc_attr Function to Format alt Tags When Using ACF

If you’re rendering images with ACF, make sure you run the alt text against the esc_attr function. Why? Because there’s a chance that the alt text could contain quotation marks "".

Learning WordPress as a Drupal Developer

I started my career in web development by using Drupal 7 on every project. I just assumed that WordPress could not meet my needs, and that it could not be customized as well as Drupal. However, after working within WordPress for several years, I’ve learned that WordPress can match Drupal’s functionally, and can almost always meet my needs no matter what the project scale.

Unpopular Opinion: WordPress Should Be the First Choice When Building a Website That Won't Be Maintained by a Developer or Agency

I know this article seems like clickbait, so let me try and explain myself before I lose you. In order to understand my viewpoint, it helps to know that I don’t think WordPress is the right tool for the job all the time. Rather, I think it’s the right tool for the job under specific circumstances. It just so happens that for the type of work I do, these specific circumstances are very common. I work for an agency which builds small to medium sized websites that will eventually be handed off to the client.

Seven Easy Wins Before Launching Any Website

I work for an agency that specializes in developing small to medium sized websites. Over the years I’ve found that I follow the same process when launching each website. This list isn’t comprehensive, but I’m confident that it’s applicable to any site launch.

Create a Bootstrap Theme for WordPress

In this tutorial I will show you how to create a Bootstrap theme for WordPress. If you just want the finished product, feel free to download the theme from my repository.

Create a Lead Generation Form on Netlify

I recently needed to help a client create lead generation forms on their website. The website was already in development, and was completely static. Because the site was static, I recommended they host with Netlify. I also made this recommendation because Netlify can store form submissions.

WordPress ACF Frontend Form Tutorial (With Email Notifications)

In this tutorial I’m going to show you how to create a frontend form for a custom post type that anonymous users can fill out. As an added bonus I’ll show you how you can trigger an email to be sent each time the form is submitted.

Modern WordPress Theme Development in 2019

In this article I’m going to show you my personal and opinionated WordPress theme development workflow. The goal of this article is to highlight the power of the WordPress Command Line when combined with automated build tools, along with an organized project structure.

Create a Custom Search Form in WordPress

In this tutorial we are going to create a custom search form in WordPress. Specifically, we are going to add a custom search form on the archive of a custom post type.

Create a Proximity Search in WordPress

In this tutorial we are going to build a store locator using a proximity search. Below is the final result.

Use Dashicons to Create a Social Media Menu in WordPress

There are plenty of plugins that allow you to add social media icons to your WordPress site. However, I always advocate avoiding plugins in favor of rolling out your own solution. Don’t fall into the trap of installing a plugin when you can develop your own solution using the WordPress API.

Configure RSpec and Capybara with Ruby on Rails

In this tutorial I’m going to show you how to configure your Rails app to use RSpec and Capaybara. In addition, we will also install and configure Factory Bot Rails and Database Cleaner, since these Gems help with a better testing experience.

Convert a belongs_to Association to a has_many :through Association in Ruby on Rails

I was tasked with converting a belongs_to association to a has_many :through association. The challenge was that the app was live, and there were existing relationships. I was able to convert the belongs_to association to a has_many :through association while still maintaining existing relationships by creating a custom migration file, and updating the existing models.

Configure Cloudflare DNS to Work with Netlify

I just migrated my site to Netlify but wanted to keep my DNS with Cloudflare. Below are the steps needed to configure Cloudflare DNS to Work with Netlify.

Redirect Domain Aliases to Your Primary Domain With Gatsby and Netlify

I recently redeveloped my website using Gatsby, and moved my hosting to Netlify. As part of the launch I wanted to redirect all requests from stevepolitodesign.com to my new stevepolito.design domain.

Customize a Video Thumbnail in Drupal

When you upload a video to Drupal from YouTube or Vimeo, an automatically generated thumbnail will be created. This is normally not a big deal, but wouldn’t it be nice if you could have complete control over the thumbnail that is associated with the video? Thankfully, with Drupal’s File Entity module, you can. In this tutorial, we will add the ability to add a custom video thumbnail to a video in Drupal. As an added bonus, we will use the ImageCache Actions module to automatically add a play button to each video thumbnail.

Dynamically Link to Each Month In Drupal's Calendar

Drupal’s Calendar module allows you to page between months. However, it can be frustrating for a user to have to page several months in either direction if they know what month they want to view. For example, if the current month is June but a user wants to see upcoming events in December, they would need to click through 5 times. In this tutorial, we are going to solve this problem by creating a menu where each menu item will link to each month. As an added bonus, we will make sure that the menu updates annually by using Menu Tokens.

Batch Upload Field Collection Items to Create an Image Gallery

Let’s say you want to create an image gallery on your site. Let’s say that each image also needs a caption and a photo credit field. One solution would be to create a field collection of and image, text and long text field. However, the most image galleries contain many images. It would be very time consuming to have to upload each image individually. Enter Field Collection Bulkupload. With Field Collection Bulkupload you can drag and drop multiple images onto the page and have them automatically uploaded.

Dynamically Control FlexSlider Caption Position and Color in Drupal

Drupal’s Flex Slider module allows site builders to add rotating slides with captions. Using custom CSS, site themers can adjust the caption’s position and color. This is useful when the caption color might be hard to read against the slide, or is positioned awkwardly. However, wouldn’t it be nice to have complete control over the caption’s color, position and background color right within the CMS?

Display a Calendar On Taxonomy Pages In Drupal

Let’s say you have a content type with a date field and term reference field. This content type could be specifically for events. Because of this, you most likely would like to display this content type in a calendar format. Luckily, Drupal’s Calendar module does just that. However, if a user were to visit any of the term pages associated with that content type, they would simply get a list of content by default.

Create a List Tab For Drupal Calendar

Drupal’s Calendar module allows an easy way for site builders to display events in a month, week day and year format right out of the box. However, I recently needed to add an additional tab to the view display to list all upcoming events.

Configure Drupal's Search API to Search Field Collections and Paragraphs

This tutorial will assume that you are somewhat familiar with the Search API module. It also assumes you are using the Search API with the Search API Database Search and Search API Pages modules. The goal here is to ensure paragraph and field collection fields are being indexed by Search API and associated with their host node.

Drupal Configure SMTP Module to Work with Gmail [Updated]

At this point, there have been many great tutorials written about configuring Drupal’s SMTP Authentication Support with Gmail. However, these tutorials are out dated, and do not take into account Google’s added security settings. In this tutorial I’ll show you how to configure Drupal’s SMTP Authentication Support module and update Gmail’s security setting.

Correctly Display Repeating Dates In Drupal

Learn how to correctly display repeating dates in Drupal using the Date Repeat API

Update Drupal Field Settings For Fields With Data In Database

Sometimes you need to edit a field’s configuration once there is already data store in the database for this field. If you try to do this, you’ll get the following message.

Install Drupal Memcached on a Media Temple DV Server

Site performance is crucial to a good user experience, and also is a factor in SEO. Because Drupal sites can be very query heavy at times, their performance can suffer. Luckily, there are a few caching libraries than can solve this problem and help increase performance. In this tutorial we’re going to install the Memcached library on a Media Temple DV Server, as well as configure the Memcache API and Integration module.

Drupal Salesforce Not Updating Records [Solved]

OK, so you’ve integrated your Drupal install with Salesforce and are able to pull data from Salesforce into Drupal. Everything’s working perfectly, right? Well, if you’re like me, then probably not. I noticed right away that I was running into and issue where Drupal was not updating records from Salesforce. In this tutorial, we’re going to troubleshoot the issue and implement a solution using by checking the salesforce_pull SystemQueue.

Display Field Values in an Accordion In Drupal

You probably already know that Drupal offers Views Accordion to display content in jQuery Accordions. This is fine if you’re looking to display specific content in this format, like a custom content type. However, what if you’re simply looking to display field values from a node on the node’s display in an accordion? This would require the use of contextual filters and block views if you were to use Views Accordion. However, there’s a much simpler way to achieve this functionality with Field Group and Field collection.

Make URL Patterns Match Menu Position in Drupal

Drupal’s Pathauto is a must have for any Drupal project. This tutorial will demonstrate a simple yet effective way to utilize Pathauto to create custom URL patterns that match the node’s menu position.

Pulling Data From Salesforce Into Drupal

In my last tutorial, we integrated Salesforce with a local Drupal installation. In this tutorial, we will continue to build off from what we learned and pull data from Salesforce into Drupal.

Integrate Salesforce With Local Drupal Installation

Salesforce is one of the most popular CRMs used today. In this tutorial we will integrate Salesforce with a local Drupal install in order to access the Salesforce API. This will allow us to map data between Salesforce and Drupal.

Drupal Leaflet Not Working [Solved]

The Leaflet Module for Drupal is probably the most popular mapping module. I was recently working on a project where I was mapping locations and displaying them on a Leaflet map both as a field formatter display and a views attachment. However, I was running into two problems:

Create Live Search Results (Search as You Type) in Drupal

By default, Drupal offers the ability to search the site with its core Search module. However, this module can be limiting. In this tutorial we are going to configure live results. Below is the final result. When a user begins to type, live results will appear that are linked to a node.

Track Link Clicks In Drupal

You might be wondering why you would need to track the number of times a link is clicked in Drupal, when this can be done using Google Analytics and the Google Analytics Module. However, by default this just groups all outbound link clicks as “Outbound links”. Also (as far as I can tell), this doesn’t tell you on what specific page the user clicked that particular link on.

Move a Block to a Different Region on Mobile Layouts in Drupal

Thanks to CSS3 Media Queries web developers can create a completely different layout for their websites when viewed on small screens. Drupal offers a lot of mobile first, responsive themes such as Omega, Adaptive Theme and Zen that do just this. However, there are circumstances when using responsive design is just not enough. When a user is viewing a website on a small screen, their experience is drastically different than that of a desktop user. Because of this, it might be necessary to move, replace, or even completely hide elements on the page.

Create a Reddit Style Website In Drupal

Sites that allow users to post and vote on content such as Reddit and Digg are hugely successful. In this tutorial we are going to create a Reddit style website in Drupal. What do I mean by “Reddit style website”?

Bulk Update Redirects After Changing URL Pattern in Drupal

I recently worked on a project where the site’s URL structure was going to change. This is easy to do with Pathauto, but I wanted to ensure that the old URLs would redirect to the new URLs since this would affect hundred of nodes.

Drag and Drop Batch Upload Files In Drupal

I love Drupal, but its media handling is far from ideal. Out of the box, it pales in comparison to WordPress. Most notably, Drupal does not make it easy to batch upload files via a drag and drop interface.

Load Content In Drupal Via AJAX (Without Coding)

Loading content via Ajax can create a great user experience. Instead of loading a totally new page, the desired content is loaded on the existing page in a designated location.

Drupal Smartqueue Taxonomy Tutorial

Drupal allows you to organize content into taxonomies. This is best illustrated in tagging content, similar to Twitter. Drupal then dynamically creates pages that list content that have been categorized with specific taxonomy terms. By default, Drupal organizes content on these taxonomy pages based on post date. The most recently posted content will appear first.

Drupal FlexSlider with Carousel Controls

Drupal’s FlexSlider module allows for creation of responsive image sliders and carousels. This is perfect for creating banner slideshows, or just organizing images.

Linking to Content In Drupal

If you’re using the Pathauto Module, you know that you can create custom path patterns for nodes, taxonomies and users. This is great for SEO, as well as keeping content organized. However, one of the side effects of using Pathauto is that the paths to your content can change.

Install Drupal with drush

Last week I wrote an article about how to use the command line. Now we’re going to put this knowledge to use. Using drush you can set up a fresh Drupal install in seconds.

How to Easily Change Directories In Terminal

I used to be terrified of the command line terminal. I’m a visual learner, and the command line is the exact opposite of visual. Plus, I’m a front end developer. My thought was that I didn’t need to use the command line since all I’m doing is editing HTML, CSS and jQuery.

Auto Update Copyright In Drupal Footer

Using Feature Detection to Drop Support for Older Browsers

A lot of people are familiar with conditional classes, which is a great alternative to conditional stylesheets or css hacks. However, these only target IE. Even though most of us have become dependent on modern browsers like Chrome or Firefox, we still forget that they are not immune to problems. And let’s not forget mobile browsers like Opera Mini or Android Browser.

Drupal Unable to send e-mail on BlueHost Server

With the launch of this new site, I encountered a very frustrating error. Drupal was unable to send emails, and I was receiving the following error message:

5 Drupal Modules You Should Start Using

Every Drupal developer knows about the heavy hitters like views, display suite and context. However, this is a list of 5 Drupal Modules that I use frequently, because they save time and make client administration easier.

Latest posts from Steve Polito

Latest Posts