AWSの話題を中心に、日々の業務やプログラミングの徒然を綴るエンジニアブログです。

HANDS LAB

HANDS LAB ENGINEERS BLOG

ハンズラボエンジニアブログ

AWS OpsWorksでNginx+PHPのWebサーバを構築する

Pocket

概要

AWS OpsWorksはEC2上にアプリケーションのデプロイやミドルウェアのインストール・更新をするためのツールです。特に「ミドルウェアの更新が簡単にできるようになる」というのはサービス担当者としてはすごくメリットがあると思います。

私も以前、Webサービスを担当していましたがミドルウェアのインストール自体はインストール済みのAMIをコピーすれば良かったのですが、運用フェーズに入ると稼働しているサーバに対して更新が必要な時がたまにありました。

  • セキュリティパッチを充てる時
  • 新しくバーチャルホストを追加する必要が出た時
  • Nginxの出力ログの形式を変えたい時
  • fulentdやlogstashなどミドルウェアを後から追加したい時

などなど。

上記のような時に当時AMIを新しくとって展開したり、直接サーバに入って変更したり割と時間を取られた思い出しかなかったので是非ともハンズラボでOpsWorksを導入して行きたいと思いまずはOpsWorksでWebサーバ(Nginx+PHP)を構築してみました。

流れは下記の通りです。

  1. スタックを作成する。
  2. レイヤーを作成する。
  3. NginxとPHPをインストールするレシピを用意してレイヤーに設定する
  4. 実行

1. スタックを作成する

スタックは例えばWebサービスであればWebサーバ、DB、LB(ロードバランサ)など必要になりますが
これらリソースをグループとして管理するための最上位のエンティティになります。
もちろん、作成したスタックをコピーして新たなスタックを作成することもできます。

  1. まずはAWSコンソールから[Add your first stack]ボタンをクリック
  2. Chef 12 stackを選択。設定は以下の通りです。
    • Stack name : WebSample
    • Region : Tokyo
    • VPC : 任意(インターネットに出れること)
    • Default subnet : 任意
    • Default operationg system : Linux(Amazon Linux)
    • Default SSH key : 任意
    • Chef version : 12(固定)
    • Use custom Chef cookbooks : No(後ほど設定します)
    • Stack Color : 任意
    • Default IAM instance profile:S3にアクセス可能なロール
  3. [Add Stack]ボタンを押下

2. レイヤーを作成する

レイヤーはWebサーバ、DB、LBなどそれぞれのコンポーネントを表すものです。
例えば1つのインスタンスでWebとDBどちらの役割も果たしたい場合はWebサーバレイヤとDBレイヤに追加することもできます。

  1. 右メニューの[Layers ] から [Add Layer]ボタンをクリック
  2. OpsWorksタグの項目を以下のように入力して[Add layer]ボタンをクリック
    • Name : WebServer(Nginx+PHP)
    • Short name : webserver
  3. 最終的にブラウザから確認をしたいので[Network]のPublic IP AdressesをYesにしておきます。
  4. インスタンス起動時にS3に対してChefのライブラリやレシピを取得しに行くので[Security]のEC2 Instance profileにはS3にアクセス可能なロールを付与しておきます。

3. NginxとPHPをインストールするレシピを用意してレイヤーに設定する

スタック作成時にChef11を選んだ場合レイヤー作成時にレイヤータイプを選べてサクPHPサーバー(Apache)を作れるのですが、今回Chef12を選びましたのでクックブックは自分で用意する必要があります。

以下の流れでレシピを用意しました。

  1. Chef SupermarketにてNginxクックブックとPHPクックブックをダウンロード
  2. ちょっと設定ファイルとか修正して固めてS3にアップロード
    • chef_nginx/attributes/default.rbを変更
    • php/attributes/default.rbを変更
    • php-fpmのインストールレシピを作成(php/recipes/php-fpm.rb)
    • php-fpm.confのテンプレートを作成(php/templates/default/php-fpm.conf.erb)

      今回nginxとfpmの間はソケット通信するようにいたします。tcp通信にする場合はセキュリティグループでポートを開けておかないといけないみたいですのでご注意ください。
    • berkshelfを使ってレシピをパッケージング(圧縮)
  3. スタックのクックブックの参照先をS3にアップしたファイルにする
    • コンソールからWebSampleスタックの[edit]リンクをクリック
    • [Use custom Chef cookbooks]をYesにして[Repository type]に「S3 Archive」を選択
    • Repository URLに先ほどS3にアップしたファイルのURL、アクセスキー、シークレットキーは任意のものを入力
  4. WebServer(Nginx+PHP)レイヤーにてどのタイミングでレシピを実行するかを設定する
    • WebServer(Nginx+PHP)レイヤーの[Recipes]をクリック
    • Setup(インスタンス起動時に発火する)イベントに以下のレシピを追加
      • chef_nginx
      • php
      • php::php-fpm
    • [Save]ボタンをクリック

4. コマンド実行

  1. [Instances]の[Add an instance]からインスタンスを作成
  2. [Start All Instances]ボタンをクリック

 

しばらく待っていると…

webserver1-instances-websample-aws-opsworks

インスタンスのステータスがonlineになりました!

そして先ほど、レシピでドキュメントルートにphpinfo.phpを設置しておいたので

確認してみます。

phpinfo

PHPがインストールできていました!

まとめ

少しChefの学習は必要でしたがOpsWorksを使うこと自体は難しくありませんでした。
何より1度レシピを作ってしまうと使いまわせるのは非常に便利だと思います。

チームが大きくなってきたりプロジェクトが大きいと例えばミドルウェアのチューニングはインフラ?開発?なんて話も出て来ると思います。
私も開発側にいてこれって僕の仕事なのか??なんて思うこともありました。
DevOpsという考えがみんな大事なことだと分かってはいても仕事増やしたくなかったり、一度引き受けてしまうとずっとやり続けないといけなくなるリスクを恐れて消極的になってしまうこともあるんですよね。

しかし、チーム全員が気持ちよく開発できるためにもAWSの管理ツール系をうまく使って行くことが重要だと思います。

ハンズラボでも今後DevOpsに対しての取り組みを率先して行い効率化を図っていきたいと思います。
次回はCloudFormaiton + OpsWorksの記事を書いてみようと思います。

Pocket

iOSアプリの証明書とプロビジョニングプロファイルの有効期限が後何日で切れるかを毎週自動でSlackに通知してみた

Pocket

ios-cers-and-profiles-bot

はじめまして。三井田(みいだ)です。
4月に新卒としてハンズラボに入社して、早半年がたちました。
大学時代は授業で情報科学などを勉強する傍ら、UnityでモバイルARアプリを開発したり、個人開発のAndroidアプリをGoogle Playに公開したりしていました。
入社後は、新人研修の仮想プロジェクトでひたすらjQueryを書き続ける日々を送った後、現在のチームに配属され、DynamoDBを管理したり、PythonでLambdaを書いたり、PHPとJSで管理画面をより使いやすく改善したりしています。

さて、今回は多くのiOS開発者を悩ませる(?)、iOSアプリの証明書とプロビジョニングプロファイルについてのお話です。

やばい!iOSアプリの証明書の有効期限がっ…!!

1年に1回更新しなければならない、iOSアプリの証明書とプロビジョニングプロファイル。ついつい有効期限を忘れてしまい、期限が切れる直前(もしくは切れた後)に慌てて更新、なんてことはありませんか?
弊社でも先日、とあるiOSアプリの証明書の有効期限が切れる寸前になっていました。
その時は弊社エンジニアが気づき、緊急アップデートを行って難を逃れたのですが、もし気づくのが遅れて、証明書の有効期限が切れてしまっていたら。。。と思うとゾッとします。

そこで、iOSアプリの証明書、プロビジョニングプロファイルの更新忘れを防ぐために、証明書、プロビジョニングプロファイルの有効期限が後何日で切れるかを、毎週自動でSlackに通知するようにしてみました!

こんな感じです

ios-certificates-and-profiles-bot

毎週指定の時刻になると、管理サーバーでシェルスクリプトが自動実行されます(cron)。
スクリプトでは、証明書、プロビジョニングプロファイルの入ったプライベートリポジトリをgit pullした後、リポジトリ内の各.cer、.mobileprovisionファイルについて、後何日で有効期限が切れるのかを計算し、その結果をSlackに通知します。
【**注意!**】証明書、プロビジョニングプロファイルは厳重に管理してください!

スクリプトのソースコードはこちら(GitHub)です。(Linux環境用です。ローカルのMacで実行したい場合は、「$ brew install coreutils」を行った後、「date」コマンドの代わりに「gdate」コマンドを使えば実行できます。)

流れとしては、iOSアプリ証明書の有効期限を取得し、「年/月/日」の形にした後、

後何日で有効期限が切れるのかを計算します。

そしてその結果を、Slackに投稿します。

プロビジョニングプロファイルについても有効期限を取得し、同様の処理を行います。(弊社iOSエンジニア駒場に有効期限の取得方法を教えてもらいました!)

30日以内に有効期限が切れる場合は、アイコンと文言を変えるようにしました。

emergency

【おまけ】有効期限が切れると…

expired
…切れないように気をつけましょう。

まとめ

iOSアプリの証明書とプロビジョニングプロファイルが後何日で切れるのか、Slackに毎週自動で通知されるようになったので、余裕をもって年次更新を行うことができるようになりました!
また、Slackに通知することで、特定の開発者だけが有効期限を把握するのではなく、より多くの人の目で期限をチェックできるのも良いですね!
それでは、今回はこの辺で。

Happy Coding! 😉

参考

Pocket

セキュリティーグループが変更されたらSlackに通知する

Pocket

10月からハンズラボにJoinしました鹿倉です!

ただいま、AWSをシコシコ触っているところです!
今日はタイトル通りセキュリティーグループが追加されたり変更されたりした時に
Slackに通知するっていうのをやってみました。

流れは以下の図の通りです。

aws-design-11

 

  1. 1.CloudTrailとCloudWatchを連携する
  2. 2.ログを受け取ってSlackに通知するLambdaを作成する
  3. 3.サブスクリプションを使用してLambdaにログデータを流す

続きを読む セキュリティーグループが変更されたらSlackに通知する

Pocket

デザインを理解したいエンジニアに、デザイナが説明するといいこと

Pocket

こんにちは。デザイナの田名網です。
先日、エンジニア向けに社内勉強会をしました。

テーマは、デザインの基礎と、UX/UIについてです。
前回、新卒さん向けに行なった内容(新卒さん向けデザイン基礎研修をやりました。1回目 “デザインってなに?”)が好評いただいたので、基本はそのまま、今度はエンジニアさん向けに開催しました。

このスライドは前回も見ていただいたと思います。

 

デザイナ vs エンジニア?

巷では、デザイナ vs エンジニアに関する話で溢れていますね。
その様子は、対立というよりかは、近頃は「いかに仲良くやっていくかノウハウ」とか、「ハイブリッド型のエンジニア/デザイナであろう」といったような
平和な方向にシフトしているような感じがして、個人としては嬉しいです。仲が良い方がいいですね。
それほど言及されるのは、デザイナとエンジニア同士が日頃より論点や着眼点が違ったり、理解し合うのが難しい部分があるのでしょう。

「デザイン」と聞くと、余裕があったらやるデコレーションや、センスがものを言うアートだと勘違いされてしまいがちで、機能や重要度の部分が理解されづらいです。
そのため、実際の開発プロセスの中でも軽視されたり、省略されてしまうことも多いので、デザイナの立場から危惧していたところもありました。

エンジニアだらけの環境の中で考えたこと

ハンズラボは、管理部門を除く開発部門のうち、95%がエンジニアの会社です。

世界的に(!)理解し合えないと言われているデザイナとエンジニアですが、
ラボではデザイン思考やUXの大切さがじわじわと興味を持たれ、市民権を得てきています。

わたしはUXのデザイナなのですが、コードも書きますし、フロントエンドも実装するので、デザインだけやっているわけではなく、比較的エンジニア視点を持っていると思ってます。
そのせいもあって、デザインは、設計に近いロジカルなものだと考えることに馴染みがあります。

そもそも、デザインは、語彙の意味ですと本来はアートよりかは設計的な意味合いが大きいですし、
実際画面のユーザビリティについては特に、論理的な理由や裏付けが必要です。
デザイナが絵を描くだけの時代は、終わったと言われてますね。

 

実はエンジニアって、デザインを理解するのに向いているのでは?

デザインもロジカルな面があると知れば知るほど、なんだ、そんなことなら、エンジニアの思考と親和性あるのでは?と思ったのです。
今回は具体的に、エンジニアに、「デザインについてわかってほしいなー」というときに、どういう風に伝えたらいいか考えてみました。
続きを読む デザインを理解したいエンジニアに、デザイナが説明するといいこと

Pocket

新卒新入社員の仮想プロジェクト、完了しました

Pocket

大石です。
最近、弊社では専らPokemonGOが流行っています。
23区外にある自宅で何時間もアプリを起動しておくよりも、オフィスで昼休みにササッとプレイする方が捗ります。
うっ、ドードーが捕まえてほしそうな目でこちらを見ている……。

さて、先日、新卒新入社員だけで仮想プロジェクトやってますの中で、研修で行っていた仮想プロジェクトについて書きました。
6月末、仮想プロジェクトを終えましたので、今回はその話を書いていこうと思います。

前回のおさらい

時間と技術面のみの制限だけで自由にシステムを作ることになった新人4名。
自社のオフィスで使える蔵書管理システムをサーバレスで作って、先輩たちをぎゃふん(死語)と言わせてやるんだ……!
バックエンドでAWSを活用してサーバレスに、フロントエンドはPC画面の作成と同時にmonacaを使ってスマートフォンのハイブリッドアプリに挑戦。
果たして、無事に蔵書管理システムは出来上がるのか!?(謎の予告風

蔵書管理システム

誰がどの本を借りたのかを記録し、貸し出し状況を社内で共有できるような「オフィス特化型蔵書管理システム」。
最終的に以下のような機能をリリースしました。

機能

  • 借りる
  • 返す
  • 予約
  • 蔵書の検索・結果の表示
  • 蔵書の新規登録・削除
  • 予約の通知(予約が入るとその本を借りているユーザーへSlackで通知)
  • 人気の本ランキング(1週間に借りられた回数がより多い本を5位まで表示)
  • 本が借りられた履歴
  • ユーザが本を借りた履歴

 

フロントエンド

構成

  • HTML5:マークアップ
  • CSS3/Bootstrap v3.3.6:レイアウトのコーディング
  • jQuery v2.2.4(モバイルはv2.0.3):バックエンドとの通信、DOM処理
  • JavaScript:jQueryでできない処理を行う
  • Monaca:モバイルアプリ(ハイブリッド)の開発プラットフォーム

デザイン

PCの画面↓
BooKing_PC
スマホアプリの画面↓
BooKingiphone
UI・UXに考慮し、操作性に違和感が無いようにボタンなどを既存のアプリと同じような配置にしました。
また、同時に同じ本を借りられないようにするなど、ユーザが通常は行わないような動作をしないようにし心がけました。

バックエンド

AWSの構成

技術要件

  • API Gateway:APIの管理
  • Lambda (Python):DBアクセス、ランキングを定期的に作成
  • DynamoDB:永続データの保存
  • Cognito:ユーザ管理

 

開発方法について

スケジュール

  • 企画立案・決定:4日
  • プロトタイピング・設計:4日
  • α版実装:5日
  • 基本機能実装:8日
  • 付加機能実装:3日
  • テスト:5日
  • リリース・運用:2日

実際に作業できる日数は31日でした。
やはり実装に手惑い、テストが押せ押せな感じに……。
とはいえ、じっくり実装したおかげか致命的なバグはあまり無く、なんとかなったように感じます。

開発での技術的課題 フロントエンド

  • HTML, CSS, JavaScript (jQuery):研修で一切やらなかったため、慣れるまでに時間がかかった
  • OS依存のバグが、iOS、Androidそれぞれ1件ずつ発生した。どちらも実装方法を変えることで対処できた(重大なものは無かった)
  • 時間的制約でユニットテストができなかった

 

開発での技術的課題 バックエンド

  • 当初はAWS SNSも用いたプッシュ通知を予定していたが、時間の制約のため断念

 

チーム開発する上での課題

  • 共有不足:API仕様書の更新時の周知などができなかった。その解決策として朝礼、夕礼、昼休憩後など、細かに共有の時間を設けた
  • レビュー不足:UI設計やAPI設計など、設計者の一存で決まってしまったところが多かった

 

先輩社員の反応

6月末、先輩たちに向けてこの仮想プロジェクトの最終発表を行いました。
無事出来上がった蔵書管理システムを見た先輩たちから、褒め言葉をもらうことができました!1ヶ月半の短い中でこんなすごいものが作れるとは思わなかった!と。
さすがに死語であるぎゃふん!とは言わせることはできませんでしたが……(笑)

研修を終えて

研修を終えた今、私たちはそれぞれチームに配属が決まりました。
情報系卒の2名は既に業務に入っていますが、非情報系2名(うち一人は私)は実際の業務に近いことを演習のようなスタンスで勉強しています。
PythonでLambdaを書く日々が、黒い画面でシェルスクリプトを書く日々に変わりましたが、勉強が大切であることには変わりません。
日々の業務に追われる前に、様々なことを身につけていけたらなーと思います。

Pocket