seckie's programming memo

プログラミングするにあたって調べたことなどのメモ。たまにひどい英語で書く。

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

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' ]);
};

Vimvim-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つの違いってなんぞやと思って調べた。

結果。grunt 関係は全部 --save-dev で問題ないみたい。 bower の場合、落としたパッケージのスクリプトをそのまま使う場合は --save、その後 concat や minify してリリース用にビルドするような場合は --save-dev が良いのかな。

MAMP+VirtualHost環境でValidator S.A.Cを使う

MacApacheをそのまま使う(&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/ で見れるようになる。