あざらし備忘録。

渋谷ではたらく音ゲー大好きウェッブエンジニアがいろいろ思った事やった事を書いていくブログです

今更2017年を振り返ってみる

もう2018年も1/6が終わろうとしていますが、2017年の振り返りを...w

一時的に異動してPHP7 + Symfony3 + Dockerでの開発

2017年の前半は一時的に社内異動をしてお掃除のプロに家の掃除をお願いできるカジタクの開発をしてました。PHP7 + Symfony3 + Docker

www.kajitaku.com

ES5→ES2015+への置き換えや基盤の整備をしたり久々にSymfonyでのアプリケーション開発したり。

デザイナーやプロデューサーとも一緒に話をして進めつつな感じで忙しさはありつつ楽しかった〜

色々と大変なところもあったけどこれも良い経験。良い経験

Treasure2017でWeb APIについて一日講義

弊社で行っている夏のエンジニア向けインターンシップTreasureでWeb APIについてゼロから学んでもらう講義をしました。

speakerdeck.com

全然馴染みが無いような学生でも理解が進むように意識して作ったけど本当に参加した学生さん達が優秀でペロッと平らげていった印象wもう少し奥行きのある構成に出来ると講義に幅を持たせられるなぁと実感。

自分がインターンを受けていた5年前よりもかなりWeb慣れした学生が増えていた印象で、時代もありつつなのか面白いなぁと思うなどしてました。

通常業務もかなり忙しい時期だったので準備含め死にかけたけど楽しかったwやってよかった！(まぁしばらくはこういうのは休憩かなw)

API Gateway + Lambdaでペライチアプリケーションの開発

異動やインターン講師が落ち着いた後は、ペライチだけど一部だけ動的に変わっていくWebアプリをAPI GatewayとLambdaで作ってみたりしてました。

API Gatewayではマッピングテンプレートを上手く使うと意外と色々とできてとても楽しかったw

Apache Velocity Template Language (VTL) を使えるようになっていて、これを使いつつLambdaから返ってくるレスポンスをAPI Gatewayから返すレスポンスに含めてあげる〜という感じ

サーバーレスは良いぞ〜wそんなにリソースはないけどサクッと作ってその後インスタンスのお守りとかもしたくないよね、みたいな時にまず考えてみると良いと思います。それで考えてみてやっぱり要件にあわなさそうとかなら使わず普通に作れば良いだけですしおすし。

合わせてLocalStackやSAM Localと言ったサーバーレス周辺のツールとかもかじれたので良かった。

引き続き新しめのものを積極的に検討しつつシュッと良い感じのものを作れるように色々模索していきたい〜

昨年同様Rails案件もやった

11月位からはもともとやっていたRails案件に戻ってきて、新しい取り組みなどを作ったりたり。

とはいえ最近あんまりRuby/Rails周りへのアンテナが昔ほど高くなってないので、また色々キャッチアップしていかないとな〜とmm頑張ろう。

WEB+DB PRESSへ寄稿

(これが書きたかったのもあって振り返りが今になったというのはあるw(言い訳)

ありがたいことにWEB+DB PRESSへの寄稿の話をいただけて、PHPについて書きました。2018年02月24日発売のVol.103への寄稿となります。

はじめての執筆だったので色々と手探りのところも多かったですが本当に書いてよかった！やはり実際に形として残るものを出せるのはうれしいですしね。

アウトプットの形としては発表よりは文章を書く方が個人的にはあっているなーと改めて実感(ブログ書けてないけどw

  1. ものをつくる
  2. 文章を書く
  3. 発表する

の順番で好きなのが実際にやってみた上で認識合わせられたので良かった。何事も選り好みせず一回はチャレンジしてみる気持ちでやってみた上でなので自分にあったスタイルというのが明確になってしっくり来たなぁという感じ。引き続き色々やっていき！

時間の使い方を変えた

2017年は過去一忙しい年でもあった(特に前半)ので、色々と時間の使い方も変えていって、専業のお仕事をこれまでにも増してメリハリを付けて上手くやるように意識したりもしました。おかげでほぼ定時で帰る癖がついてきて良い感じ。

なんだかんだ2時間とか会社に残ってしまった〜みたいなのをやめて24時間の配分比率みたいなのをちゃんとコントロールするようにしたのはかなり良い感じだなーと。

というのに大きく寄与してくれたのがスプラトゥーンwツライことも多いけど良いゲームだなと。

副業も始めた

時間を上手く使っていきたいなというところで、知り合いの会社で週8時間くらいを目標で開発のお手伝いもし始めました。以前より忙しさはもちろん増えたけど違うプロジェクトも経験しつつ本業も出来るのはすごく自分のためになるので良い感じ:)

ついつい自分だけの開発をしようとするとデスクに向かうのに失敗しがちなのをお仕事として自宅のデスクに向かうことが出来るので良い習慣がついてきてて捗ります。これの延長線で自宅での趣味プログラミングや技術的なキャッチアップの時間が増やせてきてるので継続していきたい！

を上手く回していくぞいw

2018年の抱負

2018年はこれまでよりも実際手を動かして作る所に振り切って頑張っていきたい所存。

もの作ってなんぼだと思うのでその手数をこれまでよりも増やしていきたいし、趣味の開発もまた始めて何かリリースしたいなぁと思っています。

これは2017年に講師をやったり執筆したりという経験を出来たからこそしっかり持てた抱負だと思うので、2018年の振り返りをした時に「例年よりも色々コード書いたな〜」という感触を持てているようにしたいです。

そしてまだ知らない領域もたくさんあるので積極的に踏み込んで行きたい気持ち。

やっていき！

2016年ふりかえり

ふりかえり

今年は何をやったかな？というのを書いてみる。

マイチュウニズムネットリリース

チュウニズマーのチュウニズマーによるチュウニズマーのための(ry

ちょうど一年前の今頃に、正月休みで帰省しているときにガッと作った記憶。

今では10000人ほどのユーザさんが使っていてくれていて嬉しい限りです。作ってよかった！

これのおかげで僕だいぶレーティング伸ばせたしめでたしめでたし。

Rails案件へ

部署内プロダクト異動みたいなものがあって、2015年10月頃からRailsを書き始めるようになり、2016年になってからはほとんどRails(or Ruby)書いてました。

もともと主に書いていたのはPHPでフレームワークはSymfony2だったのでかなり流れが違うなぁと感じました。

フレームワーク的なところだとモデルに寄せやすいかサービスに寄せやすいかっていうのが一番違って感じたところかも🤔

まぁあとはやっぱりDSL的なところのRubyの強さ(よくわからないものが出来上がると弱さ)はすごいなぁと感じましたね。

去年の10月にこんな発表をババーンとしておいて、その直後からめっきりSymfony2を書かなくなってて疎くなって行ってたのは内緒w

shiro-goma.hatenablog.com

Pure Rubyなプロジェクトも

Pure Rubyなプロジェクトもサクサクっと進めたりもしました。

部署を横断して取り進めるものでなかなかこれまでとは勝手の違うタイプのプロジェクトで苦労もありましたが無事に進められてめでたしめでたし。

「ニュース記事を蓄積し、配信する」というような機能をもつ社内gemを開発して、API Gatewayを使ってシステム構築する、といったようなこともしてました。

techlog.voyagegroup.com

これ実質一人での実装だったのでなかなか寂しい思いをしましたが部署内のチームメンバーに支えられて良い感じに進められましたwありがたやありがたや

賞をいただくなど

2016年10月に開かれた全社総会で、ベストエンジニア賞なるものをいただきました。

正直こういった賞とかはまったく意識したことがなかったのでとてもびっくりしましたが、会社でやってきたことが評価されたというのはとても励みになりますね。

割と常に楽しんでやれるタイプなのでそうした安定感の中でコツコツお仕事出来たのが功を奏したのかなーと思います。

と同時にそういった雰囲気を作れている社内に圧倒的感謝🙏

これからも精進していきます。改めてありがとうございますmm

面接業

エンジニア業を初めて3年目、ありがたいことに社内グレードの昇格もさせていただき、面接業にも携わることが増えてきました。

人を見る目、じゃないですけどどんなことをやってきた人が良いかな、とかどんなことを考えている、大事にしている人と働きたいかな、というようなことを前よりもずっと考えることが多くなった気がします。

採用側に触れるっていうのはすごく見え方が違って学びが多いなーとしみじみ感じながら参加させてもらってました。来年も引き続き関わっていきたい！

DTM

大学の頃からずっとやりたいとは思っていながら出来ていなかった趣味のDTMにもだいぶ時間を割けた年だったかなと思います。

友人とも協力しつつ継続してやれて楽しかったです！

これは来年も引き続き時間作って進めていきたい。

お仕事ももちろん大事だけど、趣味の時間もそれと同じくらい大事。

忙しさに負けて一辺倒にならず上手く立ち回っていくぞ！

2017年に向けて

2016年はお仕事と新しい趣味は上手く進められたかなと思うけど趣味での開発、みたいなところは今ひとつ進められなかったかな〜と。

2017年はぼちぼち勉強会とかもまた参加したいし新しいものづくりもしていきたいのでそのあたりの時間も再び意識的に時間を増やしていきたいです！

意識的にやめていた毎日草生やし活動も2017年はもう一度再開してものづくりの習慣を作り直していこうかな〜。

2017年も頑張るぞい！

といって12/30からウイルス性腸炎とのことで寝たきり生活になっております...つらい...

まずは身体を元気にしてから、2017年も頑張るぞい...w

あなたにおすすめするWebSocketを用いた全く新しいOAuthのご紹介

ネタ Rails WebSocket OAuth

この記事は、 Advent Calendar 2016 - VOYAGE GROUP techlog の16日目のエントリです！

みなさんこんにちは！

VOYAGE MARKETINGにてエンジニアをしている なかにしごう (@gomachan46) | Twitter です。

2014年より社内非公式サークルとして 音ゲー部 を立ち上げ、お昼休みは会議室のプロジェクターで音ゲー鑑賞、定時後はゲームセンターで練習と、現在もなお元気に活動しています。

さて、今回はタイトルの通り WebSocketを用いた全く新しいOAuth をご紹介したいと思います。

ご存知の方も多いとは思いますが、さらっと簡単に用語の説明をしていこうと思います。

WebSocket

WebSocket（ウェブソケット）は、コンピュータ・ネットワーク用の通信規格の1つである。インターネットの標準化団体であるW3CとIETFがウェブサーバーとウェブブラウザとの間の通信のために規定を予定している双方向通信用の技術規格であり、APIはW3Cが、WebSocket プロトコルはIETFが策定に関与している。プロトコルの仕様は RFC 6455。TCP上で動く。

参考: WebSocket - Wikipedia

特性上、チャットなどのリアルタイム性を求められるようなケースに利用されたりしています。

ActionCable

Rails5系からの新機能で、 Rails と WebSocket をつなぐために用意されたものです。

これを用いることで Railsの良さはそのままに、リアルタイム通信を簡単に扱えるようになりました。

github.com

OAuth

OAuth とは、 Otoge Authorization の略です。

Otogeとは

簡単にいうとリズムに合せて作成された譜面の通りにボタンを押して遊ぶゲームです。音ゲーです。

以前よりもだんだんと認知度が上がってきているように感じますね！

OAuth は、この音ゲーで対戦を行い、相手よりも高いスコアを出すことでログインすることが出来るという全く新しい認証方式です！！*1

今回はこの OAuth を、 ActionCable を用いて実装してみました！

デモ

早速ですが百聞は一見に如かずということでデモをどうぞ！(動画埋め込みだと小さいかもしれないです)

OAuth を用いたログインの流れを、とくとご覧ください。

f:id:shiro_goma:20161216001120g:plain

上から落ちてくるログインボタンを...

f:id:shiro_goma:20161216001054g:plain

タイミングよくクリック！頼む〜！ログインさせてくれ〜🙏🙏🙏

f:id:shiro_goma:20161216001408p:plain

勝者には真のログインボタンが与えられ、ここからログインすることができます。

使っている技術

重複もありますがざっと触った技術も書いておきますmm

全て触ったことのない技術でなんじゃこりゃ、という感じのまま気づけばブログ投稿2日前を迎えましたがなんとか動かすところまで出来てよかったですw

コードは闇を抱えていますがこちら GitHub - gomachan46/action-cable-oauth: OAuth

WebSocket

以下のような情報を WebSocket を用いてpushしあっています。

  • 対戦相手のjoin情報
  • プレイ開始情報
  • 各プレイヤーのコンボ情報
  • 各プレイヤーのスコア情報
  • プレイ終了時の勝敗

Rails5

Rails5 系で ActionCable を用いています。

enchant.js

enchantjs.com

もうしばらく更新が止まっていそうですがとりあえず雑にゲームっぽいのが動きゃいいんだよ！ということで突っ込んでいます。

Rails 上に突っ込むのが必要だったので以下の記事やスライドあたりを主に参考にしました。

qiita.com

speakerdeck.com

音ゲー

音ゲーを雑にでも実装する必要があったので、以下の記事を参考にしながら実装しました。

blog.bokuweb.me

参考記事の皆さん、大変助かりましたmmありがとうございましたmm

スピード感、リアルタイム感

意外と(?)割と普通に音ゲー出来たなと言う感じでした！

動画の音声も2ウィンドウで同時に再生されているわけなのですが、ほぼズレを感じることなく聞こえているのではないかと思います🤔

処理する物量が増えたときなどどうなってくるかは要確認ですが、ちゃんと作ったらそれなりに面白いものが出来る可能性を感じるなどしましたw

おわりに

いかがでしたでしょうか？

これが未来の認証方式、 OAuth です。

みなさんも WebSocketを用いた全く新しいOAuth をぜひサービスに盛り込んで最高のログイン体験を！！

明日の更新もお楽しみに〜👀

関連

VOYAGE GROUP エンジニアブログ : あなたにおすすめするたった一つの最高のキーボード

shiro-goma.hatenablog.com

*1:これが言いたかっただけ。色々ツッコミどころはあるけどこまけぇこたぁいいんだよ！！←

どこかで埋めたフラッシュメッセージを特定のページに来たときに通知してあげる方法

Ruby Rails

f:id:shiro_goma:20161211150948p:plain

東京理科大学 Advent Calendar 2016 - Qiita の12日目のエントリです！

理科大野田キャンパスのOBです！

運河！なんもねーよな！神楽坂羨ましい！

今はVOYAGE GROUPというところでエンジニアやってます:) OB訪問的なのしたいみたいな理科大生さんいたらぜひぜひ！(番宣)

voyagegroup.com

さて、今回は、Rails小ネタみたいなのを書こうかなと思います。

どこかで埋めたフラッシュメッセージを特定のページに来たときに通知する

んーなるほどわからん感がありますね。

例

例えば、ログインボーナスのような機能を実装するとして、要件が

  • ログイン状態のユーザがどこかのページに訪れたらログインボーナスの条件を満たしたことにしたい
  • 訪れたページで通知するのではなく、TOPページへ行ったときに大々的に通知したい
  • 通知は一度だけにしたい
  • ログインボーナスの条件を満たした直後にTOPページに行ったときだけ通知するのではなく、関係ないページを回遊した後でも

という感じだったときに使えるtipsです！

やり方は色々と考えられますが、今回はおそらく一番手軽で簡単なRails標準のflashを利用した実装方法をご紹介します！

flash

flash - リファレンス - - Railsドキュメント

説明的にはこのあたりを見ていただければと思います。

flashのキーは notice や alert だけではなく、任意の物を使うことができます。(中身はただのhashです)

実装

簡単3stepです。

  • 通知するところで普通にflashから情報を取り出し表示する
  • 条件を満たしたところで普通にflashに情報を入れる
  • flash内の情報を適宜保持して引き回す←ポイント

通知するところで普通にflashから情報を取り出し表示する

トップページのview(erb)
<p>top</p>
<% if flash[:login_bonus] %>
    <p><%= flash[:login_bonus]%> controllerでログインボーナス獲得したよ</p>
<% end %>

普通ですね！ flash[:login_bonus] があればそれを出します。

条件を満たしたところで普通にflashに情報を入れる

class HogeController < ApplicationController
  def index
    flash[:login_bonus] = "hoge"
  end
end

普通ですね！ flash[:login_bonus] に情報を入れてます。

これはリダイレクトしたいなーみたいなときでも同様で大丈夫です。

def index
  flash[:login_bonus] = "piyo"
  redirect_to fuga_path # リダイレクトでも
end

flash内の情報を適宜保持して引き回す←ポイント

今回のキモですね。

class ApplicationController < ActionController::Base
  protect_from_forgery with: :exception
  after_action :keep_flash_login_bonus

  # flashメッセージを各actionでは引き回して保持し続ける
  def keep_flash_login_bonus
    return if controller_name == 'top' # 例えばtop_controllerでは出したいから引き回さないとか
    flash.keep(:login_bonus) if flash[:login_bonus]
  end
end

flash.keep() の使い方がポイントで、 通知したいところでは情報を引き回さないので次のリクエスト時にはflashが削除され、それ以外では情報を引き回して次のリクエスト時にもflashが引き続き使えるようにする みたいなことをやっています。

この方法を用いているため、先程の 条件を満たしたところで普通にflashに情報を入れる 部分での flash[:login_bonus] は flash.now[:login_bonus] でもどちらでも大丈夫です。

今回は簡単のためapplication_controllerに書いていますが必要に応じてmethod切り出しやmodule切り出しは行ったほうが見通しが良いですね。

実装としてはこれだけで良い感じに情報を引き回してくれます。

デモ

こんな感じです :)

f:id:shiro_goma:20161211144802g:plain

実装サンプル

今回用に作成したサンプルは以下から確認できます :)

github.com

おわりに

いかがでしたでしょうか？

ちょっとしたflashの活用法でした。ちょっとした一工夫でさらっと実装出来てなかなか良かったです :)

明日は stupid_student2 - Qiita さんが AtomでJavaの開発環境を整える エントリを出してくれるようです！

楽しみですね！Atomユーザもまだ使ってない人も必見！:)

HHKBをMac上に載せて快適に使うたった一つの簡単な方法[ネタ]

MacにHHKBを乗っけて開発したいですよね。

えっしたくない？アーアーキコエナーイ

ただ普通に乗っけちゃうとMac側のキーボードが反応して大量の謎の文字が打たれてしまったり、運が悪いと電源ボタンを押されて強制終了とかされたり。つらい。

どうにか上手く快適に出来ないかなーと思ってググッてはみました。

jigsaw.hatenablog.jp

あーわかるわかる。良さそう。でもアクリルなんてないし注文するの面倒くさいな...

detail.chiebukuro.yahoo.co.jp

あーわかるわかる。良さそう。でも質問者と同じ感じで無効にするのはな〜って感じなんだよね...

そこで思いついてしまったのがこちら！！！！最高！！！

いやー本当いろはす最高ですよ。もう手放せません。(別にキャップはなんでも良い)

いろはすはいいぞ。

AmazonWebServices実践入門を読み進めている[AWS][GitBook]

発売当初買って、しばらく家に鎮座していた AmazonWebServices実践入門 を最近読みはじめた。

www.amazon.co.jp

業務であまりAWSを一からガッツリ触れておらず、このままだとAWSを微妙に使えるけどよくわかってない、みたいなよろしくない状態になってしまうなぁと危機感を覚えていて、良い機会なので読みながら実際に色々試してみている。

今後はHerokuで動いているサービスをAWSに載せ替える、とかやって遊びたいなぁなどと。

AmazonWebServices実践入門は、実際にマネジメントコンソールから色々と試しつつ、適宜解説を入れてくれる感じでなかなか読んでいて楽しい構成になっているのでオススメかもしれない :)

また、少し前に書いたエントリーでGitBookを使えるようになったので、今回の本を読んで得た知識はGitBookを通じてアウトプットするようにしてみた。

gomachan46.gitbooks.io

(以前書いたエントリーはこちら)

shiro-goma.hatenablog.com

やっぱりすごく書き味が良いのですぐ良い感じにHTML化できるしそのまま公開もできるので楽ちんで素晴らしいです。

今後主にはちょっとまとまったアウトプットはGitBookで書いて、それの告知みたいな形でブログを書く、みたいなスタンスになりそう。

まだEC2周りまでしか読めてないので、引き続き試しつつ一通り使えるようになりたいな〜

markdown文書をhtmlなどに変換して公開・共有できるGitBookを試してみた[Git][Markdown][GitBook]

f:id:shiro_goma:20160314033908p:plain

感想。めっちゃよかった。

実際に一通り使ってみた情報をまとめてGitBookで公開までしてみたので、詳細は以下のURLからどうぞ。

gomachan46.gitbooks.io

概要についてはgitbook.com側のページからでも見れて、htmlの他pdfでのDLとかも出来て便利！

www.gitbook.com

今回の情報をまとめたリポジトリは以下。

github.com

所感

ちょっとGitBookの良さを活かして階層化とか無駄にして書いたので内容の割に長文化しましたが、とても簡単に、そして良い感じに文書の公開までを行うことが出来ました:)

使い方もはじめに要点だけ抑えてしまえばほぼ難しいことはないので、学習コストもほとんどかからない良いツールだと思います。

gitbook.comとGitBookコマンドが良い感じに分離されているのも素敵ですね。

これから文書をちょっとまとめて書きたい時とかは使っていこうと思います！