AWS EC2 で FuelPHP が動作するまで
Amazon Linux AMI 2014.03.1 と Ubuntu Server 14.04 LTS (PV) で試した。
インスタンスを作って立ち上げたところまでは省略。
AMI: Amazon Linux AMI 2014.03.1 の場合
$ ssh -i PATH-TO-KEY-FILE.pem ec2-user@PUBLIC_DNS_VALUE
以下ホスト側
root ユーザーにパスワードを設定
$ sudo passwd
bashのプロンプトに色を付ける
$ vim ~/.bashrc
---
# 以下コメントアウトを外す
force_color_prompt=yes
---
パッケージをアップデート
$ sudo yum update
Apache 入れる
$ sudo yum -y install httpd
$ sudo service httpd start
PHP入れる
$ sudo yum -y install php php-mbstring php-mysql php-pear php-mcrypt
// 後から追加でこの辺? php-pdo php-gd php-imap php-xml
PHP設定
$ php -i | grep php.ini
$ sudo vim /etc/php.ini
---
date.timezone = Asia/Tokyo
mbstring.language = Japanese
mbstring.internal_encoding = UTF-8
mbstring.http_output = UTF-8
---
Apache設定する
$ sudo vim /etc/httpd/conf/httpd.conf
---
DirectoryIndex index.html index.html.var index.php
...
AddType application/x-httpd-php .php
---
git入れる
$ yum list | grep git
$ sudo yum install git
FuelPHP入れる
http://fuelphp.com/docs/installation/instructions.html
$ curl get.fuelphp.com/oil | sh
動作確認する
$ sudo service httpd restart
ブラウザで
http://PUBLIC_DNS_VALUE
にアクセスして FuelPHP の Welcome ページが表示されることを確認
AMI: Ubuntu Server 14.04 LTS (PV) の場合
$ ssh -i PATH-TO-KEY-FILE.pem ubuntu@PUBLIC_DNS_VALUE
以下ホスト側
root ユーザーにパスワードを設定
$ sudo passwd
bashのプロンプトに色を付ける
$ vim ~/.bashrc
---
# 以下コメントアウトを外す
force_color_prompt=yes
---
パッケージをアップデート
$ sudo apt-get update
aptの使い方 https://wiki.ubuntulinux.jp/UbuntuTips/Application/PackageManagementSystem/Apt
Apache 入れる
$ sudo apt-get install apache2
$ /etc/init.d/apache2 start
PHP入れる
$ sudo apt-get install php5 php5-mcrypt php5-mysql php-pear
// mbstringは?
$ sudo apt-get install libapache2-mod-php5
$ /etc/init.d/apache2 restart
PHP設定
$ php -i | grep php.ini
$ sudo vim /etc/php5/cli/php.ini
---
date.timezone = Asia/Tokyo
mbstring.language = Japanese
mbstring.internal_encoding = UTF-8
mbstring.http_input = UTF-8
---
Apache設定する
$ sudo vim /etc/apache2/mods-available/mime.conf
---
AddType application/x-httpd-php .php
---
$ sudo vim /etc/apache2/sites-available/000-default.conf
---
DocumentRoot /var/www/fuelphp/public
---
git入れる
$ sudo apt-get install git
FuelPHP入れる
$ sudo chmod 777 /var/www
$ cd /var/www
// http://fuelphp.com/docs/installation/instructions.html
$ curl get.fuelphp.com/oil | sh
$ oil create ./fuelphp
動作確認する
$ sudo /etc/init.d/apache2 restart
ブラウザで
http://PUBLIC_DNS_VALUE
にアクセスして FuelPHP の Welcome ページが表示されることを確認
AWS S3にPHPからあれこれやり取りするための調査と試験
目標: ローカルサーバーなどで動作するPHPアプリから、S3上に静的なファイルをアップロードする
S3
http://docs.aws.amazon.com/aws-sdk-php/guide/latest/service-s3.html
S3の Bucket やら Object の Permissions について
https://aws.amazon.com/articles/5050
AWS SDK for PHP
これを読む
http://aws.amazon.com/articles/PHP/4261
ドキュメント目次
http://docs.aws.amazon.com/aws-sdk-php/guide/latest/index.html
これを読む。PEARでインストールする。
http://docs.aws.amazon.com/aws-sdk-php/guide/latest/installation.html
$ sudo pear config-set auto_discover 1 $ sudo pear channel-discover pear.amazonwebservices.com $ sudo pear install aws/sdk
すると
require 'AWSSDKforPHP/aws.phar';
でSDKが読めるようになる
これも読む
http://docs.aws.amazon.com/aws-sdk-php/guide/latest/quick-start.html
無料枠について
http://aws.amazon.com/jp/free/
チュートリアルやる
http://aws.amazon.com/jp/developers/getting-started/php/
プラスアルファでEC2の調査
EC2
http://docs.aws.amazon.com/ja_jp/AWSEC2/latest/UserGuide/concepts.html
EC2へのSSH/SCPの仕方
http://docs.aws.amazon.com/ja_jp/AWSEC2/latest/UserGuide/AccessingInstancesLinux.html
skrollr.js でSVG maskアニメーションをしようとした時のメモ
skrollr.js
- モバイル端末の場合、ネイティブスクロールを殺し、#skrollr-body 要素の中身をtransform させている仕組み
- よって #skrollr-body 要素でコンテンツをラップすることが必要
Android native browser
- SVG mask要素を認識しない。clipPath要素はOK
- scrollr.jsを入れると、フリックできなくなる
References
- https://github.com/Prinzhorn/skrollr
- http://prinzhorn.github.io/skrollr/examples/path.html
- https://developer.mozilla.org/ja/docs/Web/SVG/Tutorial/Clipping_and_masking
- http://www.hcn.zaq.ne.jp/___/SVG11-2nd/masking.html
- http://thewebstorebyg.wordpress.com/2013/12/29/cross-browser-svg-masking-supports-ie8-ie9-ie10-firefox-chrome/
CoffeeScript 導入
インストール
$ sudo npm install -g coffee-script
Grunt で使えるようにする
https://github.com/gruntjs/grunt-contrib-coffee https://github.com/vojtajina/grunt-coffeelint
npm intall grunt-contrib-coffee --save-dev
npm intall grunt-coffeelint --save-dev
Gruntfile.js に以下のように書いてみる
module.exports = function (grunt) {
grunt.loadNpmTasks('grunt-contrib-coffee');
grunt.loadNpmTasks('grunt-coffeelint');
...
grunt.initConfig({
coffee: {
main: {
files: {
'js/smoothscroll.js': '_coffee/*.coffee',
}
}
},
coffeelint: {
// DOC: https://github.com/vojtajina/grunt-coffeelint
// DOC: http://www.coffeelint.org/
// app: [ '_coffee/*.coffee' ],
tests: {
files: {
src: [ '_coffee/*.coffee' ]
},
options: {
'no_trailing_whitespace': {
'level': 'error'
}
}
}
},
...
watch: {
coffee: {
files: [ '_coffee/*.coffee' ],
tasks: [ 'coffee' ]
},
coffeelint: {
files: [ '_coffee/*.coffee' ],
tasks: [ 'coffeelint' ]
}
}
});
grunt.registerTask('default', [ 'coffee', 'coffeelint', 'watch' ]);
};
Vim に vim-coffee-script プラグイン追加
https://github.com/kchmck/vim-coffee-script
これでシンタックスハイライトやら、簡易文法チェックが走るようになる
お勉強
About installation of Sass 3.3
Current version of my environment.
- Sass 3.2.10 (Media Mark)
- Compass 0.12.2 (Alnilam)
I know Compass doesn't work on Sass 3.3. But... http://stackoverflow.com/questions/22427567/is-sass-3-3-3-compatible-with-compass
Maybe it works with '--pre' option install.
$ gem install compass --pre
If it won't work unfortunately, let's back to old version. http://stackoverflow.com/questions/17026441/how-to-install-a-specific-version-of-a-ruby-gem
$ gem install sass -v 3.2.10
$ gem install compass -v 0.12.2
dependencies と devDependencies の違いって
npm intall hogehoge --save
とやると package.json の dependencies にパッケージが記録され、
npm install hogehoge --save-dev
とやると package.json の devDependencies にパッケージが記録される。 bower と bower.json も同じ。 この2つの違いってなんぞやと思って調べた。
- http://publicdraft.studiomohawk.com/2012/12/16/npm-and-package.json/
- http://havelog.ayumusato.com/develop/others/e539-manage_grunt_build_env.html
結果。grunt 関係は全部 --save-dev で問題ないみたい。 bower の場合、落としたパッケージのスクリプトをそのまま使う場合は --save、その後 concat や minify してリリース用にビルドするような場合は --save-dev が良いのかな。
MAMP+VirtualHost環境でValidator S.A.Cを使う
MacのApacheをそのまま使う(&VirtualHost無し)なら以下のやり方でそのまま動く。 http://habilis.net/validator-sac/#advancedtopics
が、自分の環境は MAMP+VirtualHost 環境なので以下のようなやり方をした。
まず公式の通り、設定ファイルをコピー。
$ cd /Applications/Validator-SAC.app/Contents/Resources
$ sudo cp validator/httpd/conf/validator-SAC.conf /Applications/MAMP/conf/apache/extra
コピーした validator-SAC.conf の中身を以下のように書き換えた。
# -*- apache -*-
# Leopard (10.5) Apache 2 configuration for Validator S.A.C. installed in /Applications
<Directory "/Applications/Validator-SAC.app/Contents/Resources/validator/httpd/cgi-bin">
AllowOverride None
Options None
Order allow,deny
Allow from all
</Directory>
<Directory '/Applications/Validator-SAC.app/Contents/Resources/validator/htdocs/'>
Options IncludesNOEXEC Indexes MultiViews
AllowOverride None
Order allow,deny
Allow from all
AddHandler server-parsed .html
AddCharset utf-8 .html
</Directory>
<IfModule mod_headers.c>
<Directory '/Applications/Validator-SAC.app/Contents/Resources/validator/htdocs/images'>
Header set Cache-Control "max-age=604800"
</Directory>
</IfModule>
<VirtualHost *:80>
DocumentRoot '/Applications/Validator-SAC.app/Contents/Resources/validator/htdocs/'
ServerName validator.localhost
# First, tell httpd that check_wrapper.sh and sendfeedback_wrapper.sh are CGI scripts.
ScriptAlias /check '/Applications/Validator-SAC.app/Contents/Resources/validator/httpd/cgi-bin/check_wrapper.sh'
ScriptAliasMatch /feedback(\.html)? '/Applications/Validator-SAC.app/Contents/Resources/validator/httpd/cgi-bin/sendfeedback_wrapper.sh'
# This is the directory where you have the validator's *.html, *.css etc files.
Alias / '/Applications/Validator-SAC.app/Contents/Resources/validator/htdocs/'
# Advertise the service on Bonjour/Rendevous
# ここをコメントアウトしないと動かない
# RegisterResource "W3C Validator S.A.C." /
</VirtualHost>
そして httpd.conf から Include する。
$ sudo vim /Applications/MAMP/conf/apache/httpd.conf
# 末尾に追加
Include /Applications/MAMP/conf/apache/extra/validator-SAC.conf
hosts ファイルに設定を追加するのも忘れてはいけない。
$ sudo vim /etc/hosts
# 末尾に追加
127.0.0.1 validator.localhost
MAMP apache を再起動したら http://validator.localhost/ で見れるようになる。