EC2でDjango+Nginx環境構築するメモ (Amazon Linux AMI 2012.03

選択したAMIは”Amazon Linux AMI 2012.03″
以下の記事が参考になったのですが、記事の中で使われているAMIはUbuntuなのでapt-getをeasy_installにしてます。
詰まったとこメモしてるだけなので、全体像は偉大なるリンク先参照ください。

Adrián Deccico » Setting up Django 1.3 + NGinx 1.0.5 + Green Unicorn 0.13 in an Ubuntu 11.10 EC2 instance

sshでつなげて、いろいろインストールしてDjango用の環境を作る。

sudo easy_install python-pip
sudo pip install pip --upgrade
sudo pip install virtualenv
sudo yum install nginx
virtualenv --no-site-packages django_app
cd django_app
source bin/activate

アプリケーション作成して、とりあえずgunicorn_djangoで実行。
#このときEC2のSecurityGroupでport8000を許可してなくて一度つまりました。

pip install django gunicorn
django-admin.py startproject app
cd app
gunicorn_django -b 0.0.0.0:8000

これで、PublicDNS:8000にアクセスしたらDjangoのwork画面が見られる。
control+cで終了して次にNginxの設定。

sudo mkdir -p /opt/django/logs/nginx/
mkdir $HOME/django_app/static
mkdir $HOME/django_app/templates
sudo ln -s $HOME/django_app/static /opt/django
sudo mv /etc/nginx/conf.d/default.conf /etc/nginx/conf.d/default.conf.backup

#ここでdefault.confを書き換える。設定内容はリンク先記事のwgetで取得したものを参考にしたので省略。

DjangoのTEMPLATE_DIRSに作成したディレクトリを追加。
TEMPLATE_なんたらと間違えてて詰まった。ちゃんとDIRSだと確認。
Django触るの初めてだよと言い訳。

vi settings.py

TEMPLATE_DIRS = (
	'/home/ec2-user/django_app/templates',
)

urlpatternにテスト用テンプレートのurlを追加。
import direct_to_templateも忘れずに追加。

vi urls.py

from django.conf.urls.defaults import patterns
from django.views.generic.simple import direct_to_template

urlpatterns = patterns('',
	(r'^test_static/$', direct_to_template, {'template': 'test_static.html'}),
)

以下のテンプレディレクトリにhtmlを置いておく。端折ってHelloWorldとだけ書いときました。
/home/ec2-user/django_app/templates/test_static.html

Nginxを再起動して、gunicorn_djangoで再度gunicornを動かす。
今回は80番portでアクセス(PublicDNS/test_static/)出来る。SecurityGroupで80番portが許可されているか確認。

最後に自動起動させるためににUpstartに登録する。
/etc/init/以下に.confファイルを置けばいいのだけど、.confファイルの記述ミスってるとそもそもサービスとして認識してくれない。
で、リンク先ではwww-dataってユーザーに実行させてるけど、www-dataにどのくらい権限与えればいいのかよくわかんなかったので、取り急ぎec2-userで実行するよう書いときました。

#!/bin/bash
set -e
LOGFILE=/var/log/gunicorn/django_app.log
LOGDIR=$(dirname $LOGFILE)
NUM_WORKERS=3  #recommended formula here is 1 + 2 * NUM_CORES

USER=ec2-user

cd /home/ec2-user/django_app
source bin/activate
cd app
test -d $LOGDIR || mkdir -p $LOGDIR
exec gunicorn_django -w $NUM_WORKERS \
  --log-level=debug \
  --log-file=$LOGFILE 2>>$LOGFILE \
  --user=$USER

以上。

って、ホントはflaskの入った環境欲しいなと思い始めたので、放置してflaskでアプリ組むための環境作ろうと思います。
気が変わってもイメージとっておけるのがEC2の良いところですね。

TitaniumのWebViewでProcessing.jsを使ってみる。

タイトルの通りTitaniumのWebView内でprocessing.jsを動かしてみました。
Titanium側からevalJSを使ってprocessingのloopを操作 しています。
それだけですが、思ってたより全然簡単で驚きました。簡単なリズムゲームとか作ったら楽しそう。
webViewでやった方が簡単だから…的記事時々見かけるのなんでかなんとなくわかった気がする。

processingに慣れてないなら普通にjavascriptでやった方がいい気もします。僕は慣れてない方の人です。おいおい!って。

雑なコードは以下。

app.js

Ti.UI.setBackgroundColor('#000');
var tt = {}
tt.ui = {};
tt.ui.createProcessingView = function() {
	var win = Ti.UI.createWindow();
	var web = Ti.UI.createWebView({top:0,right:0,bottom:0,left:0});
	web.url = '/src/processing.html';
	win.add(web);

	var controller = Ti.UI.createView({
		bottom: 0,
		width: Ti.Platform.displayCaps.platformWidth,
		height: 50,
		layout: "horizontal"
	});
	var labelSetting = {
		width: controller.width/2,
		textAlign: "center",
		backgroundColor: "#FFF",
		font: {fontSize:16, fontWeight:'bold', fontFamily:'Helvetica'},
		height: controller.height,
		text: "start"
	};
	var startLabel = Ti.UI.createLabel(labelSetting);
	startLabel.text = "start";
	controller.add(startLabel);
	var stopLabel = Ti.UI.createLabel(labelSetting);
	stopLabel.text = "stop";
	controller.add(stopLabel);
	win.add(controller);

	startLabel.addEventListener("click", function() {
		web.evalJS("startSketch()");
	});
	stopLabel.addEventListener("click", function() {
		web.evalJS("stopSketch()");
	});

	return win;
}

var wwin = tt.ui.createProcessingView();
wwin.open();

processing.html

<!DOCTYPE html>
<html>
<head>
	<title>Hello Web</title>
 	<script src="processing-1.3.6.min.js"></script>
 	<style>
 		* { margin:0; padding:0; }
		html, body { width:100%; height:100%; }
		canvas { display:block; }
 	</style>
</head>
<body>
<canvas id="sketch"></canvas>
<script type="application/javascript">
	function sketchProc(processing) {
		var Ps = processing;
		var width = window.innerWidth;
		var height = window.innerHeight;
		Ps.setup = function(){
			Ps.size(width, height);
			Ps.smooth();
		};
		Ps.draw = function() {
			Ps.background(100);
			Ps.fill(200);
			Ps.noStroke();
			for(var i=0; i<100; i++){
				var c = Ps.random(10, 15);
				Ps.ellipse(Ps.random(width), Ps.random(height), c, c);
			}
		};
	}

	var canvas = document.getElementById("sketch");
	var processingInstance = new Processing(canvas, sketchProc);

	function startSketch() {
		processingInstance.loop();
	}

	function stopSketch() {
		processingInstance.noLoop();
	}
</script>
</body>
</html>

目が悪くなりそうなcanvasなのはお許しをば。
テキトーに書き換えて実行しましょ。 

わらったない

ネットで見かける「笑った」って、笑ってないですよね。

「ワロタ」とか「www」とかネット上の笑いの表現は東京オリンピックあたりから存在してたみたいに浸透しちゃってるけど、これらって別に「私はパソコンの前で笑ってますよ」ってことを伝えようとしているわけじゃないですよね?

衆人環視の中、しかめっ面で「笑った」っていう6バイトの情報をネットの海に吐き捨ててる人なんてザラにいると思うし、むしろ笑えない状況だからこそ、笑いたい欲求を「笑った」っていう文字情報にして発散してるって場合もありますよね。そこで「面白い」と書かずに「笑った」って書く。強引かもだけど、それはきっと「笑いたい」だったりするんじゃない、って。

まぁ、もちろん実際笑ってるから「笑った」って書いてる人もいるだろうし、もしかしたら僕以外の人間はみなそうで、笑ってないのに「笑った」とか書いてるひねくれ者は僕だけかもしれないね。実際わかんない。個室トイレの中で皆逆立ちしてるの知らないのあなただけかもしれない。

話それちゃったけど、「笑った」に限らずネット上の文字って変なエネルギーありますよね。
キーボード、タッチパネルを通してエネルギーを込めるのですよ。「よろしくお願いします!」って。

 こういうのって全世界共通?平安時代から?
少なくとも日本人なら「マジワロス」の音の響きには何か惹かれるものがある気がするね。

超欲張りじゃん

超欲張りじゃんと思って、迷わず手に取りました。@LAWSON
残念ながらダイスキです。こういうの。
 
 でもこのロゴなんて読むんだろ。Cは読むの?デザイン?
とかどーでもいいこと気になっちゃって調べたら「ビタミンレモン乳酸菌飲料」 が正式名称でした。
潔いね。男前だね。
「ピルクル-ビタミンレモン味-」って名前の方が売れそうじゃんとかちょっと思ったけど。

話題のステマじゃないですよ。
お金じゃなくて、お金払ってビタミンCもらって書いてます。

safariでWebGLを有効にするのはまだ面倒。2012/01

面倒っていうほどじゃないんだけど。

processing.jsで3dを描く、ちょっとだけ。 | 脱兎.dat

先日、WebGL使った記事書いてみたんだけど、対応してないブラウザに配慮が足りてなかった。

そもそもcanvasタグに対応してないブラウザのためにcanvasタグを飾ってメッセージを入れてあげなきゃなんない。
以下の記事が参考になる。

HTML5 Canvas & Processing JS
http://joeycadle.com/blog/article/1/2012/22/01/html5-canvas-and-processing-js#comments 

Chromeに誘導しちゃうのね。

それでもなんなのこの記事わけわかんない!って言われたから
うちのSafari見てみたらcanvasタグが空き地になってた。
canvasタグには対応しているけどWebGLが有効になってないの原因?

safariでWebGLを有効にする方法。(2012/01現在)

1.メニュー「環境設定 > 詳細」より「メニューバーに”開発”メニューを表示」をオンに。
2.メニュー「開発」より「WebGLを有効にする」をオンに。

以上。
いちいち、有効にしてくださいね。ってcanvas外に書くのもcoolじゃないし
設定取得する方法とかないのかな。ま、早めにデフォルト有効になることを願ってます。