Django production server

Install

sudo apt-get install python-django libapache2-mod-wsgi python-mysqldb python-setuptools

Virtualhost

<VirtualHost *:80>
ServerName tang.local
WSGIDaemonProcess snake display-name=%{GROUP}
WSGIProcessGroup snake
WSGIScriptAlias / /mnt/host/snake/apache/django.wsgi

Alias /static  /mnt/host/snake/static
</VirtualHost>

WSGI script

import os
import sys
sys.path.append('/mnt/host')
sys.path.append('/mnt/host/snake')
os.environ['DJANGO_SETTINGS_MODULE'] = 'snake.settings'

import django.core.handlers.wsgi
application = django.core.handlers.wsgi.WSGIHandler()

Generate git change log

git whatchanged --since "2 month ago" | grep ^: | awk '{print $6}' | sort | uniq -c | awk '{print $2}' > change.log

Monospaced Fonts for Programming

Some nice monospaced fonts.

• Consolas.ttf
• Mensch.ttf
• Terminus.ttf
• Inconsolata.ttf
• Monaco.ttf

Managing apache folder

The goal here is to allow apache process as well as multiple developers to have read and write permission to all apache files.

What I’m currently doing is:
- Add a new group “dev”

addgroup dev

- Add www-data (or whatever your apache runner user is) to the group “dev”

adduser www-data dev

- Add all developers to the group “dev”

adduser vincent dev
adduser anotherdev dev

- Change apache user “www-data” and all developers’ default group to “dev”

vim /etc/passwd
# each line is a user:
# username:x:userid:groupid:userinfo:script
# now change groupid from the default user group to the groupid of "dev"

- Change umask to 002 (all developers on ssh, all developers on sftp, and www-data)

vim /etc/profile
# change umask to 002
vim /etc/ssh/sshd_config
# change Subsystem to:
Subsystem sftp /usr/lib/openssh/sftp-server -u 0002
vim /etc/apache2/envvars
# add
umask 002

- Change all apache folders to www-data:dev, 775 and files to www-data:dev, 664

chown www-data:dev /home/www-data -R
chmod 775 /home/www-data
find /home/www-data/* -type d -exec chmod 775 {} \;
find /home/www-data/* -type f -exec chmod 664 {} \;

CSS3 based jQuery Gallery

Flux Gallery

YUI Compressor for JavaScript

# $1 input file
# $2 output file
java -jar yuicompressor.jar $1 -o $2

yuicompressor.jar is attached.
source: http://yuilibrary.com/download/yuicompressor/

Google event tracking

$(document).ready( function() {
    // add an event to all link for google analytics
    $('a').click(function () {
        // tell analytics to save event
        try {
            var identifier=$(this).attr('id') ;
            var href=$(this).attr('href')
            var label="";
            if ( typeof( identifier ) != 'undefined' ) {
                label=label+'[id]:'+identifier
                category='JSLink'
            }
            if ( typeof( href ) != 'undefined' ) {
                label=label+' [href]:'+href
                if ( href[0] == '#' ) {
                    category='Anchor';
                } else {
                    category='Link';
                }
            }
            _gaq.push(['_trackEvent', category, 'clicked', label]);
            // console.log('[tracked]: ' + category + ' ; clicked ; ' + label );
        }
        catch (err) {
            // console.log(err);
        }

        // pause to allow google script to run
        var date = new Date();
        var curDate = null;
        do {
            curDate = new Date();
        } while (curDate-date < 300);
    });
});

Source: External blog

Make JavaScript calls within ActionScript 3

import flash.external.ExternalInterface;
var returnedValue:int = ExternalInterface.call("foobar()", "argument");

Learn Vim Progressively

Source

Best practice for loading jquery, and other JavaScript libs

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/VERSION.NUMBER/jquery.min.js"></script>
<script type="text/javascript">window.jQuery || document.write('<script src="js/jquery.js" type="text/javascript">\x3C/script>')</script>

CSS Transition – 3d rotation

CSS:

.wrapper {
    position: relative;
}

.wrapper div {
    position: absolute;
    left: 0;
    top: 0;
    color: #fff;

    -webkit-transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
}

.front {
    background-color: red;
    z-index: 2;

    transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
}

.wrapper:hover .front {
    z-index: 2;
    -webkit-transform: rotateY(180deg);
}

.back {
    background-color: blue;
    z-index: 1;

    -webkit-transform: rotateY(-180deg);

    transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
}

.wrapper:hover .back {
    z-index: 3;
    -webkit-transform: rotateY(0deg);
}

HTML:

<div class="wrapper">
    <div class="front">FRONT</div>
    <div class="back">BACK</div>
</div>

Production Server with Rails and Phusion Passenger

First you need to install RVM, ruby, rubygem, rails, with LAMP already installed too.

rvmsudo passenger-install-apache2-module

# to find out where apache config file is
apachectl -V | grep SERVER_CONFIG_FILE

# load modules in Apache config (this may vary)
LoadModule passenger_module /home/vincent/.rvm/gems/ruby-1.9.2-p180/gems/passenger-3.0.7/ext/apache2/mod_passenger.so
PassengerRoot /home/vincent/.rvm/gems/ruby-1.9.2-p180/gems/passenger-3.0.7
PassengerRuby /home/vincent/.rvm/wrappers/ruby-1.9.2-p180/ruby

# now this is an exmple of apache virtualhost
<VirtualHost *:80>
        DocumentRoot /home/www-data/depot/public
        ServerName appname.myserver.com
        <Directory /home/www-data/depot/public>
                AllowOverride all
                Options -MultiViews
        </Directory>

        # Speeds up spawn time tremendously -- if your app is compatible.
        # RMagick seems to be incompatible with smart spawning
        RailsSpawnMethod smart

        # Keep the application instances alive longer. Default is 300 (seconds)
        PassengerPoolIdleTime 1000

        # Keep the spawners alive, which speeds up spawning a new Application
        # listener after a period of inactivity at the expense of memory.
        RailsAppSpawnerIdleTime 0

        # Additionally keep a copy of the Rails framework in memory. If you're
        # using multiple apps on the same version of Rails, this will speed up
        # the creation of new RailsAppSpawners. This isn't necessary if you're
        # only running one or 2 applications, or if your applications use
        # different versions of Rails.
        RailsFrameworkSpawnerIdleTime 0

        # Just in case you're leaking memory, restart a listener
        # after processing 5000 requests
        PassengerMaxRequests 5000

        # only check for restart.txt et al up to once every 5 seconds,
        # instead of once per processed request
        PassengerStatThrottleRate 5
</VirtualHost>

Create the database needed for the new app, update config/database.yml content to allow app to connect to database on the production server.

Once the new rails app is uploaded to the server:

# install/update bundle
cd appfolder/
bundle install

# now setup database table and data
cd appfolder/
rake db:setup RAILS_ENV=production

Next you use a2ensite and /etc/init.d/apache restart to reload the new site.

Setup Git Server (gitolite)

This setup using SSH connection for transfer instead of SVN’s http (webdav).

The gitolite use a default user (e.g. git) to establish a ssh connection, and wrap multiple users management with rsa pub key.

# generate your key if you don't have one
# (use default answers and choose a passphase)
ssh-keygen -v -t rsa -C username@hostname

# transfer the pub key to git server
scp ~/.ssh/id_rsa.pub username@server:username.pub

# add git user that gitolite will run as
# (questions doesnt matter much just remember the password)
sudo adduser git

# let user git own the pub key and move it to git's home
sudo mv username.pub ~git/username.pub
sudo chown git:git ~git/username.pub

# log in as git
su - git

# generate key for user git with no passphase
ssh-keygen -v -t rsa

# get the content of the key and keep it in clipboard for later
cat ~/.ssh/id_rsa.pub

# install gitolite from github
# update: can also sudo apt-get install gitolite
cd /home/git
git clone git://github.com/sitaramc/gitolite gitolite-source
cd gitolite-source
mkdir -p ~/bin ~/share/gitolite/conf ~/share/gitolite/hooks
/home/git/gitolite-source/src/gl-system-install ~/bin ~/share/gitolite/conf ~/share/gitolite/hooks
cd /home/git
/home/git/bin/gl-setup username.pub
rm -f username.pub

# administration of gitolite
# this is done via checking out a copy of the gitolite-admin from server
# and modify its /conf/gitolite.conf file and then push them back after commit locally first
# check out (clone) a copy of gitolite-admin
git clone git@servername:gitolite-admin

# modify conf/gitolite.conf
vim conf/gitolite.conf

# for example to add a new repository
# gitolite.conf content
repo    projectname
        RW+        = username

# and now commit then push back up to create the new repo for projectname
git add -A
git commit -m "add new project repo"
git push

# you can then create a new git (or skip this if using an existing one)
mkdir projectname
cd projectname
git init

# also set up basic stuff like user.name and user.email
git config --global user.name "Vincent Lu"
git config --global user.email vincent.lu@email.com

# now add the new git repo on server as a remote server for the current git local
git remote add origin git@servername:projectname.git
git push origin master

# you can track the remote by adding:
git config branch.master.remote servername
git config branch.master.merge refs/heads/master

# if run into memory issue on server or local, reduce memory usage by:
git config core.packedGitWindowSize 16m
git config core.packedGitLimit 64m
git config pack.windowMemory 64m
git config pack.packSizeLimit 64m
git config pack.thread 1
git config pack.deltaCacheSize 1m

# to add new users
# add access to gitolite-admin/conf/gitolite.conf
repo pluto RW+ = someone
# add key to gitolite-admin/keydir
ssh-keygen -v -t rsa -C someone@hostname
cp ~/.ssh/id_rsa.pub gitolite-admin/keydir/someone.pub
# push change back to server
cd gitolite-admin/
git commit -a -m "add new user someone"
git push

Migrate SVN repository to Git system

# create users.txt for git
touch users.txt
echo "vincent = Vincent Lu " > users.txt

# get git-svn
sudo apt-get install git-core git-svn

# create empty git repository
mkdir newproject
cd newproject
git-svn init http://svn.yoursite.com/oldproject/trunk --no-metadata
git config svn.authorsfile users.txt
git-svn fetch

# clone the git repository created by git-svn fetch
cd ..
git clone newproject myproject

Count how many lines of code you have written in a project

Ever wanted to find out how many lines of code have you put into a project?

http://cloc.sourceforge.net/

Written in perl.

Regular Expression Cheat Sheet

New clearfix

/* For modern browsers */
.clear:before,
.clear:after {
    content: "";
    display: block;
    overflow: hidden;
}

.clear:after {
    clear: both;
}

/* For IE 6/7 (trigger hasLayout) */
.clear {
    zoom: 1;
}

Source: http://nicolasgallagher.com/micro-clearfix-hack/

Smallest possible 1×1 transparent gif and png

Smallest possible 1×1 transparent gif and png

PNG 67 bytes

GIF 42 bytes

Remove a line from multiple files

find . -type f -exec sed -i '/LINETHATCONTAINTHIS/d' {} \;

Console font – Mensch

Download