VOYAGE GROUP エンジニアブログ

voyagegroup_techのブログ
VOYAGE GROUPエンジニアブログです。

2014年03月

14卒エンジニア内定者育成支援PJ

こんにちは。システム本部 三浦@hironomiuです。

VOYAGE GROUPでは去年入社前にエンジニア育成支援を行いました。
内定者エンジニア向け育成支援

今年も入社前に実力を伸ばしたいと考えている14卒エンジニア内定者に対して2013年10月から週1回のペースで内定者育成支援PJが立ち上がりました!

育成支援PJ最終日後の1コマ
1798855_10203425401096819_845529189_n


育成支援ですので基本的に実力を伸ばしたい意思のある人のフォローをすると言う位置付けで行っているので任意参加です。
(学業とかも頑張らないといけないですからね!)

今年は8人のエンジニア内定者がいるのですが8人に対して
 現場エンジニア:monmonさん、おみさん、せっきー、みっちゃん
 担当人事:いっきさん
 雑用:自分
合計6人と言う豪華なサポータ体制で始まりました!

フォローの進め方ですがテーマを設けることで発散を避け他の内定者のアウトプットを参考に出来るメリットがあると考え10月、11月、12月はテスト駆動開発(TDD)をテーマに、1月、2月、3月は徳丸本をテーマに進めました。

フォロー開催日は会社の会議室を起点にサポータと内定者で1時間みっちりとフォローを行うのですが
会社近辺在住では無い内定者も多数いますのでSkypeの音声チャット、テキストチャット、GitHubのpull req、issueなどを駆使しロケーションのギャップを埋める形で進みます。

又、1月からは月に1度集まり、丸1日を使っての実機を用いたワークショップ形式の実習を行いました。
内定者とサポーターで話し合い手探りの中進めていきましたが、成長に関してかなりの手ごたえを感じました。
(2月は大雪のため中止となりましたが。。)
 
3月最終日のワークショップ風景
IMG_1977


このような形で約半年ほど育成支援PJが進んだのですがサポータ、内定者ともに成長出来る機会だったと個人的に思っています。
定期的にサポータが集まりKPTを実施し次回のテーマの支援に繋げる動きや内定者の忌憚の無い質問から様々な技術的な気付きもありました。

14卒エンジニア内定者も育成支援によって気付きや成長があったと思います。4月から新卒メンバーとしてJOINした際に育成支援で得た知識が役に立ち360°圧倒的に活躍してくれると楽しみにしてます!



【JavaScript】 New Relicのなかなか凄い新機能を試してみた

こんにちは、こんばんは、おはようございます。株式会社adingo 高橋です。
弊社adingoは月間200億impを捌くSSP「Fluct」を提供しており、100台近いサーバでリクエストを捌いたり、大規模データの分析をしております。

さて、そんな仕事とは直接の関係は無いですが、最近New Relicがなかなか凄い新機能をβリリースしていたので簡単な紹介をしたいと思います。
New Relicとはアプリケーションとサーバのモニタリングを行うサービスです。yumでagentをインストールするだけで手軽に導入できます。今回紹介する新機能は「JSのエラーレポート機能」と「AJAXの実行時間レポート」で、リリース文は以下となります。
http://blog.newrelic.com/2014/03/13/javascript-error-reporting-ajax-timing-new-relic/

(1)インストールとアプリケーション設定
新機能を使う前にまずアプリケーション設定を行う必要があります。
アカウントを持っていない場合、New Relicページの右上の「Create Free Account」ボタンから新規にアカウントを作成します。
ログインして「Application」のメニューを選択するとメニュー画面が表示されますので、案内に従ってアプリケーションの設定を行ってください。
regist_app2

自分(CentOS)の場合は以下のコマンドで登録しました。
$ sudo rpm -Uvh http://yum.newrelic.com/pub/newrelic/el5/x86_64/newrelic-repo-5-3.noarch.rpm
$ sudo yum install newrelic-php5
# ↓ライセンスキーの登録
$ sudo newrelic-install install
# ↓apacheであればhttpdを再起動
$ sudo /etc/init.d/php-fpm restart
phpinfoで以下のようにnewrelicが表示されればOKです。
phpinfo

(2)JSのエラーレポート機能を試す
アプリケーションを登録してしばらくすると、Browserメニューの中に「PHP Application」のようにアプリ名が表示されます。
選択して「Settings」タブに移動後、「Enable Beta features」にチェックを入れて保存します。
setting

以下のように「newrelic/render_js.php」を作成後、ブラウザで開いてみてください。
(「alert」をスペルミスしているためスクリプトエラーになるはずです。)
$ cd [アプリケーションのドキュメントルート]
$ mkdir newrelic
$ vi newrelic/render_js.php
<?phpecho <<<EOT
<html>
<head>
<title>test</title>
<script type="text/javascript">
alet('hoge');
</script>
</head>
<body>test</body>
</html>
EOT;
しばらくして、「JS errors」のタブを選択
js_error
「Show all JavaScript errors」を選択 
js_error1
更に詳細を見てみると
js_error2
すげええええ!!!JavaScriptのエラーをハンドリングして表示してくれました。 

(3)AJAXの実行時間レポート機能を試す
次に以下のように「newrelic/render_ajax_js.php」を作成して、ajaxのリクエストを発生させます。
$ vi newrelic/render_ajax_js.php
<?php
echo <<<EOT
<html>
<head>
<title>test</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#test').click(function(){
$.get('/', function(){ });
});
});
</script>
</head>
<body>
<input type="button" id="test" value="test">
</body>
</html>
 しばらく待ってレポートを見てみると以下のようにレポートに反映されました。
ajax_timing

今のところ、 下記の値がグラフされるようです。
・Total time percentage:処理時間に占めるAJAXリクエストの割合
・Throughput:1分あたりのリクエスト数
・Status codes of all requests:200以外のステータスコードの割合
・Average data transfer per request:リクエストあたりの平均送信バイト数

以上、New Relicに追加された新機能の紹介でした。
βリリースかつ htmlにJavaScriptのハンドリング処理を差し込むので本番環境に入れるのは少し怖いですが、テスト環境に導入してみるのは良いかもしれないと思いました。

[PR]
VOYAGE GROUPではアドテクエンジニアを絶賛募集中です!
Cosmi データマイニングエンジニア
広告配信システムエンジニア
Zucksフロントエンジニア

Pagoda BoxでCakePHPをさくっと動かしてみた

こんにちは、ECナビ事業本部の新卒エンジニアのブライアンです。
ちょっと前に配属されたと思っていたら、4月には2年目突入です。1年なんてあっという間ですね。

オブジェクト指向やMVCやユニットテストなんてさっぱりな僕でしたが、
入社前は内定者エンジニア向け育成支援や、朝から晩までペアでTDD漬け等々の研修、配属後も優しくマサカリを投げてくれる先輩エンジニア達のおかげで、メキメキと技術力を伸ばしてきました。(自称)

できることも増えてきて、なにか作りたい欲がふつふつ湧いてきましたが、
VPS借りてサービス公開するにも、いかんせんサーバーに関してはまだまだ勉強不足。

ということで、サーバーのことはお任せしてサービスの開発に集中できるPaaSを使ってみることに。

PaaSだとFacebookアプリとかで使われるHerokuが有名ですが、
今回はPHPでサービスを作りたかったので、PHPに特化したPaaSのPagoda Boxを使うことにしました。

Pagoda Boxは無料で、200MB RAMのインスタンス1つと、10MB RAMのMySQLを使うことができるため、無料でさくっと何か作って動かしたいというにはちょうど良い感じですね。もちろん、課金すればスケールアウト、スケールアップもできます。


◆ Pagoda Boxに登録


ということで、早速新規登録から。
トップページの「Try It Free」からメアドとかを入れて登録します。
1


登録すると認証メールがScottさんから飛んでくるので、
Confirm my accountをクリックして認証します。
2

◆ Pagoda Box側でアプリを作成

認証が終わったら、早速ログインして作成開始です。
「New Application」のボタンを押すと、アプリケーションの作成方法を選ぶことができます。
3

アプリケーションの作成には、CakePHPやcodeigniterなどのフレームワークをインストールする方法と、既存のgitリポジトリを利用する方法、とりあえず空のリポジトリを作成する方法が選べます。

今回は、Slimを使おうと目論んでいたのですが、何回やってもインストールに失敗したので、CakePHPをインストールすることにしました。
「Quickstart」をクリックして「delicious-cake」を選択します。
4

「Launch」ボタンを押すと、下のコンソール画面でムニャムニャ動き出し、
しばらくすると、「View Live App」と「Manage Your App」のリンクが出てきます。
5

「View Live App」を見に行ってみると、おーもう動いてる!すごい!
6



◆ ローカルの開発環境に同じものを作る

Pagoda Box側ではあっという間にCakePHPが動き出したので、
今度はローカルの開発環境側で、CakePHPを動かして少しいじってデプロイしてみたいと思います。
今回、開発環境はVirtualBoxにScientifix Linuxをインストールして構築していますが、手軽にやるならXAMPPMAMPでLAMP環境を構築するのも有りだと思います。

デプロイはPagoda Boxのgitリポジトリにpushして行うので、まずはSSHキーの生成と登録から始めます。
SSHキーの生成はこの辺を参考に
$ cd ~/.ssh
$ ssh-keygen -t rsa -C "****@*********"

既にgithub用の公開錠とかが有る場合は、Pagoda Box用の公開錠と秘密錠は、それぞれ、pagoda_box_id_rsa、pagoda_box_id_rsa.pubとかにリネームしてやって、configファイルを作成して使い分けするようにしておくと便利です。
$ touch ~/.ssh/config
$ vim ~/.ssh/config

configファイルはこんな感じで。
Host github.comUser git
Hostname github.com
PreferredAuthentications publickey
IdentityFile ~/.ssh/github_id_rsa
 
Host git.pagodabox.com
User git
Hostname git.pagodabox.com
PreferredAuthentications publickey
IdentityFile ~/.ssh/pagodabox_id_rsa

configファイルのパーミッションが誰でも見れるようにしていると怒られるので、自分しか見られないように変更します。
$ chmod 600 ~/.ssh/config

公開錠を生成したら、Pagoda Boxのダッシュボードの右上のユーザーネームのところから、「Add a new SSH Key」をクリックしてPublic Key Nameに適当に判別できる名前と、pagodabox_id_rsaの中身を貼付けて「Create Key」をクリックして登録します。
11
何故か、SSH Key is not a valid public keyとか出て焦ったけれど、もう一回作り直してみたらすんなり通った。なんかのバリーデーションに引っかかってたのかな。

Pagoda Boxに公開錠を登録できたら、早速Pagodaさんに挨拶しに行ってみます。
$ ssh git@git.pagodabox.com
Enter passphrase for key '/home/*****/.ssh/pagodabox_id_rsa': PTY allocation request failed on channel 0 :: Hi [USER NAME]! You've successfully authenticated, but Pagoda Box does not provide shell access. Connection to git.pagodabox.com closed.

無事に挨拶が終わったということで、ドキュメントルートにgit cloneしてきます。
cloneするURLはダッシュボードの右上の方にある「Show git Clone URL」をクリックすると表示されます。
$ git clone git@git.pagodabox.com:*****.git

とりあえずブラウザからローカルのドキュメントルート見に行くと動いていますね。
7

ただ、Security.saltとSecurity.cipherSeedを変えろとか、Your database configuration file is NOT present.とかCakePHPセットアップのお決まり文句言ってます。Pagoda BoxのLive Appでは、そんなエラー出てないのに。

なんか、FAQにデプロイする際にBoxfileをむにゃむにゃする的なことが書いてあった気がするので、そいつの中を見てみます。
$ vim Boxfile
web1:
    name: cake
    document_root: app/webroot
    shared_writable_dirs:
        - app/tmp/cache
        - app/tmp/logs
        - app/tmp/sessions
        - app/tmp/tests
        - app/tmp
    php_extensions:
        - mcrypt
        - apc
        - pdo_mysql
        - mysqli
        - mbstring
    after_build:
        - "mv pagoda/database.php app/Config/database.php"
        - "mv pagoda/core.php app/Config/core.php"
db1:
    name: db
    type: mysql

after_buildのところで、database.phpとcore.phpを書き換えてるっぽいですね。
開発環境とデプロイ環境の設定とかはこれでよしなにやるのか。なるほど。

◆ デプロイしてみる

とりあえずapp/Config/core.phpのSecurity.saltとSecurity.cipherSeed書き換えてブラウザで確認してみます。
(CakePHPのセットアップについては、ブログチュートリアルがとても参考になります)
14
とりあえずSecurity.saltとSecurity.cipherSeedの警告は消えたのでコミット・プッシュしてみます。
pagodaboxのリポジトリにプッシュするとデプロイがされます。
$ git add -i
$ git commit -m "core.phpの初期値を変更"
$ git push
Enter passphrase for key '/home/*****/.ssh/pagodabox_id_rsa':
Counting objects: 9, done.
Compressing objects: 100% (5/5), done.
Writing objects: 100% (5/5), 485 bytes, done.
Total 5 (delta 4), reused 0 (delta 0)
:: Deploying to c163cf8 on master
:: Parsing Boxfile
 
 _______________________
 BUILDING INFRASTRUCTURE
 """""""""""""""""""""""
   +> Init submodules
   :: Running After Build Hooks
      [ EXECUTING 2 HOOKS ]
 
      :: HOOK 1 ::
      ::  mv pagoda/database.php app/Config/database.php
      ---------------------------------------- OUTPUT:
      ------------------------------------------------
 
      :: HOOK 2 ::
      ::  mv pagoda/core.php app/Config/core.php
      ---------------------------------------- OUTPUT:
      ------------------------------------------------
      HOOKS COMPLETE - 2 Hooks Executed
 
 ______________________
 BOOTING INFRASTRUCTURE
 """"""""""""""""""""""
 + Booting Instances for web1
     web1.1
      - [25-Feb-2014 01:49:08] NOTICE: fpm is running, pid 106
      - [25-Feb-2014 01:49:08] NOTICE: ready to handle connections
 
 _________________________
 INFRASTRUCTURE GOING LIVE
 """""""""""""""""""""""""
 + Rerouting Traffic to new Infrastructure
 << traffic successfully ROUTED
 + Decommisioning Previous Infrastructure
To git@git.pagodabox.com:*****.git
   804a648..c163cf8  master -> master

なんか色々走って終わったみたいです。
設定ファイルをいじっただけなので、見た目は変化ないですがとりあえず簡単にデプロイは成功しました(やった!)

◆ Bakeでアプリのひな形を作る

せっかくなので、一つのテーブルを使って、CRUDができるものをCakePHPのBakeで作ってみようと思います。
ローカルの開発環境にデータベースとテーブルを作成して、Bakeを叩きます。
$ app/Console/cake bake

database.phpがないと設定を色々聞かれるので、ぽちぽち答えていきます。

database.phpが作成されたので、一旦コミットしておきます。
$ git add -i
$ git commit -m "database.phpを作成"

データベースの設定もできたのでサクッとBakeします
$ app/Console/cake bake all

焼き上がったらブラウザでアクセスしてみます。良い感じに焼き上がっていますね!
8

早速コミットしてプッシュしてデプロイします。
$ git add -i
$ git commit -m "BakeでCRUDのひな形を作成"
$ git push

この段階で、一旦、Pagoda BoxのLive Appを見に行きます。
9
焼き上がったBakeのひな形はしっかりデプロイできていますが、まだ、Pagoda Box側にはテーブルがないので怒っていますね。

◆ DB周りを触ってみる

ということで次にPagoda Box側のDBに、ローカルに作ったテーブルと同じものを作成します。
Pagoda-BoxのDBに触るには、Pagoda-BoxのターミナルクライアントのRubyGemを使います。(Rubyの1.9.2以上が必要です)
$ gem install pagoda

gemのインストールができたら、Pagoda-BoxのDBに接続してみます。
ローカルのアプリのリポジトリ内のディレクトリで、
$ pagoda tunnel -c db1

を実行します。-cは接続する先を指定していて、アプリ管理画面のダッシュボードの、db-1とかに対応しています。
10

最初にtunnelで接続しようとすると、認証のためにユーザーネームとパスワードの入力を求められるので、ユーザーネームにはダッシュボードの右上に書かれているものと同じものをPagoda-Boxの管理画面にログインするものと同じものを入力します。
$ pagoda tunnel -c db1
it appears this is the first time you have used our client
Username: bryan-f
Password: ******************

無事認証が済むと、Pagoda-BoxのDBとのTunnelが出来上がります。
MySQLに接続している間、このシェルは立ち上げっぱなしにしておきます。
MySQLの接続が必要なくなったら、ctrl-cでTunnelを閉じることができます。
Tunnel Established!  Accepting connections on :
-----------------------------------------------

HOST : 127.0.0.1 (or localhost)
PORT : 3307
USER : (found in pagodabox dashboard)
PASS : (found in pagodabox dashboard)

-----------------------------------------------
(note : ctrl-c To close this tunnel)

Tunnelが出来上がったら別のシェルを一つ立ち上げて、
> HOST : 127.0.0.1 (or localhost)
> PORT : 3307
を使って、Pagoda-BoxのDBに接続します。
$ mysql -h 127.0.0.1 -P 3307 -u [USER] -p

UserとPassは、ダッシュボードのdb-1のShow Credentialsをクリックすると確認することができます。
mysqlへの接続は、普段使っているクライアントを使っても大丈夫です。
12

mysqlに接続できたら、データーベースとか権限とか見てみます。
mysql> show databases;
+--------------------+
| Database           |
+--------------------+
| information_schema |
| db                 |
| test               |
+--------------------+

mysql> SHOW GRANTS FOR current_user();
+--------------------------------------------------------------------------------------------------------+
| Grants for *******@%                                                                          |
+--------------------------------------------------------------------------------------------------------+
| GRANT SUPER ON *.* TO '******'@'%' IDENTIFIED BY PASSWORD '*****************************************' |
| GRANT ALL PRIVILEGES ON `db`.* TO '*******'@'%' WITH GRANT OPTION                                      |
+--------------------------------------------------------------------------------------------------------+
 

dbデータベースに対して、ALL PRIVILEGESのデータベースレベルの権限が付与されているので、
このデータベースに、ローカルで作成したテーブルと同じテーブルを作成します。

テーブルの作成が無事終わったら、再びLive Appを見に行ってみる。
テーブルがないぞっていう文句もなくなり、新規作成、表示、編集、削除もばっちり動いてにっこりですね。
13







いかがでしょうか、こんな感じで簡単にWebサービスの開発・公開することができるPagoda Box。
個人的にはすごく気に入りました!

次回は、今回作ったものをベースに社内で使うちょっとしたサービスを作ってみようと思います!




Phalcon Punch!!!

こんにちは。VOYAGE MARKETINGで学生インターンをしている西尾@blackstar240と申します。

突然ですが、弊社にはCREEDという経営理念があり、その中の一つに
『圧倒的スピード。』
という言葉があります。
本日は『圧倒的スピード。』を誇るPHPのフレームワーク、Phalconを使い、テストプロダクトを作ったことについて書こうと思います。

はじめに


はじめに、Phalconについて簡単にご紹介します。
Phalconとは、C言語で実装されたPHP Extentionであり、
こちらのベンチマーク結果からもお分かりのように、PHPのフレームワークの中では『圧倒的スピード。』を誇るフレームワークです。
BenchExample
また、devtoolsという、スケルトンコードを生成する便利なスクリプトのコレクションもあり、
これまた『圧倒的スピード。』で実装が出来そうな予感がします。
早速、こちらを参考にフレームワークとdevtoolsのインストールを行い、
さくっとプロダクトを作ってみようと思います。

雛形作り


まず、devtoolsを使ってMVCモデルの雛形を作ります。
Webサーバーのドキュメントルートで
$ phalcon project [project name]
コマンドを叩いて下さい。
そうすると、プロジェクトの雛形が完成します。
ProjectHinhagata
続いて、controllerの雛形を作ります。
[project name]ディレクトリ直下で
$ phalcon controller [controller name]
コマンドを叩いてください。
すると、Phalconの命名規則にのっとった名前に変換され、controllerの雛形も完成されます。
ControllerHinagata
続いては、controllerにecho文を書き、正しく呼び出されているか確認してみようと思います。。。が、

routing


まだ、routingを書いていません!!
これでは、せっかく書いたcontrollerも動くはずがありません。
ここは落ち着いてroutingを記述しましょう。
まず、configディレクトリ配下にroutes.phpファイルを作成します。
config/route.phpの記述例がこちらになります。

add("/phalcon", array(
    'controller' => 'phalcon',
    'action' => 'phalcon',
));

$router->add("/punch", array(
    'controller' => 'phalcon',
    'action' => 'punch',
));

return $router;

続いて、confifg/service.phpに以下の記述を追記します。

/**
 * add routing capabilities
 */
$di->set('router', function(){
    require __DIR__.'/routes.php';
    return $router;
});

$diコンテナにsetすることで依存関係をすっきりさせることが出来ますね!!

これで、routingは完成しましたが、今のままだと、
Built-in serverではhttp://localhost:9000/index.php?_url=$1のリクエストで開発しつづけなければなりません
そこで、先ほど作ったconfig/routes.phpに以下の記述を追記しましょう。

$router->setUriSource($router::URI_SOURCE_GET_URL);
$router->setUriSource($router::URI_SOURCE_SERVER_REQUEST_URI);

これで、http://localhost:9000/phalconのような
綺麗なURIでの実装も可能となりました。

テンプレートの使い分け


ここまで、controllerから直接echo文を実行し、挙動を確認してきました。
続いて、viewのテンプレートを各コンテキストごとに使い分けてみようと思います。
まず、app/views/layoutディレクトリにcontrollerと対応する名前の.volt(.phtml)ファイルを作成します。
ViewsHinagata
controllerからメソッドでviewファイルへのレンダリングを記述します。

view->setTemplateAfter('phalcon');
    }

    public function punchAction()
    {
        $this->view->setTemplateAfter('punch');
    }

}

ここまで記述した所で、実際の挙動を見てみましょう。

Phalcon

Punch

Finish

見事、ファルコンパンチが繰り出されました!!

感想


今回、Phalconを使ってテストプロダクトを作成致しました。日本語でPhalconについて紹介する記事がまだまだ少ない中、開発において必要不可欠な要素についてご紹介することが出来たので、Phalconを使ってみたいと思っている方の一助となれば幸いです。
Webサービス作りにおいて、フレームワークの選択が重要となる昨今、今回のテストプロダクト作りで得た知見も活かし、今後も努力を重ねていく所存であります。
また、公式ドキュメント上にはサンプルコードも掲載されているので、よろしければお試し下さい。
最後に、このエントリーの内容を実装したものがこちらになります。
https://github.com/Nissy0409/phalcon

最後までお付き合いいただき、ありがとうございました。

記事検索
QRコード
QRコード