automatic .env sourcing with virtualenv

add this to your .virtualenvs/project-name/bin/postactivate:

#!/bin/bash
# This hook is sourced after this virtualenv is activated.

if [ -f ${PWD}/.env ]; then
    echo "activating .env..."
    set -a
    . ${PWD}/.env
    set +a
fi

The .env file is now sourced on activating the environment.

WordPress Shortcuts

Search & Replace the Base URL in a multi site setup

sed -i.bak "s/http:\/\/pfjournal.dev.infel.ch\//http:\/\/pfjournal.local\//g" pfj-20170112135105.sql

Locally import database in MAMP on Mac OS X

/Applications/MAMP/Library/bin/mysql --host=localhost -uroot -proot postfinance < /Users/mario/Downloads/pfj-20170112135105.sql

Automated Backups with Ansible on Exoscale S3 (SOS)

Apart from the snapshots we create on Exoscale on a regular basis we also wanted to have an automated backup of some key files that would simplify data extraction and specifically, easy access to old database versions.

Exoscale is the Swiss Amazon AWS. Its S3 implementation is pretty advanced and the storage buckets are also accessible through a nice and fast web interface on exoscale.ch (each organisation has its own instances and storage).

Here is how we integrated Exoscale S3 into our deployment:

# This role should be executed as root
---

- name: create s3cmd config file
  template: src=s3cfg.j2 dest=/root/.s3cfg
  become: yes
  become_user: root

- name: Install S3 packages
  apt: pkg={{ item }} update-cache=yes cache_valid_time=3600
  become: yes
  become_user: root
  with_items:
    - s3cmd

- name: create the bucket
  command: chdir={{ project_root }} s3cmd mb s3://{{ project_name }}
  become: yes
  become_user: root


- name: Dump postgres db
  become_user: postgres
  shell: pg_dump {{ db_name }} > /tmp/db.sql
  when: database_system == "postgres"
  become: yes
  become_user: root


- name: Backup media directory
  command: chdir={{ project_root }} s3cmd put --recursive {{ project_media }} s3://{{ project_name }}/{{ backup_folder_name }}/
  become: yes
  become_user: root

- name: Backup locale directory
  command: chdir={{ project_root }} s3cmd put --recursive {{ project_root }}/locale s3://{{ project_name }}/{{ backup_folder_name }}/
  become: yes
  become_user: root

- name: Backup sqlite db
  command: chdir={{ project_root }} s3cmd put {{ project_root }}/db.sqlite3 s3://{{ project_name }}/{{ backup_folder_name }}/
  when: database_system == "sqlite"
  become: yes
  become_user: root

- name: Backup postgres dump
  command: chdir={{ project_root }} s3cmd put /tmp/db.sql s3://{{ project_name }}/{{ backup_folder_name }}/
  when: database_system == "postgres"
  become: yes
  become_user: root

The s3cmd config file looks like this:

[default]
host_base = sos.exo.io
host_bucket = %(bucket)s.sos.exo.io
access_key = {{ exoscale_s3_key }}
secret_key = {{ exoscale_s3_secret }}
use_https = True
signature_v2 = True

This is based on https://community.exoscale.ch/documentation/storage/quick-start/

You can get the key and secret for exoscale S3 as well as the S3 endpoint url from https://portal.exoscale.ch/account/profile/api

The ansible defaults vars are

---

# can be used to create unique directory and file names
datetime_stamp: "{{ lookup('pipe', 'date +%Y%m%d-%H%M') }}"

backup_folder_name: "{{ datetime_stamp }}-{{ deploy_type }}"

Debugging Web Views on Android

  1. connect your phone through USB (+enable USB debugging on the phone somewhere in the settings).
  2. run application on phone (leave it on login screen)
  3. run Chrome on the PC and go to the chrome://inspect/devices#devices URL
  4. Click “Inspect” at the bottom of your phone (should be named)
  5. On the phone login to the system using your credentials
  6. Check chrome what does it have in the console tab. It should print something useful.

by kamil@what.digital

CSS Nesting and Why Its a Good Thing

Please read this first: https://signalvnoise.com/posts/3003-css-taking-control-of-the-cascade

So, in CSS we can establish a hierarchy so that a class only applies if it’s within a parent class. This hierarchy is a good and very much needed thing. Because this way you can define your class names for specific areas of the site with freedom of mind – it will never interfere with or be overwritten by another class that has (accidentally) the same name. Think of class names such as .title. And no, .newsletter-title and .homepage-newsletter-title is not a good idea (CSS supports native hierarchy, so why would you want to fake it?).

Example of SASS Good Practise:

.newsletter
   margin: 20px

   .title-box
         .title
             margin-top: 20px

        .subtitle
            margin-top: 10px

     .email-input
         padding: 50px

Example of SASS Bad Practise:

.title
    margin-top: 20px

.subtitle
    margin-top: 10px

.email-input
    padding: 5px

.newsletter
    margin: 20px

You agree? Are you ready to overshoot the target? Read this: http://thesassway.com/beginner/the-inception-rule