Conditionally render a Turbo Frame shared between multiple views
We explore several solutions to a common Hotwire problem.
Read MoreWe explore several solutions to a common Hotwire problem.
Read MoreFor 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.
Read MoreThe next release of Rails will ship with a CI template that will "work out of the box"... unless you're using RSpec.
Read MoreLearn how to authorize requests at the routing layer to improve security and ergonomics.
Read MoreMy client project uses a polymorphic relationship between several models in an effort to create a flexible system of associations.
Read MoreHow do you manage queries when your Rails application isn't the only thing reading your database?
Read MoreRead this the next time you need to build a complicated form.
Read MoreYou don't need a sophisticated caching mechanism to improve your application's performance. All you need is a basic understanding of the HTTP specification.
Read MoreLearn how to build a production ready Rack application without a framework like Rails or Sinatra.
Read MoreRails writes a new cache entry based on the first request. But what happens when that request is from an admin?
Read MoreLearn how to improve the interface of your existing Active Record Models with this underutilized API.
Read MoreBecause 0x0000000103f70c98 never helped anyone.
Read MoreLearn about an unexpected limitation with this API and how to combat it universally.
Read MorePassword managers aren't the only way to store and share sensitive information. Learn how to create a simple CLI for encrypting files.
Read MoreWhen 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.
Read MoreTime 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.
Read MoreYour 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.
Read MoreYou 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?
Read MoreHow do you even save a “duration”, let alone query for records by that value? It’s actually easier than you think.
Read MoreLearn how to track user events without sacrificing privacy and performance.
Read MoreRails 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.
Read MoreLearn how to effectively render tooltips in Rails without writing any JavaScript.
Read MoreIf 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.
Read MoreDo 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.
Read MoreAre 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.
Read MoreIn 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.
Read MoreIn this tutorial, we’ll build a full-featured API in Rails with authentication. Below is what we’ll cover.
Read MoreIn 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.
Read MoreIn 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.
Read MoreLearn how to validate a form in real-time while conditionally preventing it from being submitted.
Read MoreIn 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.
Read MoreIn this tutorial I’ll show you how to leverage the Microlink API to generate link previews in Ruby on Rails.
Read MoreIn 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.
Read MoreImagine you have multiple identical elements on a page and that you need to select a specific element during a system test.
Read MoreI 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.
Read MoreIn 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.
Read MoreI 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.
Read MoreYou 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.
Read MoreIn this tutorial I am going to show you how to revert and restore records using the PaperTrail Gem.
Read MoreBy 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.
Read MoreSage 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.
Read MoreMany 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.
Read MoreWordPress 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.
Read MoreI 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.
Read MoreSnippets 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.
Read MoreForesty 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.
Read MoreThe 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.
Read MoreSometimes 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.
Read MoreBy 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.
Read MoreRails 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.
Read MoreWith 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.
Read MoreThere 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.
Read MoreImagine 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.
Read MoreThere may be times when you want to customize the column name to be more expressive.
Read MoreI 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.
Read MoreIf 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 "".
Read MoreI 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.
Read MoreI 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.
Read MoreI 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.
Read MoreIn 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.
Read MoreI 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.
Read MoreIn 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.
Read MoreIn 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.
Read MoreIn 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.
Read MoreIn this tutorial we are going to build a store locator using a proximity search. Below is the final result.
Read MoreThere 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.
Read MoreIn 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.
Read MoreI 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.
Read MoreI 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.
Read MoreI 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.
Read MoreWhen 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.
Read MoreDrupal’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.
Read MoreLet’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.
Read MoreDrupal’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?
Read MoreLet’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.
Read MoreDrupal’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.
Read MoreThis 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.
Read MoreAt 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.
Read MoreLearn how to correctly display repeating dates in Drupal using the Date Repeat API
Read MoreSometimes 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.
Read MoreSite 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.
Read MoreOK, 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.
Read MoreYou 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.
Read MoreDrupal’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.
Read MoreIn 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.
Read MoreSalesforce 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.
Read MoreThe 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:
Read MoreBy 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.
Read MoreYou 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.
Read MoreThanks 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.
Read MoreSites 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”?
Read MoreI 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.
Read MoreI 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.
Read MoreLoading 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.
Read MoreDrupal 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.
Read MoreDrupal’s FlexSlider module allows for creation of responsive image sliders and carousels. This is perfect for creating banner slideshows, or just organizing images.
Read MoreIf 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.
Read MoreLast 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.
Read MoreI 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.
Read MoreMost websites have a copyright in the footer, like ©2015. However, if you do this using static text, you’ll need to be sure to update this annually. Wouldn’t it be nice to automate this process?
Read MoreA 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.
Read MoreWith 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:
Read MoreEvery 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.
Read More