By default, browsers will not wrap text at syllable boundaries. Text is wrapped at word boundaries only.

This card explains some options to make browsers wrap inside a long word like "Donaudampfschifffahrt".

Option 1: hyphens CSS property (preferred)

Modern browsers can hyphenate natively. Use the hyphens CSS property:

hyphens: auto

There is also hyphens: none (disable hyphenations even at ­ entities) and hyphens: manual (hy...

Using ffmpeg, you can easily re-encode a video to reduce its file size.

Command

Do it like this:

ffmpeg -i input.mp4 -c:v libx264 -crf 23 -preset slow -c:a copy -movflags +faststart output.mp4

Arguments

• -i input.mp4 specifies your input file
• -c:v libx264 specifies H.264 encoding.
  • Use -c:v libx265 for H.265/HEVC. It's an excellent modern encoding standard that is fairly widely supported, but not on older devices.
• -crf 23 specifies the Constant Rate Factor, i.e. video quality.
  • Lower values mean higher...

Hint

If you are using our opscomplete.com hosting we can enable this for your deployment on request.

If you're lucky DO_NOT_TRACK=1 opts you out of CLI telemetry - it's not widely adopted. When you're using any of the libraries below, I'd rather opt out explicitly:

Yarn

https://yarnpkg.com/advanced/telemetry (Since: Version 2.2)

Disable for a project:

# .yarnrc.yml
---
enableTelemetry: ...

In Slack, the settings dialog only offers a fixed selection of fonts. You can use any font you like using the /slackfont command.

Fonts need to be installed on your machine. Webfonts beyond those provided by Slack won't magically work unless you install them locally.
Only the chat font can be changed. The monospaced font used for code blocks isn't easily customizable.

Example usage

• /slackfont Comic Neue to use "Comic Neue" (if installed)
• /slackfont system-ui to use your desktop's system font in Slack.
• /slackfont (withou...

We structure our CSS using the BEM pattern.

Our naming convention for blocks, elements and modifiers has evolved over the years. This card shows our current style and various alternative styles that you might encounter in older projects.

The difference between the various styles are mostly a matter of taste and optics. I do recommend to not mix styles and be consistent within a given project.

Current convention

Our current BEM naming convention looks...

• Reading a URL via GET:

  curl http://example.com/
  

• Defining any HTTP method (like POST or PUT):

  curl http://example.com/users/1 -XPUT
  

• Sending data with a request:

  curl http://example.com/users -d"first_name=Bruce&last_name=Wayne"
  

  If you use -d and do not set an HTTP request method it automatically defaults to POST.

• Performing basic authentication:

  curl http://user:password@example.com/users/1
  

• All together now:

  curl http://user:password@example.com/users/1 -XPUT -d"screen_name=batman"
  

...

Caution when using .where to exclude records from a scope like this:

# Fragile - avoid
User.where("id NOT IN (?)", excluded_ids)

When the exclusion list is empty, you would expect this to return all records. However, this is not what happens:

# Broken example
User.where("id NOT IN (?)", []).to_sql
=>  SELECT `users`.* FROM `users` WHERE (id NOT IN (NULL))

Passing an empty exclusion list returns no records at all! See below for better implementations.

Rails 4+

Use the .not method to let Rails do the logic

`...

Rails wraps your parameters into an interface called StrongParameters. In most cases, your form submits your data in a nested structure which goes hand in hand with the strong parameters interface.

Example:

curl -X POST -d "user[name]=bob" https://example.com/users

class UsersController
  def create
    User.create!(params.expect(user: [:name])) # Or User.create!(params.require(:user).permit(:name))
  end
end

This works well most of the time...

This decision tree describes how to use the alt attribute of the element in various situations. For some types of images, there are alternative approaches, such as using CSS background images for decorative images or web fonts instead of images of text.

Questions asked:

• Does the image contain text?
• Is the image used in a link or a button, and would it be hard or impossible to understand what the link or the button does, if the image wasn’t there?
• Does the image contribu...

Elements can be hidden and shown by toggling the display property. However, this is not animatable, so we often turn to opacity. At opacity: 0, the element is hidden, and with a nice transition on that property, it can be faded in and out smoothly.

Yet, opacity only hides visually, not technically: the element is still focusable and visible to screen readers. So, how can we fade an element while maintaining accessibility?

Enter visibility. It also hides elements, bu...

Starting with Ruby 1.9, most #each methods can be called without a block, and will return an enumerator. This is what allows you to do things like

['foo', 'bar', 'baz'].each.with_index.collect { |name, index| name * index }
# -> ["", "bar", "bazbaz"]

If you write your own each method, it is useful to follow the same practice, i.e. write a method that

• calls a given block for all entries
• returns an enumerator, if no block is given

How to write a canonical each method

To write a m...

ActiveSupport (since 4.1) includes test helpers to manipulate time, just like the Timecop gem:

• To freeze the current time, use freeze_time (ActiveSupport 5.2+):

  freeze_time
  

• To travel to a specific moment in time, use travel_to:

  travel_to 1.hour.from_now
  

  Important

  When freezing time with #travel_to, time will be frozen (like with freeze_time). This means that your application can't detect passage of time by using Time.now.

• To travel a re...

When restoring a PostgreSQL dump using pg_restore, you usually add the --clean flag to remove any existing data from tables.

Note that this only removes data from tables that are part of the dump and will not remove any extra tables. You need to do that yourself.

When is this relevant?

As an example: You want to load a staging dump into your development machine. On your development machine, you have run migrations that introduced more tables which do not yet exist on staging. pg_restore with --clean will loa...

The new params.expect method in Rails 8 improves parameter filtering, addressing issues with malformed input and enhancing security. It provides a cleaner, more explicit way to enforce the structure and types of incoming parameters.

What changed

• Replaces require and permit: Combines both methods for concise parameter validation.
• Explicit Array Handling: Requires double array syntax to define arrays of hashes, improving clarity.
• Enhanced Validation: Ensures expected parameter structure, rejecting malformed input wi...

Bundler allows you to specify the name of the Gemfile you want to bundle with the BUNDLE_GEMFILE environment variable.

BUNDLE_GEMFILE=Gemfile.rails.7.2 bundle

By default, bundler will look for a file called Gemfile in your project, but there may be cases where you want to have multiple Gemfiles in your project, which cannot all be named Gemfile. Let's say for example, you maintain a gem and want to run automated tests against multiple rails versions. When you need to bundle one of your secondary Gemfiles, the solution above ...

Also see the list of IRB commands.

Switching the context

Changes the "default receiver" of expressions. Can be used to simulate a "debugger situation" where you are "inside" an object. This is especially handy when needing to call private methods – just invoke them, no need to use send.

• Switch to an object: chws $object
• Reset to main: chws
• Show current context: cwws (usually shown in IRB prompt)

[Technical details](https://technology.doximity.com/articles/the-hidden-gems-of-r...

TL;DR: All modern browsers default to using the <html> element as the main document viewport. In CSS, prefer to set overflow properties to html (or :root).

Scrolling the main viewport with JavaScript

The browser's main document viewport is also scrollable by default. The element that corresponds to the main viewport is either <html> (document.documentElement) or <body> (document.body). Which one depends on the browser.

When you want to update the current `sc...

Cucumber allows for prose in features and scenarios. Example:

Feature: Cancel account

  There are several ways to cancel a user account. Admins need to 
  do it in complex cases, but normally, users can do it themselves.
  
  Scenario: User cancels his own account
    
    Users should be able to cancel an account themselves, so the 
    admins do not need to do it.
    
    Given a user account for "willy@astor.de"
    When I sign in as "willy@astor.de"
    And I follow "Cancel account"
    Then I should see "Account canceled"...

Spreewald comes with a selector_for helper that matches an English term like the user's profile into a CSS selector. This is useful for steps that refer to a particular section of the page, like the following:

Then I should see "Bruce" within the user's profile
                                 ^^^^^^^^^^^^^^^^^^

If you're too lazy to manually translate English to a CSS selector by adding a line to features/env/selectors.rb, we already have an [auto-mapper to translate English into ...

When you are working with SVG files and ImageMagick you can get different results on different machines depending on which additional packages you have installed.

From: http://www.imagemagick.org/script/formats.php

ImageMagick utilizes inkscape if its in your execution path otherwise RSVG. If neither are available, ImageMagick reverts to its internal SVG renderer.

In interactive commands, Git allows the user to provide one-letter input with a single key without hitting enter (docs).

# Enabled this feature globally
git config --global interactive.singlekey true

# Or enable this feature locally for a single repository
git config interactive.singlekey true

This allows you to hit "y" instead of "y + ENTER" to move to the next hunk.

Stage this hunk [y,n,q,a,d,s,e,?]?

When building a web application, one is tempted to claim it "done" too early. Make sure you check this list.

Different screen sizes and browsers

Desktops, tablets and mobile devices have all different screen resolutions. Does your design work on each of them?

• Choose which browsers to support. Make sure the page looks OK, is usable and working in these browsers.
• Use @media queries to build a responsive design
  • If you do not suppo...

By default, Rails views escape HTML in any strings you insert. If you want to insert HTML verbatim, you need to call #html_safe. However, #html_safe does not "unescape" a string. It merely marks a string as safe for unescaped insertion.

How html_safe works

Calling html_safe on a String returns a new object that looks and acts like a String, but actually is a ActiveSupport::SafeBuffer:

"foo".length
# => 3
"foo".class
# => String

"foo".html_safe.length
# => 3
"foo".html_safe.class
# => ActiveSupport::S...