3674 cards
View
Repeats

Don't use the || operator to set defaults

I often see the use of || to set a default value for a variable that might be nil, null or undefined.

x = x || 'default-value'

This pattern should be avoided in all languages.

While using || works as intended when x is null or an actual object, it also sets the default value for other falsy values, such as false. false is a non-blank value that you never want to override with a default.

To make it worse, languages like JavaScript or Perl have [many more fal…

Linked content

Fix error: rails console No such file to load -- irb/encoding_aliases.rb (LoadError)

I got this error after upgrading Ruby from 2.4.5 to 2.6.4 when I opened the Rails console - rails server still worked.

```
Running via Spring preloader in process 14679
Loading development environment (Rails 5.2.2.1)
Traceback (most recent call last): …/lib/ruby/gems/2.6.0/gems/spring-2.1.0/lib/spring/application.rb:175:in 'fork': No such file to load – irb/encoding_aliases.rb (LoadError) …/lib/ruby/gems/2.6.0/gems/spring-2.1.0/lib/spring/application.rb:175:in 'fork': undefined method 'reject!' for nil:NilClass (NoMethodError) …/li…

Deprecated

Linux: Shell script to easily update chromedriver

Updating Chromedriver is often a hassle: If you use chromium-chromedriver from the Ubuntu sources, it usually won't be updated when a new Chrome version is released. Manually downloading it from the official page is a very manual process. And I don't really want to use remote code like the "webdrives" gem because of paranoia.

Cry no more, for here is a tiny bash script that will download the latest chromedriver version and place it inside ~/bin. (If you use a different location, adjust accordingly).

```
#!/bin/bash

VERSION_URL="https:…

How to enable Chromedriver logging

When using Chrome for Selenium tests, the chromedriver binary will be used to control Chrome. To debug problems that stem from Selenium's Chrome and/or Chromedriver, you might want to enable logging for the chromedriver itself. Here is how.

Option 1: Use Selenium::WebDriver::Service

In your test setup, you may already have something like Capybara::Selenium::Driver.new(@app, browser: :chrome, options: ...), especially when passing options like device emulation.

Similar to options, simply add an extra key service and pass an ins…

Repeats

Organize large I18n dictionary files in Rails 3+

If you're suffering from a huge de.yml or similiar file, cry no more. Rails lets you freely organize your dictionary files in config/locales.

My organization works like this:

  • config/locales/rails.de.yml modified Rails boilerplate
  • config/locales/faker.de.yml modified Faker boilerplate
  • config/locales/models.de.yml model names, attribute names, assignable_value labels
  • `config/locales/views.de.y…
Repeats

Your database tables should always have timestamps

Whenever you create a table from a database migration, remember to add updated_at and created_at timestamps to that table. Without those timestamps, investigating future bug reports will be hell. Always have timestamps.

Adding timestamps to new tables

When you create a table using create_table, you can add timestamps by using the timestamps shortcut:

```
class CreateEpisode < ActiveRecord::Migration
def change
create_table :episodes do |t|
t.string :name
t.timestamps

Repeats

Cancelling event propagation

Within an event handler, there are multiple methods to cancel event propagation, each with different semantics.

  • event.preventDefault()

    Only prevents the default browser behavior for the click, i.e. going to a different url or submitting a form.

  • event.stopPropagation()

    Prevents the event from bubbling up the DOM. Note this effectively also cancels any event handlers attached through jQuery's live method, since those depend on bubbling.

  • event.stopImmediatePropagation()

    Prevents the event from triggering any remaining…

Linked content

palkan/isolator: Detect non-atomic interactions within DB transactions

With this gem your transaction blocks raise an error when they have side effects that cannot be rolled back.

By default it checks whether you're connecting with HTTP, queuing a Sidekiq job or sending an e-mail within a transaction. You can add custom checks, too.

Found in this RubyGuides article.

Linked content

The nitty-gritty of compile and link functions inside AngularJS 1 directives

Use the compile function to change the original DOM (template element) before AngularJS creates an instance of it and before a scope is created.

Use the pre-link function to implement logic that runs when AngularJS has already compiled the child elements, but before any of the child element's post-link functions have been called.

Use the post-link function to execute logic, knowing that all child elements have been compiled and all pre-link and post-link functions of child elements have been executed.

Bash script to list commits by Pivotal Tracker ID

The main benefit of our convention to prefix commits by their corresponding Pivotal Tracker ID is that we can easily detect commits that belong to the same story. You can either do that manually or use the bash script below by copying it somewhere to your .bashrc.

```bash
# Usage: ptcommits '#123456'
function ptcommits {
if test "$1"
then
git log –oneline | grep "$1" | grep "^[a-z0-9]*" -o | xargs –no-run-i…

Linked contentRepeats

A community-curated list of flexbox issues and cross-browser workarounds for them

This repository is a community-curated list of flexbox issues and cross-browser workarounds for them. The goal is that if you're building a website using flexbox and something isn't working as you'd expect, you can find the solution here.

As the spec continues to evolve and vendors nail down their implementations, this repo will be updated with newly discovered issues and remove old issues as they're fixed or become obsolete. If you discover a bug that's not listed here, please report it so everyone else can benefit.

Repeats

PSA: Umlauts are not always what they seem to be

When you have a string containing umlauts which don't behave as expected (are not matched with a regexp, can't be found with an SQL query, do not print correctly on LaTeX documents, etc), you may be encountering umlauts which are not actually umlaut characters.

They look, depending on the font, like their "real" umlaut counterpart:

  • ä ↔ ä
  • ö ↔ ö
  • ü ↔ ü

However, they are not the same:

>> 'ä' == 'ä'
=> false
>> 'ä'.size
=> 1
>> 'ä'.size
=> 2

Looking at how those strings are constructed reveals what is going…

Repeats

An auto-mapper for ARIA labels and BEM classes in Cucumber selectors

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 …

Repeats

Rails: namespacing models with table_name_prefix instead of table_name

When you want to group rails models of a logical context, namespaces are your friend. However, if you have a lot of classes in the same namespace it might be tedious to specify the table name for each class seperately:

class Accounting::Invoice < ApplicationRecord
  self.table_name = 'accounting_invoices'
  ...
end

class Accounting::Payment < ApplicationRecord
  self.table_name = 'accounting_payments'
  ...
end

A replacement for the self.table_name-assignment is the table_name_prefix in the module definition:

```
module Accou…

Convert SCSS to SASS

The ruby sass gem also installs a command line tool to convert to and from SCSS. Use it for a directory of .scss-files like

sass-convert -R assets/stylesheets --from scss --to sass
Repeats

Using CSS transitions

CSS transitions are a simple animation framework that is built right into browsers. No need for Javascript here. They're supported by all browsers.

Basic usage

Transitions are used to animate the path between to property values. For example, to let the text color fade from red to green on hover, the following SASS is used (shorthand syntax):

.element
  color: red
  transition: color .1s
  
  &:hover
    color: green

This tells the browser "whenever the color of an .element changes…

Linked contentDeprecated

CSS-Style

Richard Powell presents a collection of CSS styling advice that's mainly taken from SMACSS. Although at makandra we're using BEM instead of SMACSS, here's my favorites.

Do not use ID's in CSS Selectors

It is never safe to assume there will only ever be one of something on a page so do not use ID's for CSS. Id's are much better used as javascript hooks so use them for this instead.

.list {…} instead of #list {…}

Animate an interface using classes not inline styles

Inline styles added by javascript are h…

Linked content

Powerful favicon generator

This favicon generator will guide you to a perfect set of favicon files, suitable for all devices and situations (browser, homescreen icon for iOS/Android/Windows, MacBook Touch Bar etc.)

How to

Open the Favicon generator and upload a square image:

  • either an SVG
  • or a PNG/JPG/… with more than 260px size

Then follow the steps it guides you. In the result window, stick to the HTML5 tab. It is just fine.

More

This website uses cookies to improve usability and analyze traffic.
Accept or learn more