ハラミTech

技術系ブログです

フィードバックされたいならお前もフィードバックしろ

ポエム

自分への戒めでもあるエモみが高い記事です。

自分が書いたブログ記事や作ったサービスに対して、全然フィードバックもらえなかったりしますよね。

そしてフラストレーションが溜まっていくわけですね・・・。

  • 「なんで誰もはてブ付けてくれないの！？」
  • 「なんで誰もリツイートしてくれないの！？」
  • 「なんで誰もいいねしてくれないの！？」
    などなど・・・

んでそれが妬み・嫉妬となります。

  • 「自分が作ったモノの方がいいじゃねーか・・・」
  • 「なんでこんなしょうもない記事にこんなはてブついてんだ・・・」
  • 「おれのこんなくだらないツイートをリツイートしないで、サービス宣伝ツイートをリツイートしてくれよぉ・・・！」

さらにそんな自分が嫌になってストレスが溜まります。
まーこんなふうに思うのはしょうがないです。だって人間だもの。

アウトプットしてる人ってたぶん承認欲求が強めな人たちです。
僕もそうだと自覚があります。

そんな人はですね、フィードバックほしいなら自分もフィードバックしていくべきです。

自分は人の書いた記事や作ったサービスに対してなんのフィードバックしてないのに
自分のものだけ認めてもらおうなんてそりゃとんだワガママですよ😥

めちゃくちゃ精神論的なことをいいますが、自分がフィードバックをしていけば必ずそれがなにかしらの形で返ってくると思うんです。

「記事書きました！」ってツイートしてたらそれをリツイートしましょう
その記事がよかったらはてブしてあげましょう
「サービス作りました！」ってツイートしてたらそれをリツイートしましょう
それがよかったらはてブしてあげましょう
Qiitaでいい記事みたら「いいね」をつけましょう
それがよかったらはてブしてあげましょう

はてブはめんどくさいので「広めてあげたい！」と思ったらでいいんですが、
リツイートとかいいねはボタン押すだけなのでできれば意識してやっていきましょう
Twitterに限って言えば「いいね」より「リツイート」のほうが嬉しいはずです。

それが効率化すると互助会みたいにはなるんでしょうけど、そんな閉じたネットワークになるのは嫌なので
色んな人のモノに対してフィードバックしていきましょう。

ただ見返りを求めてフィードバックをするのは違うと思うんです。
他人にフィードバックを求める前に、まず自分がフィードバックをやるクセをつけてほしい。
その姿勢を見てみんなが同じようにフィードバックしあう世界になるといいなーと思うんです。

そうすると自分のモノに対してのフィードバックも増えていくんじゃないかなと思ってます。

「うるせー！おれはフィードバックなんていらねーんだよ！」という人は別にやらなくていいと思います。
それもカッコいいっす！

追記(2018/12/03): 「おれはフィードバックしたんだからお前もしろよ！」は無しです。ゆるめにやりましょ〜

2018年11月振り返り

振り返り

2018年11月の振り返り

仕事

いろいろあり事業が再スタートになったので自分の担当してたAPIやインフラもいい感じにリプレースすることになった。
規模が小さいのでモノリシックなものにしつつ、AWSのFargateで動かそうかなと。
そんで前回に引き続きAPI部分はgRPCにする。もうgRPCがよすぎて離れられそうにない。
そして自分はAPIとインフラ担当に。範囲広すぎんよ！！

副業のほうは現在はdouble jump.tokyoさまでgRPCの基盤構築やインフラ周りのことをやらせてもらってます。

ブログ

実績: 7記事

なんか知らんけどめっちゃ記事書いてるなこいつ。
11月はNyaaanをリリースしたのと副業を始めたのでそのへんの記事が多めかな。

blog.haramishio.xyz

blog.haramishio.xyz

blog.haramishio.xyz

blog.haramishio.xyz

qiita.com

qiita.com

qiita.com

勉強会

登壇

実績: 1件

参加

実績: 2件

読書

実績
読了: 2件 進行中: 1件

その他

NyaaanというWebサービスをリリースした

これが一番のビックイベント。
Twitterでうまくバズった（といっていいのかわからんけど）ので初動はいい感じ。
その後も定着したユーザさんもいるけど、ちょっと伸び悩んでる。今後の施策をどうしようと悩み中

Nyaaanを支える技術

サービス FireBase Netlify アドベントカレンダー

こちらはCrieitの個人開発サービスに用いられている技術 Advent Calendar 2018の2日目の記事です。
前日はなべさんの日本語のフリーフォントを一度に試せる「ためしがき」に用いられている技術についてでした！

11/5にNyaaanというWebサービスをリリースしました。

nyaaan.haramishio.xyz

そこで

  • どのような技術を使ってるのか
  • どういう知見が得られたのか

を書いていこうと思います！

どういうサービスかは以下の記事を読んでいただけたらと思います！

blog.haramishio.xyz

使用している技術

ざっくりな構成でいうと

です。

Nuxt.js

Nuxt.jsはVue.jsアプリケーションを作るためのフレームワークです。
ちょっと大きめのVue.jsアプリを作る際に必要なVuexやVue Routerなどが入ってるのでNuxtをインストールすればすぐにWebアプリが作れます。
今回はSSR（サーバーサイドレンダリング）を行わないため、SPAモードで利用しています。

Netlify

Webホスティングはさまざまな種類がありますが、今回はNetlifyを選択しました。
選択した理由としては・・・

  • ビルドを勝手にやってくれる（npm run build がビルドコマンドよ！ってNetlifyに登録しとくだけでいい)
  • ビルドしたらデプロイもやってくれる
  • 他のホスティングサービスと比較して無料枠の制限が少ない

Firebase

APIやDBが必要になったのですが、すべてFirebaseで行いました。
主要なFirebaseサービスはHostingとML Kit以外使いました。

それぞれの用途としては・・・

  • Authentication
  • Firestore
    • ユーザ投稿データやユーザデータを保存
  • Functions
    • Twitter APIに問い合わせる処理やユーザ削除機能で利用
  • Storage
    • ユーザのアイコンの保存で利用

得られた知見

Firestoreのクエリーのクセ

FirestoreはNoSQLです。RDBのような柔軟なクエリーを書くことは出来ません。
その制限にひっかかってちょっと苦しんだ事例があるので共有します。

Nyaaanでは「有効期限」という機能があり
これを設定すると1時間または1日経つと、鳴き声（つぶやきみたいなもの）が見れなくなるというものです。

その鳴き声テーブルはこんな感じになってます（本当はもっとカラムあります）

カラム 型
ID string
鳴き声 string
本音 string
有効期限 timestamp
作成時間 timestamp

Nyaaanにはタイムラインがあり、鳴き声は作成時間の降順でソートしたいです。
なので・・・

// カラム名はわかりやすく日本語にしてます
mewRef.where("有効期限", ">", now).orderBy("作成時間", "desc").limit(10).get()

としたかったのですがこれはNG。
範囲フィルタ(>や>=)を使う場合は、orderByの最初の要素はその範囲フィルタで使用したカラムしか指定できません。
Cloud Firestore でのデータの並べ替えと制限

RDBならこういうのは普通にできますが、NoSQLはこういう制限があるのかと勉強になりました。

結局どうしたかというと、後述するバッチ的なもので有効期限をチェックして削除してます。

FirebaseでCron的なことをしたいとき

上述したバッチ的なものの話です。

サービスを作っていくとバッチが必要になる場面があるとおもいます。
なにかしらの処理を定期的に動かすとなるとCronを使ったりJenkinsを使ったり色々あると思います。
これらはサーバーが必要になりますよね。
すでに持ってる人はそれを使えば良いんですが、僕はお金をかけたくないのでどうにかしてサーバーレスにしたいです。

さて、FirebaseのFunctionsはHTTPSフックで起動することが出来ます。
つまりcronでcurlを定期実行すればバッチみたいなことができるわけです！

そして世の中には外形監視のために定期的に指定したURLを叩いてくれるサービスがあります。
cron-job.orgやUptime Robotがそれです。

これを利用してFunctionsを定期的にトリガーするようにしてバッチ処理をサーバーレスで実現しました。

懸念点として、Functionsの実行を外部からできるようにしてしまっているのでセキュリティ的に問題ないのか？という点ですが
今回の場合はリクエスト時にGETパラメーターでアクセストークンを渡しており、そのアクセストークンじゃないとアクセス拒否するようにコーディングしています。
それでも攻撃されて突破されるリスクもなくはないので、センシティブなことをしたい場合はやめたほうがいいと思います。

Functionsの様々なトリガー

Fucntionsのトリガーは色々あります。

トリガー 内容
HTTPS URLを叩くだけ
onCall クライアントから直接呼び出し
Authentication ユーザの登録/削除で呼び出し
Firestore ドキュメントの登録/更新/削除で呼び出し
Storage オブジェクトの登録/更新/削除で呼び出し
Pub/Sub Cloud Pub/SubのPublishで呼び出し

NyaaanではHTTPSとAuthenticationのトリガーを使用してます。
特にAuthenticationトリガーは便利で、以下のようにFunctionsに書くだけで簡単に書くことが出来ます。

// ユーザが削除されたら実行されるFunction
exports.removeUser = functions.region('asia-northeast1').auth.user().onDelete(function(user, context) {
~~~
});

Nyaaanではユーザ削除されると今までの鳴き声が消えるようになってます。
クライアントでそこまでやると重いので、クライアントではAuthenticationのユーザだけ削除してレスポンスをすぐ返し、
FunctionsのAuthenticationトリガーで非同期で削除処理を走らせてます。

Netlifyのリダイレクト設定

Nuxt.jsのSPAモードを使用していて、Netlifyでホスティングしていたのですが
ルートパス以外を直接呼び出すと404エラーになってしまいます。(例: https://nyaaan.haramishio.xyz/top)

SPAではルートパス以外でアクセスされたらindex.htmlへリダイレクト処理をする必要があります。

Netlifyはリダイレクトの機能があり、デプロイするディレクトリのトップに _redirects を配置しそこにリダイレクト設定を記述するとリダイレクトしてくれます。

/*    /index.html   200

この話をもうちょいちゃんと説明したのがこちらの記事になります。
Netlifyを使ってたらルートパス以外が404になった話とその解決方法

最後に

ということでNyaaanの使用技術とそこから得た知見を書きました！
この記事でみなさんの開発のヒントになれれば幸いです！

さて、明日はこのアドベントカレンダーが開催されているCrieitの運営者のだらさんです！

f:id:mori_morix:20181105140602p:plain

Twitter実況しやすくなるChrome拡張機能を作った！

Chrome Extension ツール

Twitterで実況をするときにハッシュタグをつけると思うのですが
TweetDeckを使っているとハッシュタグを毎回入力しないといけないです。

それが大変だったので、自動でハッシュタグを入れてくれるChrome拡張機能を作りました！

使い方

使い方は簡単です。

まず以下からインストールします。

chrome.google.com

インストールすると、右上にアイコンが表示されるので、押すとハッシュタグ入力画面が表示されます。

f:id:mori_morix:20181130215248p:plain

ここに挿入したいハッシュタグを入力します。
「＋」ボタンを押すと何個でも設定できます。

Saveボタンを押すと反映されて（ページ再読込の必要があります）
あとは自動で挿入されます。

バグや要望などあれば下記からお願いします！！
https://goo.gl/forms/eC1HXeY5kzcXUU8J2

注意

この拡張機能はTweetDeckのみに対応してます。
通常のTwitterサイトでは使えません。

f:id:mori_morix:20181130215918p:plain

個人開発を行なう際の自分なりの指針について書く

サービス ポエム

運営者ギルドという個人サービスを運営している人たちが集まるSlackチームがあるのですが、
そこで あんどさんがサービスをどういう指針で作っていくかを喋っていて、自分もそれに共感したので
今回は「自分なりの個人開発の指針」について書いていこうと思います！

大体モチベーションに関連している話でそのへんは運営者ギルドの仲間のなべさんがとてもいい記事を書いてるのでぜひ読んでください！

blog.nabettu.com

指針

自分にとって必要なものか

まず自分が一番大事だと思っていることがあります。
それは「自分にとって必要なものかどうか」です。

個人でサービスやアプリを開発するためには、開発するモチベーションを維持していく必要があります。
これが仕事なら報酬ももらえるので頑張ってやれるんですが、あくまで趣味です。
なのでこのモチベーションを維持するという行為がものすご〜く難しい！

逆に言うとモチベーションを維持することが出来る精神力があれば、技術がなくたってサービスは作れます。
それだけの精神力があれば勝手に技術がついてくるからです。

そのモチベの維持の方法として大事だと思うのが自分にとって必要なものなのです。

例えば、食べたラーメンのカロリーを記録するアプリを作るとします。
たくさんのラーメン屋があるので、どうやら大衆にはラーメンは人気みたいです。
なので「ラーメンアプリを作れば需要があるのでは？」と考えます。
ただし自分はそんなにラーメンが好きではないとします。

そんな状況でラーメンアプリを個人で作っていくのは、よほどの意思がないと大変ではないかと思うのです。
自分に需要がなければ、どういう需要があるのかを考えるのも大変ですし、なによりつまらないと感じます。
少なくとも自分は、他者の需要だけで個人開発を続けていくことは難しいです。

また完成しても次には運用が待ってます。

  • ユーザーの声に答え続けることができるのか？
  • ターゲットを間違えていて誰も利用しなくなるんじゃないか？

果たして自分がそれをやっていけるのかというと「No」なのです。
だから「自分が必要なもの」を第1の指針としてあげてます！

人を幸せにできるか（人を傷つけないか）

僕は自分のサービスで他者を幸せにしたいです。
「幸せとは」みたいな話はめんどくさいのでしたくないんですが、簡単に言うと「感謝されたい」です。
感謝する感情 = 幸せ　なんじゃないかな〜と思ってます。

なのでどうやったらみんなに喜んでもらえるかな〜を考えて作ってます。
裏を返すと「人を傷つけないか」も指針になっています。

また例を挙げると、エロや暴力に繋がりそうなものは作らないようにしてます。
いや個人的にはエロサイトを作ってみたいという思いはあるものの、それによって傷つく人もいっぱいいるので作れないです。

Nyaaanは、愚痴などの吐き出し先として使われているようでマシュマロを通じてさまざまな感謝をいただいており、ものすご〜〜くうれしいんです！！

新しい技術に挑戦する

新しいサービスを作る際は必ず使ったことのない技術を使うようにしてます。

まぁいつかはネタ切れしそうな指針ではありますが、個人開発は勉強の一環でもあるのでこの指針も大事にしてます。

今までの成功と失敗

まだ個人開発始めて半年くらいしかないのでそんなにサービス作ってないんですけど、それでも成功と失敗はあります。
この指針に則ってやれたやつとやれてないやつです。

成功

ゴミ出し通知くんは、僕が嫁に怒られないように作ったWebアプリです。

speakerdeck.com

これは完全に自分の需要にマッチしたサービスでした。今でも利用してます。
ただ成功といっても利用してるのは僕だけですが、作ってよかったな〜と思ってます。

失敗

ボッチサーチは、勉強会の懇親会でボッチにならないために作ったWebサービスです。

bocchi-search.com

これを作ってる当時から自分はあまりボッチにならなくなっていましたので正直「これ作っても使わないかも…」と思いながら作ってました。
実際サービスリリース直後以外使ってないです。。。

自分に需要がないので宣伝したり改修したりするのもめんどくさくて全然やれてないです。
ということで今ではほぼ利用者はいません。たまに使ってくださる方には感謝しかないっす・・・！！

最後に

個人開発を行なう指針を言語化してみました。
この指針に則らないとと自分はやっていけないので、サービスを作る際はこの記事を見直そうと思います・・・！

あと指針ってわけじゃないですが、自分のサービスを愛せるとモチベ維持できて良いなーと思ってます。
Nyaaanが好きすぎてつらい・・・

nyaaan.haramishio.xyz

2018年10月振り返り

振り返り

2018年10月の振り返り

仕事

僕が所属している会社は、とある商社の事業会社です。
その商社は昔からある会社で、中にシステムがあるけどかなり古いし問題もあったりして
なぜかリプレース案件に携わることになってしまったので、AWSで基盤構築とかやってました。

あと本業のほうでも色々システムを見直すことになり、GCPからAWSにインフラを切り替えることになったので
そのへんの作業してました。

副業はFirebaseのハンズオンを他社で講師としてやってきました。くらいです。

ブログ

実績: 1記事

10月はあんまり書かなかったな。
自分の思想とかはアウトプットすると、面接の時とか便利だから書いとくといいと思って書いた！

blog.haramishio.xyz

勉強会

登壇

【オフライン】

実績: 0件

【オンライン】

実績: 0件

参加

【オフライン】

実績: 0件

【オンライン】

実績: 0件

読書

実績
読了: 2件 進行中: 2件

マネジメント系の本を引き続き色々読んでいたのとUnityの本を読み始めた。

その他

なし！

「Nyaaan」というサービスをリリースしたのでポエム書く

サービス ポエム

@ampersand_xyzさんがポエム書いていたので僕もポエム書きます。

https://qrunch.io/entries/rFbfdGpEEcTmXzE1/4kYBhpAF812YRZRZ

オチはないよ！！

リリースしたのは今日の11/5(月) 7:30。
前日にはサービスは完成してたけど、Twitterの拡散を狙って月曜の朝にしたんだ。

なんだかんだ色々サービスやらOSSを作ったことはあるけど
広いユーザ層をカバーするサービスは作ったことなかった。
自分の中でも「これはいいサービスだな」と思えてたこともあって、なんだかリリース前は緊張した。

そして11/5 7:30くらいにツイート発射！

あとは神のみぞ知る…
そう思い身支度をして出社した。

電車の中ではいつもどおりアニメを見て過ごした。バズってるといいなと祈りつつ…

会社についてTwitterを見てると、100弱くらいリツイートがついていた。
みんなありがとうな…

Nyaaanからつぶやくと「#Nyaaan」というハッシュタグがつく。
俺のエゴサ用につけてたタグなんだけど、そのハッシュタグ検索がまったく効かない。
「え、なんで！！？使ってくれたかどうかわからないじゃん！！！！」
その後もいくら待っても検索結果には反映されず、Twitterからだと反応がわかりづらくなってしまった…
マジTwitterさんマジなんなん？勘弁してくださいよ？おれはエゴサしたいんだよおおおおおおおおおおおおお！

同じWebサービスの運営者が集まるグループで聞いてみたところ「TwitterのAPI投稿があやしくね？」とのこと。
NyaaanのネコさんたちがつぶやくとTwitter APIに対してPOSTリクエストを投げTwitterに自動投稿されるという機能があった。
結構なネコさん（Nyaaanの利用ユーザさんのこと）が利用してくれてたので、APIリクエスト数が結構な数に…
「このままだともしかしたらアカウント凍結されるかも？」えー！？

急いで会社のPCに開発環境セットアップしてTwitterシェアボタンからシェアしてもらうように変更した。クソ焦った。
みんな、外部APIのヘビーユースは気をつけてな…！
（もうNyaaanには自動投稿機能はないよ！）

その後もみんなリツイートとかしてくれて順調に流入が増えていった。本当にあざっす…！！
マシュマロさんから特大の援護が入ったのがまたありがてぇ…！

それにしても仕事に手がつかない。
ネコさんがマシュマロ経由で要望くださったり、OGP画像が表示されなくてバグ修正したり、エゴサがんばったり…
成果主義の現場でよかったですわい。感謝！

なんだかNyaaanのネコさん達はすごくお行儀がいい。変な荒らしっぽいのはまだいない。ありがてぇ…！優しい世界だ。
あとデザインかわいいって言ってくれるの死ぬほどうれしい。かわいいと思われたくてデザインがんばったんだ…！
俺には美的センスがまるでないので、とにかく「ネコゴリ押し」で行った。
ネコかわいすぎるんだよなぁ。ネコに囲まれて死にたい。

それにしてもTwitterでエゴサできないのがつらい。なんとかしてくれ、なにが悪いのか教えてくれTwitterさんよぉ…！！！

結果的に結構リツイートやらで拡散されていい具合にバズったと思う。
これはゴールじゃない、ようやくスタートラインに立てたのだ。
もしかしたら一過性のものでどんどん利用されなくなってしまうかもしれない。
広がりがそこまで期待できないサービスではあるので、ネコさんたちにどれだけ居心地よい環境にできるのかが勝負なのかもしれない。

ここから先は技術の勉強だけでは得られない体験や学びがあるだろう。それが楽しみで仕方がない。