読者です 読者をやめる 読者になる 読者になる

サーバーレスアーキテクチャで画像の動的リサイズをしたら優勝しました 【SpeeeKaigiレポート#1】

AWS

イエウール / 開発基盤エンジニアの@pataijiです。

画像リサイズをサーバーレスでやっちゃおうぜってことをSpeeeKaigiで発表して、まさかの、優勝しました。

SpeeeKaigiについてはこちらの記事が詳しいです。 technica-blog.jp

トークテーマ

サーバーレスアーキテクチャで画像リサイズ

キーワード

  • 画像リサイズ
  • サーバーレスアーキテクチャ
  • AWS Lambda
  • Amazon API Gateway
  • ImageMagick

発表スライド

speakerdeck.com

スライド中の動いているデモはこちら http://cdn-ak.f.st-hatena.com/images/fotolife/p/pataiji/20160728/20160728104839.gif

質疑応答

リサイズした時のレスポンスタイムが気になる

計測していないので正確な回答はできないのですが、Lambda上で画像生成が走るのでかなりかかります。
オリジナル画像の容量や生成する画像サイズにより変わりますが、今回デモしていた感覚値では2000x2000pxの画像を生成すると2秒くらいかかります。
実際に本番で運用をするならば、事前にwarm-up等しておく必要があるかと思います。

結局imagemagickがlambda上で動いてる? imagemagickのバイナリどこから持ってきてるんですか?

LambdaはImageMagickがインストールされている環境上で実行されるので、それを使用しています。

Lambda、API Gatewayのオーバーヘッド時間がきになる。あるのかな?

こちらも計測していないのでなんとも言えないのですが、今回のケースではLambda上での処理の方に圧倒的に時間がかかるので、ここが気になることはないかなと思います。

所感

まさか優勝できるとは思っていなかったので、嬉しかったです。
終わった後の懇親会でも、リブセンスの桂さんをはじめ多くの方にお褒めの言葉をいただき感無量でした。

発表する内容については、今回のSpeeeKaigiの評価ポイントが プレゼン力 / 技術独自性 / 汎用性 とのことでしたので、ここはかなり意識しました。
実は当初は全く違う内容で発表をしようと思っていて、これは実現できたら絶対優勝できると自信があったのですが.....
SpeeeKaigiの2日前の夜になってから、ガッツリ実装が必要な内容だった分、どう考えても時間が足りないことに気づき、急いで方向転換しました。
発表30分前までスライドが完成していなかったので、当日は朝から気が気でなかったです。

計画性の無さと準備不足を反省し、次回SpeeeKaigi(ありますよね...?)には自信を持って臨めるようにしたいと思います。
まずは賞品として頂いたiPad Pro + Apple Pencilを使いこなすことから始めます。

各エンジニアの個性が出ていたSpeeeKaigi、とても良い場でした。

f:id:mogmog2:20160723201815j:plain:w300

クリアコードさんのおかげでOSS活動デビューすることができました!

f:id:omi_711:20160728140057p:plain

はじめまして!新卒1年目のエンジニアの高野 @YasuomiTakano です!

Speeeのエンジニアは「どんどん外に出ていこう!」ということで、OSS活動や外部イベントで登壇するなど、積極的にオープンな活動をしております。

最近のトピックとしては弊社のエンジニアの服部@yhattが公開した Markdown 記法でプレゼンスライドを書けるツール "Marp" が大きな反響を呼びました!

Markdown スライド作成ツール『Marp』の開発経緯裏話

このようなオープンな活動を積極的に行っている会社にいながら、私はOSS活動を行ったことがなかったのです・・・・。そのような私にOSS活動をするきっかけをくれたのが 株式会社クリアコード さんでした。

今日はこの場を借りて、私がどのようにしてOSS活動を始めることができたのかについての概要をお話します!

※詳細に関してはブログ後半の方にアップしているスライドにまとめてます!

きっかけ

私がOSS活動を行うことになったきっかけは 「OSS Gate in Speee」 という勉強会に参加したことです。こちらの勉強会は株式会社クリアコードの代表取締役をされている、須藤功平さんを講師としてお招きし、「OSSはこうやってやります!」といった OSS活動の活動のやり方 をハンズオン形式で教わりました。

私は「OSS活動?なにそれ美味しいの?」って感じからスタートしましたが、この勉強会に参加してからは「俺でも意外とできるぞ!」という感触がつかめました。

この勉強会を通じて「OSSとは何か」や「OSS活動のやり方」を学び、OSS活動のハードルが下がったように感じました!

OSSのやり方は意外とシンプルでした。 やり方さえ分かればあとはやるだけなので、結構楽しみながらできるようになりました!

f:id:omi_711:20160728140048j:plain ※ ワークショップについて説明を受けているエンジニア

OSS活動のおおまかな内容

私が今回選んだOSSはlitexbrlというXBRLをパーサーするGemです。

選定理由としては以下の3点でした。

  • 業務で必要だった!
  • ちょっと機能が足りなかった!
  • 作った人が日本人だからはじめてOSS活動するにはコミュニケーションとりやすそう!

その後、Usageが「作成中」となっていたところをIssueで報告したり、機能の拡張について相談したりなど、Gemの作成者と積極的にコミュニケーションを取りました。

クリアコードさんが背中を押してくれたおかげで、OSS活動に一歩踏み出すことができました!

こんなに簡単にOSS活動ができたことに感動しました!

社内イベント「SpeeeKaigi」でプレゼン

その後、楽しみながらOSS活動を続け、 SpeeeKaigi というSpeeeのエンジニアが業務や個人で学習した技術を惜しげも無く披露するイベントで私が今まで行ってきたOSS活動について発表しました。

クリアコードさんの勉強会でOSS活動を始めることができたことや私自身のOSS活動の進捗や所感について発表したところ、なんと 特別賞 を頂くことができました!!!

オーディエンスからは「いい話」や「この話普通にOSS初心者の会的なところでやれそう」など大変嬉しい反応を頂きました!

この発表を終えて、「この話って、『OSS活動を始めたくってもなかなか始められない人』に対して需要があるのかも!?」と感じました。

f:id:omi_711:20160728140050j:plain

イベント「クリアコード10周年祝い」でLT

そんなお世話になったクリアコードさんがなんと今年で10周年を迎えたということで、2016/07/25(月)にSpeeeLoungeクリアコード10周年の祝いを行いました!!! イベントの様子はクリアコードさんのブログで紹介されてます!

こちらのイベントでお祝いと感謝の気持ちを込めてLTをさせて頂きました!

f:id:omi_711:20160728140032j:plain

↓↓↓発表資料はこちらです↓↓↓

最後に

クリアコードさんに出会ってからは、様々な機会に恵まれ、活動の場が一気に広がりました!

今後はOSS活動を積極的に行うことはもちろん、私のOSS活動の体験談を積極的に外部に発信していきたいと考えております。

様々なきっかけを下さったクリアコードさん、本当にありがとうございます!!!

今後もクリアコードさんと共にOSS活動を盛り上げていけたらと思っております!!!

f:id:omi_711:20160728140023j:plain ※ 左:株式会社クリアコード 代表取締役 須藤功平さん、右:筆者(株式会社Speee エンジニア 高野泰臣)

SpeeeKaigi を開催しました!!

f:id:mogmog2:20160722145754j:plain

SpeeeKaigiとは

Speeeのエンジニアが業務や個人で学習した技術を惜しげも無く披露するイベント、それが「SpeeeKaigi」です。 簡単に言うとRubyKaigiのオマージュです。6月某日、半日かけて実施しました。

目的、内容

SpeeeではWebマーケティング事業や不動産事業、海外メディアなど様々な事業部にエンジニアが属しているため、業務の深い部分まで完全に理解することができないのが現状です。

エンジニアのmtgで毎週1人ずつ発表してるけど、開発部の人も増える中でより技術をオープンに発信する文化にしたい・・

暗黙知が増えることへの打ち手として、あーだこーだ言ってた中で、 「だったら社内で全員発表する機会を創れば良いのでは?」という議論になり、 どうせやるなら本気でやろう。と思い、審査員、賞品を用意して実施したのがSpeeeKaigiとなります。要するにエンジニアのお祭りです。

今回は「技術を用いた課題解決」をテーマとし、 各々の技術的挑戦について7分でプレゼン、質疑応答3分という時間を設定し、 プレゼン力、技術独自性、汎用性などを評価項目として、 エンジニア全員が発表しました。

f:id:mogmog2:20160711172144j:plain:w600

賞品について

どうせやるならお祭りっぽくしようという思想のもと、豪華な賞品も用意しました。

1位 iPadPro 128G + Apple Pencil

f:id:mogmog2:20160723201815j:plain

2位 Nest Cam

f:id:mogmog2:20160723201831j:plain

3位 Raspberry Pi3

f:id:mogmog2:20160723201850j:plain

審査員について

加えて今回はガチで楽しむという趣旨のもと、審査員の方を3名お招きしました。おかげで本当に良い緊張感となりました。

ご協力いただいた皆さん、ありがとうございます。

f:id:mogmog2:20160711173132j:plain:w600

<審査員>
左から

  • 株式会社リブセンス 取締役 桂 大介氏
  • 株式会社ビットジャーニー代表取締役 兼 株式会社Speee開発部顧問 井原正博氏
  • 株式会社Socket CTO & Art Director 生内洋平氏

当日の様子

SpeeeKaigiのために銅鑼も用意しましたw (本気の銅鑼は高すぎるため自重しました。) が、お寺の鐘みたいな音しか出ないので、次回までにはグレードアップさせたいです。

f:id:mogmog2:20160722145855j:plain:w600

発表はSpeeeLoungeで実施し、エンジニア以外のメンバーも見れるよう、出入り自由としました。 当日は様々な事業部、職種の方にお越しいただき、全社的にも注目度が高いイベントになりました。

一部の発表資料

id:takanamito による「HLSでやっていく動画ストリーミング配信」の資料です。
HLSにおけるhttpストリーミングの技術解説を中心に、サーバーレス動画ストリーミング配信にも挑戦したLT。
資料の中でも触れられていますが、社内GyazoサーバーにHLS配信の仕組みを実装したため
弊社は「社内動画ストリーミング配信し放題」です。

自事業部のエンジニアが発表するメンバーもあり、さながら事業部対抗戦の様相も呈していました。

f:id:mogmog2:20160723203230j:plain

新卒からベテランまで、年齢や得意領域、関係なく、ネタ抜きのガチの技術発表が続き、あっという間の4時間でした。 審査員の方にも一人ひとり厳正に審査いただきました。

f:id:mogmog2:20160722145952j:plain:w600

終わってみての感想

第一回ということもあり、終始緊張感が高く、エンジニアはもちろんのこと、エンジニア以外の職種の人からも反響があり、会社全体に波及して良い刺激になりました。

エンジニアの声

SpeeeKaigiお疲れ様でした。

受賞できたことがとにかく嬉しく、昨日帰ってから起きた娘にウザ絡みしていたようで。 改めて日常的なインプットの重要さとAWSの有り難みを実感しました。


SpeeeKaigi終了

シンプルにくやしいやつ


SpeeeKaigi 名寄せをテーマに話したのですが、

桂さんに面白いテーマだったと気に留めてもらえたことは、とても嬉しかった。

他の職種の声

SpeeeKaigi、素敵すぎました。

勉強になったし、開発部の一人一人に負けないように我も個を研鑽せねばと感化されました。


SpeeeKaigi魅入っちゃいました。

エンジニアさん方々の普段は見られない姿が見られて良かったです!


SpeeeKaigiができる文化が醸成されているエンジニアの皆さん、

このイベントが開かれるまでになるには一朝一夕ではなかったと思うけど、ちょっと羨ましい。

このイベントの主目的は社内の技術発掘と、普段なかなかプレゼンする機会のないエンジニアがSpeeeKaigiを通して、自分の技術をアピールすることです。

なかなか見えなかった「隠し玉」的な技術発表もあり、これまで知られていなかった人、技術の良い点、改善点も見えてきたことで、今後のさらなる成長のきっかけにもなるのではと感じています。

業務の合間に本気で準備をするのは大変ですが、終わった後の、 「またやりたい!」「次はみんなに負けない!」という声も多く、 前のめりに技術を磨いていこうとする姿勢を見て、第二回開催の手応えを感じています。

また、今回はエンジニアがそれぞれ所属する各事業部が、このイベントの為に時間を割く事を快諾してくれたから出来た事でもあります。

前述のコメントの通り、SpeeeKaigi実施中も開発部以外の社員が多く見学に来て、自部門のエンジニアを応援していたのも特徴的なイベントでした。

最高のイベントになったので次回もぜひ、開催をしたいと思います!!

f:id:mogmog2:20160723202222j:plain`

【告知】
今回、SpeeeKaigiを実施したLoungeにて、コーヒーのプロを招いた勉強会を実施します。
コーヒー好きな方、Rubyistの方、Loungeに遊びに来たい方、ぜひお越しくださいませー!

Speee Coffee Meetup #01 - connpass
http://speee.connpass.com/event/35935/

安心リリース in イエウール 【社内勉強会レポート#4】

エンジニアの @suemoc です。
社内勉強会にて、イエウール事業におけるリリース手法について話しました。

トークテーマ

安心リリース in イエウール

キーワード

  • カナリアリリース
  • ブルーグリーン・デプロイメント

発表スライド

質疑応答

カナリア環境で問題が発生したとき、どのようにロールバックするのか。LBの設定を切り替えているのか。

ロールバック時はソースコードをデプロイし直す。

カナリア環境での検証で、問題なしと判断する基準は何か?

事業として許容できる数値の変動を事前に決めておく。
イエウールの場合はCVRなど。

kageのようなシャドウプロキシとカナリアリリースのメリット・デメリットは?

kageは外部公開せずにサービスのテストができる。
カナリアリリースは外部公開するリスクを負う代わりに
公開しないと発見できない問題を見つけられる。

スキーマ変更を伴うリリースの場合はどうするのか?

スキーマ変更がある場合はこのリリースフローに乗せられないため、別のフローを使う。

所感

どんなサービスであれ、規模の拡大に伴いリリースのリスクは増大していきます。
カナリアリリースはどんな種類のサービスでも採用できるわけではありませんが、
サービス規模が大きくなっても開発スピードを落とさないための
一つの方法として覚えておくとよさそうです。

Speeeの新卒エンジニア研修について

はじめまして。16新卒エンジニアが3人衆の1人wataruと申します。 弊社は今年は初めて、新卒エンジニア研修としてTECH::CAMPを利用しました。

やったこと

私と同期のMKenta,omiは1ヶ月半の間に、

  • 前半戦
  • 「TECH::MASTER」を使用した基礎学習
  • 後半戦
  • TECH::CAMPメンターの方とグループ開発
  • 総括
  • 社内のエンジニア全員の前でプレゼンテーション

の順で、研修を行いました。

前半戦(04/11〜04/18)

前半戦は「TECH::MASTER」と呼ばれる専用カリキュラムでエンジニアとしての地盤固めを行いました。 「TECH::MASTER」は、8つの基礎カリキュラムと3つの応用カリキュラムで構成されています。 開発環境構築から始まり最終的にRails appが3つ完成するもので、私たちはこの「TECH::MASTER」を進めながら

  • Rubyの基礎
  • HTMLとCSSの基礎
  • 簡単なスクレイパーの作り方
  • Herokuへのデプロイの仕方
  • 基礎的なRails appの作り方

などをひたすらインプットしました。 1週間という期間でしたがカリキュラムをすべて終えることが出来ました。

「TECH::MASTER」は何度も何度も受講生の要望などを受けて更新されており、初学者にもわかりやすいコンテンツでした。この記事を書いている現在も更新され続けているので更に良い物になっていると思います。

後半戦(04/19〜5/26)

後半戦では、弊社のリードエンジニアからの

「Rails4系でSlackのクローンWebアプリを作成せよ」

という課題を基にメンターさんにお世話になりながら初めてのグループ開発に挑みました。 朝と夜に定例MTGを実施し、 タスクと予実をTrelloで管理しながら、 自分のタスクの現状、チームの現状、互いへの要望などを熱く語り合っていました。

プルリクエストの一つ一つにメンターの方や弊社エンジニアの

review

のような熱いレビューコメントが飛んでくる環境の中、ゴリゴリと開発を続けました。

今回のサービスを作るにあたって、最初に3人で設計や技術選定をする期間を設け、その後に実装までを行いました。 具体的には

  • フロントエンド
    • Reactを使用したリアルタイムチャットの実装
    • UI・UXのデザインとコーディング
  • バックエンド
    • Nginx + Puma + Rails環境構築
    • Itamaeを使用したサーバー設定の自動化
    • Capistrano3を使用したデプロイ環境構築
    • チャンネルの作成・更新・検索機能の実装
    • deviseを使用したユーザー認証機能の実装
    • Paperclipを用いたユーザーアバター機能実装
    • ダイレクトメッセージ機能の実装

などを行いました。

私が主にバックエンドのインフラ構築やチャンネル関連の機能の実装を行い、MKentaはReactを使用したリアルタイムチャットの実装を一人ですべて実装、omiはdeviseを使用したユーザー認証周りやデザインの実装を行いました。

初めてAWSを触りながら手探りでインスタンスを立て、ElastiCacheやRDSなど必要な設定を行ったところで「これでインフラは大丈夫かな」と思っていたところ、 弊社のリードエンジニアから「そんなところで満足されては困る、自動で設定出来て自動でサーバーを建てられるようになって初めて普通だ」と言われました! それからItamaeを導入し、Rubyのバージョン管理からNginxの起動までをコマンド一つで実行可能にすることを試みました。 しかし、

  • 環境変数が通らない
  • Redisが立ち上がらない
  • Nodeがインストール出来ない

……などなど様々な問題が発生しました。 同期達やメンターの協力を得ながらその一つ一つを解決し、なんとか『Itamaeによるサーバーの設定の自動化』を実現できました。

他にも

  • S3を使ったファイルアップロード機能
  • Webサーバを増やしELBを使ってのロードバランシング
  • チャット投稿やログを参照できるAPI

など実装したい機能、導入したい技術が沢山ありましたが私達の力不足で泣く泣く諦め後半戦を終えました。

実際のコードはこちら

完成したサービスのスクリーンショット

TOP

チャット画面

構成図

サーバー構成図

最終プレゼンテーション

最終成果発表

研修の総括として社内の全エンジニアの前でプレゼンテーションを行いました。 その時の資料がこちらです↓

このプレゼンテーションを行った際の質疑応答で

  • 「今回の研修で一番自信のあるポイントはどこですか?」

という質問に対し,

私は「テストコードを正確にかつ綺麗にかけたことです」 MKentaは「モダンなフロントの実装ができたことです」 omiは「デザインです」

と、三人がそれぞれスラスラと応えることができ、この研修の密度と充実度を実感しました。 その一方で、

  • 「このサービスを運用するための仕組みは何か有りますか?」
  • 「今回の研修の技術的な反省点を改善する具体的な方法は何か考えていますか?」

などの質問にちゃんとした答えが返すことが出来ず反省点も見えました。

学んだこと

私たちは前半戦でRubyの基礎文法と、Rails wayに則った設計・コーディングの手法を学びました。 Rubyを初めて触ったメンバーも居ましたが 「前半戦でしっかりと基礎固めが出来た」 と自信をつけていました。

後半戦では約6週間という長さを活かして、以前からやってみたかった技術であるReactやES2015に積極的にチャレンジし、業務に活かせる技術領域を広げることができました。

研修全体を通して RSpec を使用したテストを書き続け、DRYで正確なテストコードの書き方を学び、 普段自分のお金ではなかなか手が出せなかったAWSでのインフラ構築も、基礎的な知識を付けた上で自動化までチャレンジでき、とても嬉しかったです。 GitHub Flow + PullRequest駆動開発を行っていたお陰でGitHub活用ノウハウも大きく身につきました。

反省

今回の研修の反省すべき点は『難しい事』や『かっこいいこと』をやろうとし過ぎたことだと思います。 基礎の確認となる技術を中心に選定し開発を行うべきだったと思っています。 私達が今後の業務で開発するのは、『なんとか動かす事ができている』システムではなく『しっかり安定して動かすことができる』システムなので、基礎をしっかり固めるべきだったと反省しています。 ただ、技術的難易度の高いことにチャレンジし、なんとか実際に動くサービスを作ることが出来た事は良かったです。

これから

今回の研修で得た知識を足がかりにさらなる技術力を身につけ、いち早くプロダクトに貢献できるようになりたいです。 あの研修に行かせて良かったと言っていただける成果を挙げ続けていきたいと思います。

  • TECH::CAMP様公式ブログでも今回の研修について取り上げて下さっていますので、宜しければ合わせてご覧ください。

Speeeが新卒エンジニア研修をTECH::CAMPに託した「狙い」とは?