KazumaLab.

流行りとリラックマと嵐が大好きです。

【すいはんき工房】Youtuberをはじめました!

こんばんは!

かずまです。

 

最近更新できてなかった技術ブログですが、ここ最近ずっとYoutuberについて研究しておりました。笑

  つまりタイトルにも書いた通りYoutuberをとりあえず頑張ってみることにしました!🙌

 

チャンネル名は

【すいはんき工房】

www.youtube.com

珍しい開発系Youtuberとして活動します。エンジニアリングがわからない、プログラムがわからなくても楽しく見れるように作っています。もちろんわかる人にとってはより面白い動画になるよう頑張ります。

是非ともチャンネル登録してみてください!

最近の動画はこちら!

バンバンあげて行くのでよろしくお願いします!

InstagramTwitterもやってます!お見逃しなく! www.instagram.com

twitter.com

Webサービスを作る時にどれだけモチベを維持出来るかということ

かずまです。
今日は結構ふわっとしたお話です。
というより、最近「こういうサービスあったらいいな」と思って作ろうとするのですが、
モチベが続かず、ぼくのGithubにfirst commitと書いたcommitだけを残したリポジトリがあちらこちらに散らばっています。

サービスをいかに価値のあるものにするかというのは初歩のアイデアも大事ですが、
なにより作りきること、継続的に開発を進めていくことだと思っています。

これってゲームを作るのも同じ感覚でした。
なので、ゲームジャムとかで作ったものってシンプルだけど作りきるという意思で作っているから結構面白いものができるし、
そこに価値があると思うのです。

まぁゲームジャムはそこで終わっちゃうと残念ですが、
継続して続けられるならなおいいですよね。

最近作ろうと思ったものの例

  • 匿名性のSNS

これは完全匿名制で、情報をPOSTした際にそれに関連するタグを発行します。
そのタグをフォローしている人にその情報が届くシステムで、ユーザーに優位性を持たせて、自分が情報を投稿すればするほど
もらえるデータも増えるというサービスです。(Amyee)

続かなかった原因

  • セットアップ、設計に時間がかかってしまうこと。

WebサービスだとUser(ログイン)を必要とするサービスが多いです。最近だとOauthも標準的にログイン、会員登録として使われます。

個人で開発するときはRailsが多いのですが、
毎回ログイン周りをやろうとするとだるくてやめてしまう原因となります。

解決策

RailsではApplicationTemplateといった機能があります。
毎回これ入れるし、自動で作ってくれい!みたいな感じです。

それでさっとログインまでを作ってしまえば!と思ったりもします。

ginzarb.github.io

ここで@onkさんが話してたのを聞いて、いいなと思ったのですが、未だできてないのです...

  • 新しいことをやろうとする

これは今回のアプリケーションで使おうとしていた、PWAとか、技術的にはRailsAjaxだけでも全然できるんだけど、
ネイティブアプリっぽいデザインにしちゃったからPWAを使って通知とかしてみる?とか
Sinatoraで書くときにいつもは使わないのにWebpackerを使ってみたりとか
結構やらなくてもプロトタイプは作れるぞ!というのをいいたいのです(自分に)
ただ興味をもってしまうとたとえできなくても面白いのでやっちゃうのが現状です。
そして、導入できたら満足してしまう、もしくは上手く動かなくてサービス開発すら断念してしまう。

解決策

これは難しいと思います。と同時に引き合いだと思います。
今必ず必要な技術であれば、やる優先度を上げて、サービスがたとえできなくとも技術が学べただけでも大きいといったことであればどんどん挑戦していくべきだと思います。ただ、思いつきのサービスは実際作ってみると大したことないことがほぼほぼなので、簡単に作れる、一行でも書くコードが少なければ少ないほどいいですよね。

どっちがいいか、エンジニアとして幅を広げていくなら前者、サービスをひたすら作りたいのであれば後者みたいな感じかなぁ。
いい案があればコメントください。

最後に

最近こういう一人で作業しようとすると眠気くんが誘惑してきます。
布団の世界にこないか?こっちの世界は最高だぞと。

要はサービスを作る上で最も大事なのはある程度の技術は必要ですが、
モチベーションと健康は大切ですね...。

朝早く起きて、集中できる状態で、、、と思ったりして実行してみましたが、
9:00出社だ、あと2時間しかダメじゃん!みたいなことを考えるとかえって開発が進まなかったりしました。
自分にとって最高に集中できるのってなんだろうってお休みの間に考えたりするのもいいですね。

リモートでもローカルでもペアプロが行えるサービス"Pepro(β版)"をリリースしました

こんにちは。 かずまです。

saku氏とともにコツコツ作っていた、ペアプログラミングが行えるサービスをリリースしました。 それがPeproです。

www.pepro.me

まだまだスタートして間もないサービスですが、 ぜひとも使ってみてください。 * なお、若干つながりが悪いかもしれません。そういう場合はプログラムをCommand + Sで保存して、お互い再読込してみてください。

ペアプロとは

ペアプログラミングの略で、基本的に2人体制でプログラミングを行う開発手法です。 実際にやったことありますが、結構いいです。

  • めんどくさいところも絶対に進む
  • 詰まっているところが明確になる
  • その場でレビューもしてもらえる
  • お互いの開発のいい癖を盗める

デメリットとしては

  • 片方の作業が止まる
  • 1人じゃできない

が挙げられると思いますが、これら以外ではあまりデメリットはないイメージです。

Pepro

Peproの主な機能としてはペアプログラミングで大事な

  • 声に出すこと
  • 指差しすること
  • 一つのコードを一緒にみること

これらの機能を備えています。

声に出すこと

同じルームに入ると基本的に音声通話が始まります そこで話をしながら進められます。

指差しすること

今、ここのコードのことを言ってるんだよ!という確認や指示のときに使います。 基本的には画面をクリックしたところにポインターが当たるようになっています。

一つのコードを一緒に見る

Pepro を開くとエディタが一つだけあります。 片方がプログラムを書き始めると相手側の画面にもプログラムが同期されます。 (本来は同じ画面ですが...)

これでペアプログラミングを行うことができます。

おまけ

ペアプログラミングは喋って、頭を使って、プログラムを書きます。 その為、疲れてしまうのではないでしょうか?

Peproのルームを作る際にウェイティングページを準備しておりますので、その間にコーヒー等を一杯お持ちくださいませ。 準備ができ次第、ルームに入りましょう!

運営

Pepro開発ブログ

サービスURL

https://www.pepro.me

私にペアプロして!という感じの意味合い...!!

RailsでCSRFを無効にせずにAjaxからRESTなAPIを叩く

かずまです。

ここ最近Railsでサービスを作っている時にJavascriptをよく使います。 そのときにうーんこれはどうすれば良いのだろうと思ったので自分用にメモします。 初歩的なお話です。今回CSRFについては長くなりそうなので省略します。

始まり

  • 同じリソース内に定義したRESTのAPIJavascriptから叩きたい
  • RailsCSRF対策がされているので、AjaxでPOSTなどは400(InvalidAuthenticityToken)で弾かれる
  • RailsのController側でCSRFを無効に出来るが、あまり使いたくない

今回はこんな感じの流れだったと思います。

対策方法

今日たまたまAjaxを使った部分があって、 気になっていたので調べてみました。

blog.willnet.in

あら。すぐにありました。 Willnetさんのブログ。いつもお世話になっている...!! しかも、9年前だった...。

= hidden_field_tag "authenticity_token", form_authenticity_token

これであとはJS側でgetElementByIdとかjQueryとかでとってきてdataの中に組み込んであげれば良いのでめっちゃ便利。

Rails5になって...

techracho.bpsinc.jp

Formごとにトークンを発行できる仕様にできるみたい。 これで攻撃被害をすこしでもすくなくできるっぽいですね。

せっかくなのでみんなのウェディングアドベントカレンダーのみんなが書いたセンテンスを使ってみたい件

こんにちは、@kazumalabです。クリスマス、どうお過ごしでしょうか? この記事は2017年みんなのウェディングアドベントカレンダーの25日目(最後)の記事です。 25日間、皆さん完走お疲れ様でした!新卒一年目で、皆さんを煽って、アドカレやろうぜ、と言い出して、こんなに毎日続けることができたのは非常に嬉しいです!

昨日は、rinさんのプログラミングを始めるきっかけはもっと簡単でいいと思ったイブの日でした!確かに、僕もRuby on Railsを始めるときに本を買って、わーわからない...ってなったのを思いだしました。確かにRailsGirlsでハードルが下がるのはいいですね!

今回のテーマ

今日はせっかくみんながバラエティに飛んだ、記事を書いてくれたので、それを使って遊んじゃおうという企画です。 ちなみに、環境のセットアップから実装部分までを当日(25日)に行っていますので、間に合わない可能性がございますが、頑張ります。

テーマは「みんなのウェディングのアドカレをとりあえずWord2Vecにかけてみたい」です。

ゴール

Word2Vecで単語を入力して、似たような単語が取れればOKです。 例えば、結婚式とか結婚を入力して、関連したものが取れればいいですね。

環境構築

今回の流れとして、

  • アドカレの記事を全部取ってくる
  • advent calenderをMeCabで単語に分割してデータを作成
  • Word2Vecで学習させる 
  • 単語を入力して似たベクトルの単語がかえってくるか確認してみる

THE・入門のような感じがしますが、古典的な方法でやってみたいと思います。

word2Vecとは?

word2vecはニューラルネットワークオープンソース化されている実装で、単語をベクトルに変換するために作られたものです。作者の主張によると意味的に関連が強い単語はベクトルが近くなるそうです。「王様から男を引いて女を足したものはなにか?」の問に対してのベクトルは女王に近くなると言った例が示されています。

セットアップ

まずはデータを準備します。 ここからすべてにアクセスして、内容をとっときます。こういった場合、スクレイピングがいいのですが、結構グレーゾーンなので、自力ですべてコピペします。(mwedのblogはスクレイピングしました、すみません...) 今回少しデータ量として足りないので、みんなのウェディングエンジニアリングブログの過去記事も少し入れておきます。

MeCabに入れる

word2vecに入れるためには単語に分割したほうがいいようです。 このタスクをわかち書きといい、そのためのツールがMeCabというわけです。 MeCabの導入は今回は省きます。

先程はblog.txtというファイルを作成しました。 まずはデータをRubyで整形します。 スペースは不要なのでgsub等で置換します。

データの整形ができたところでMeCabに入れてみます。

import MeCab

tagger = MeCab.Tagger('-Owakati')
f = file('blog_wakati.txt', 'w')
lines = open("blog.txt").readlines()
for line in lines:
    f.write(tagger.parse(line))
f.close()

これによってblog_wakati.txtという名前で以下のようなデータが出来上がりました。

みんな の ウェディング アドベントカレンダー の 3 日 目 です ! 今回 は サービス を 成長 さ せる ため に デザイナー が どんな 働き 方 を し て いる の か を ご 紹介 さ せ て いただき ます 。 実際 に みんな の ウェディング が 始め た 「 LINE 相談 」 サービス を 広げる ため に 、 私 が 取り組ん だ こと の 一部 を お話 し ます 。 みんな の ウェディング に は 相談 デスク という 、 式
場 探し の 相談 が できる ブライダル カウンター が あり ます 。 プロ の ウェディング アド
バイザー が 、 結婚式 にまつわる お 悩み に 答え て くれ ます 。 もともと 店舗 へ の 来店 以外 に も 、 電話 や メール で 相談 に 乗っ て い まし た が 、 より 気軽 に 相談 し やすい よう に LINE という 窓口 を 追加 し まし た 。 すべて 無料 で 相談 できる
...

このような感じなのですが、みんなのウェディングという単語が残念になっていたので、ここで辞書を使ってみます。 辞書はmecab-ipadic-NEologdを使います。この辞書はmecab-ipadic-NEologdをインストール後、先程のPythonのコードにオプションを追加します。

tagger = MeCab.Tagger('-Owakati -d /usr/local/lib/mecab/dic/mecab-ipadic-neologd')

そうすることによって以下のようになります。 この記事はここですね!

みんなのウェディング アドベントカレンダー の 3日目 です ! 今回 は サービス を 成長 さ せる ため に デザイナー がどんな 働き 方 を し て いる の か を ご 紹介 さ せ て いただき ます 。 実際 に みんなのウェディング が 始め た 「 LINE 相談 」 サービス を 広げる ため に 、 私 が 取り組ん だ こと
 の 一部 を お話 し ます 。 みんなのウェディング に は 相談 デスク という 、 式場 探し の
相談 が できる ブライダル カウンター が あり ます 。 プロ の ウェディング アドバイザー が
、 結婚式 にまつわる お 悩み に 答え て くれ ます 。 もともと 店舗 へ の 来店 以外 に も
、 電話 や メール で 相談 に 乗っ て い まし た が 、 より 気軽 に 相談 し やすい よう に
LINE という 窓口 を 追加 し まし た 。 すべて 無料 で 相談
...

これによってみんなのウェディングという単語を認識してくれました。 これで一応、word2vecに入れる準備が整いました。

word2vecに入れてみる

今回word2vecに入れるためにPythonのライブラリgensimを使おうとしたのですが、文字コードの問題で、うまくいかなかったので、以下の方法で試しました。

$ curl -o word2vec.zip https://storage.googleapis.com/google-code-archive-source/v2/code.google.com/word2vec/source-archive.zip
$ unzip word2vec.zip
$ cd word2vec/trunk
$ make

makeの際にMacだと#include <malloc.h>がなくすでにstdlib.hで定義されているのでその行を削除しておきます。 demo-word.shの中で使っているtext8を先程作ったblog_wakati.txtに変更します。outputも変更します。

time ./word2vec -train ../blog_wakati.txt -output blog_vectors.bin -cbow 1 -size 200 -window 8 -negative 25 -hs 0 -sample 1e-4 -threads 20 -binary 1 -iter 15
./distance blog_vectors.bin

結果

結婚と入力したところギリギなところで夫婦と出てくれました。この記事から来ているのでしょう。

Word: 結婚  Position in vocabulary: 1032
Word       Cosine distance
------------------------------------------------------------------------
捉える           0.968204
結合度           0.796046
低い             0.760592
事象             0.756297
高い             0.749045
できよ            0.734944
持つ              0.720752
オブジェクト指向    0.674030
課題              0.654933
夫婦              0.643763

結婚式だとまた変わって、チャペルとか関連してそうな話題が出てきますね!

Word: 結婚式  Position in vocabulary: 844
Word       Cosine distance
------------------------------------------------------------------------
事業             0.631399
悩み             0.588279
業務委託          0.578773
チャペル          0.577366
楽               0.566613
いただく          0.564815
領域             0.557947
いえ             0.551238
お               0.549162
エンジニアリング   0.549011

思ったよりも関連データが取れた感じがします。(お ってなんだよって感じですが。) 他にもテストと入力すると失敗、落ちる、再など関連してそうな単語がでてきましたが、少し、テキスト量も少ないため、似た単語が出てくる部分は結構残念感があります。 今回は学習させるという部分には全く触れていませんが、詳細に関してはOReillyが出している、word2vecによる自然言語処理に書かれていて、今回はここを参考にさせてもらいました。

コーパスの部分をみんなのウェディングアドベントカレンダーに置き換えたという感じです。 雰囲気から検索してアドカレのブログをサジェスチョンしてもらおうとおもったのですが、そこまで間に合いませんでした。

最後に

2017年のアドベントカレンダーはこれで最後になります。最後まで見ていただきありがとうございました! ぜひ2018年もお楽しみに!&みんなのウェディングをよろしくお願いします!


みんなのウェディングでは、サービス開発や、ユーザーファーストを追求したいエンジニアを募集しています。19卒もエントリースタートしました!興味のある方は、Wantedlyからご連絡ください。または @kazumalab に直接連絡ください!

www.wantedly.com

www.wantedly.com