Since late 2015, all major browsers (still excluding Firefox) support pointing device media queries. These can be used to distinguish e.g. coarse from fine pointers (e.g. finger vs mouse), or a device with hover support from one without (e.g. desktop with mouse vs tablet).

Motivation

When hover styles modify the DOM, most mobile devices activate the hover styles on first tap. A second tap is required to trigger a click. While this can be handy, at times it makes the UX worse.

Another issue with hover styles is that they tend to st…

The attached patch lets you find a record by a string or number in any column:

User.find_by_anything('carla')
User.find_by_anything('email@domain.de')
User.find_by_anything(10023)

There's also a bang variant that raises ActiveRecord::NotFound if no record matches the given value:

User.find_by_anything!('carla')

Boolean and binary columns are excluded from the search because that would be crazy.

I recommend copying the attachment to features/support/find_by_anything.rb, since it is most useful in Cucumber step …

…

Rails asset pipeline

As in newer Rails all assets are precompiled and the path above /huge-lib.js will at least not exist in production. Here is our preferred way to solve this:

1. Copy the large library to your vendor folder e.g. vendor/asset-libs/huge-lib/huge-lib.js

2. Create a new file e.g. app/assets/javascripts/huge-lib.js with the following content:

//= require huge-lib.js

3. Allow this file to be precompi…

In MySQL,

CONCAT('foo', 'bar', NULL) = NULL

the NULL always wins in MySQL.

If you would rather treat NULL as an empty string, use CONCAT_WS (concatenation with separator) instead:

CONCAT_WS('', 'foo', 'bar', NULL) = 'foobar'

PostgreSQL

In PostgreSQL the NULL is not viral in CONCAT:

CONCAT('foo', 'bar', NULL) = 'foobar'

Updated title to make clear what the card is actually about.

Slightly restructured.

Just like Ruby Gems tag their version releases to the corresponding Git commit, it can be helpful to track production deploys within the commit history. This task does the tagging for you.

Capistrano 3

# lib/capistrano/tasks/deploy.rb
namespace :deploy do
  ...

  desc 'Tag the deployed revision'
  task :tag_revision do
    date = Date.today.to_s

    puts `git tag deploy-#{date} #{fetch :current_revision}`
    puts `git push --tags origin`
  end

end

```
# config/deploy/production.rb
after 'deploy:finished', 'deploy:tag_revi…

Here is how to model basic logic in media queries.

AND

With keyword and.

# Target viewport widths between 500 and 800px
@media (min-width: 500px) and (max-width: 800px)

OR

Comma-separated.

# Target viewport widths below 500 or above 800px
@media (max-width: 500px), (min-width: 800px)

NOT

Needs a little overhead with not all and.

# Target devices that can't hover
@media not all and (hover)

See CSS: Using interaction media detection on why you'd need this.

Find-as-you-type boxes are usually built by observing changes in a text field, and querying the server via AJAX for search results or suggestions when the field has changed.

A common problem with this implementation is that there is no guarantee that AJAX responses are evaluated in the same order as the original requests. The effect for the user is that the search results are flashing back and forth while the user is typing the query, and when the user has stopped typing the last results don't always match the final query.

You won't notice…

When you need to store structured data (like Ruby hashes) in a single database column with ActiveRecord, a simple way is to use PostgreSQL's jsonb columns. ActiveRecord will automatically serialize and deserialize your Hash to and from JSON, and you can index JSON paths for fast reads.

As an alternative, ActiveRecord::Store offers a way to store hashes in a single database column. This card will show you how to migrate those hashes in an ActiveRecord::Migration by example: …

To disable the mostly useless automatic suggestion popups in RubyMine, go to File / Settings, then to Editor / General / Code Completion and uncheck Auto-display code completion.

You can still open the popup by pressing CTRL + Space. And you probably want to use Context-dependent word expansion instead, anyway.

In an environment:

config.logger = Logger.new('/dev/null')

This card existed before, but was outdated due to browser implementation changes. The information below is validated for the current list of browsers we support.

By default your html and body elements are only as high as the actual page content. If you only have two lines of text in your page, your html and body elements will only be around 40 pixels high, regardless of the size of your browser window.

You might be surprised by this, since setting a background on either html and body does cover the enti…

By default, validates_uniqueness_of does not consider "username" and "USERNAME" to be a collision. If you use MySQL this is probably not what you want, since string comparisons are case-insensitive in MySQL.

(If you use PostgreSQL, read this instead.)

Say you have a user model

class User < ActiveRecord::Base
  validates_uniqueness_of :name
end

with a unique index in the database.

If you try to create the users "user" and "USER", this will not trigger a validation error, but may fail with a SQL error due to d…

The method cookies is defined in the ActionController and should never be overwritten.

Bad example

class StaticPagesController < ApplicationController

  def imprint
  end

  def cookies
    redirect_to '/'
  end

end

If you create an action called cookies, any call to the cookie storage will be broken and call the method. What's more, in this example calls to static_pages_controller#imprint might as well end up redirecting to the homepage.

Solution

Just define the action as cookies_action or similar and adjust…

Note: Modern Rails has two build pipelines, the asset pipeline (or "Sprockets") and Webpacker. The principles below apply for both, but the examples shown are for Sprockets.

Every page in your application uses many assets, such as images, javascripts and stylesheets. Without your intervention, the browser will request these assets again and again on every request. There is no magic in Rails that gives you automatic caching for assets. In fact, if you haven't been paying attention to this, your application is probabl…

Authentication is a special part of web applications. On the one hand, it usually is a crucial security mechanism restrict access to certain people and roles. On the other hand, most users authenticate only once, so it is very unlikely to spot issues by accident.

So, here comes a quick checklist to help you verifying your authentication solution is all set.

• This should be default: use HTTPS with HSTS. The HSTS part is important.
• Use a reliable authentication solution, e.g. Clearance or [Devise…

Browsers' printing methods usually don't print background colors. In most cases this is the desired behavior, because you don't want to spent tons of ink printing the background of a web page. But in some cases you want to print the background color of elements, e.g. bars of a chart. For those elements you need to set the following css styles:

Chrome and Safari:

-webkit-print-color-adjust: exact;

Firefox:

color-adjust: exact;

Authentication is hard: there are many edge cases, and most users (including yourself) usually only go the "happy path" once and never see the edge cases. If you have rolled your own authentication, or been using older authentication solutions, or resorted to HTTP Basic Authentication, this card will tell you what to do to make your application safe.

Any application that stores sensitive data in the browser

That is: cookies, e.g. by offering a login.

• Ask the admins to [turn on SSL](https://makandracards.com/makandra/1416-integrate-s…