miyasakura’s diary

日記です。

ElectronでWebサイトにマルチアカウントでログインできるアプリを作った

プログラミング

AWSアカウントを7アカウントほど利用していてChromeのアカウント切り替えが面倒になってきたので、こんな感じのものを作った。

f:id:miyasakura:20161205220543p:plain

Electronを触ったことない状態から4時間くらいである程度動作するところまで。

設定画面はなくてサイトのURLなどはHTMLべた書き。

コードとしては https://github.com/saenzramiro/rambox を参考にしつつ作って https://github.com/miyasakura/multi-acc-electron こんな感じのものになった。動作はMacのみで確認。

感想としてはElectronすごい。Chrome AppがDeprecateとなる今となってはデスクトップアプリ作るにはElectronは良い選択肢。

ということでいくつか実装のポイントをメモ。

タブ切り替えの実装

アプリは一つのHTMLで構成。上部にリンクを配置して下にWebViewを配置。

WebViewはHTML上に全て配置しておき、上部のリンクのクリックでclassを付け替えることでdisplay:noneの切り替えている。

タブごとにセッションを切り替える

ひとつのウインドウがBrowserWindowというものになるようなので、それを切り替えるのかなと思ったら、どうやらWebviewにpartitionというものがありWebViewごとにセッションを持たせられる模様。

https://github.com/miyasakura/multi-acc-electron/blob/master/index.html#L13

接頭辞にpersist:を指定することでアプリを閉じてもセッションを保持。

コピー＆ペーストなどの動作

デフォルトではctrl+cなどが動作しないので編集メニューを定義することで利用できるように。

https://github.com/miyasakura/multi-acc-electron/blob/master/menu.js#L21

タブ単位でのリロード動作

メニューでctrl+rを定義して、メインで実行されるjs側からはDOM操作はできないので下記のような実装にする。

https://github.com/miyasakura/multi-acc-electron/blob/master/menu.js#L16

https://github.com/miyasakura/multi-acc-electron/blob/master/index.html#L37

アプリアイコンを指定する

使い勝手を考えると実は重要なアプリアイコン。

packagerのオプションで --icon=icon.icns を指定するだけではあるものの、 .icsnってなんだよという。

512x512pxのpng画像を用意して、Macのプレビューで開き、「ファイル」→「書き出す」でオプションキーを押しながらフォーマットを選択すると ICNS で保存できた。

課題

最低限の動作はするので今のところはこれで満足しているものの、一日使ってみてローディングの表示が無いのと右クリックでダウンロードが機能しないっぽいのが課題。

しばらく使ってこの辺を解決できたらQiitaにまとめ記事でも書きたい。

Go+Google App Engine を使ったメモ

プログラミング

最近ちょっとしたWebサービスをGo+App Engine+Google Cloud Datastoreで作ったので、はまったことをメモ。

Qiitaにまとめようかと思ったものの、くだらないミスが主で内容としては大したことがないのでチラ裏的にこのブログに。

選んだ理由

この資料の影響が大きい。

「メルカリ アッテ」を支える Google App Engine と Golang - Speaker Deck

App Engineが東京に出てきたのもあり、それなりにこの構成は流行ってくるんじゃないかなーという感じがしているので勉強がてら実装。

苦労した流れ

  • なんかGoはフルスタックなフレームワーク(WAF)を使わないほうがイケてるらしい
  • ミニマムなフレームワークとして Goji (github.com/zenazn/goji ) をチョイスし使ってみる
  • 作ったけどなぜかデプロイがうまくいかない
  • フレームワークを使わずに net/http を使ってみる
  • さすがにルーティングが貧弱なので github.com/julienschmidt/httprouter を使う
  • やはりなぜかデプロイがうまくいかない
  • フレームワークの問題じゃなかったと思い、再度Gojiへ戻る
  • Gojiの最新版が github.com/goji/goji に移ったらしいのでこっちを使ってみる
  • デプロイしてみるとコンパイルエラー
  • Go 1.7前提の部分があって、App Engineは1.6なので使えなかった（過去の例から言って3ヶ月くらいで最新バージョンに追いついているのでそろそろ1.7が出そうではある）
  • 古い方を使うのもあれなので Gin にしてみる
  • やはりなぜかデプロイがうまくいかない
  • aedeploy を使っているのがいけないらしい
  • 読んでいたドキュメントが Flexible Environment 用のものだった
  • goapp deploy にしたら無事デプロイできた解決

反省点

流し読みじゃなくてちゃんとドキュメントを読みましょう。

あとGoもGAEもちゃんと理解していなかったので、Goの問題かGAEの問題か切り分けができずつらかった。

Google App Engine についての感想

DatastoreとFull Text SearchとMemcachedを使ったけど、設定を何もしなくてもそのまま使えるのが良い。AWSだと各サービスのインスタンスを作って設定ファイルに登録して、みたいな流れになるのがGAEでは全く必要無かったことに驚いた。AWSに慣れすぎていて逆に違和感があったものの、これがあるべき姿だと思う。

あとはもう少しWebに情報が転がってると嬉しいと思った。まだこれから流行っていくものだと思うので自分でも少しずつ情報を発信しつつ慣れていきたい。

読んだ：Yコンビネーター シリコンバレー最強のスタートアップ養成スクール

日記

Yコンビネーター シリコンバレー最強のスタートアップ養成スクール

Yコンビネーター シリコンバレー最強のスタートアップ養成スクール

前半だけ読んでしばらく放っておいてしまったので読み直し。

HerokuとかDropboxとかAirBnBとかに投資しているアクセラレータであるYコンビネータについての本。

投資スタンスなど勉強になる部分が多い。自分が事業をやろうとしたときにそれで良いのかどうかを振り返ることができる気がする。

後半はdemo dayを含めた投資家対策についてという感じだったので、資金調達とかやらずに事業をやりたいと思っている自分には比較的どうでも良い内容だったので流し読み。読み物としては面白かった。

総合するとIT系のスタートアップをやろうとするなら必読書かなという感想。

詐欺ECサイトを見つけたので調査

日記

ホッテントリ 【最新】Amazonで買って良かった物をおすすめランキングでまとめて紹介！ - WAROCOM を見てそういえばオフィスチェアを買いたかったと思い出して調べていると、激安で売られているサイトを発見しました。

テンションが上がったのですが、ちょっと怪しい、ということでドメインを見てみると謎の .pw ドメイン。サイト名をググるとメジャーサイトっぽいので安心しようかと思ったもののどう見ても楽天とYahooにしか出店してさそう。あぁ、これが詐欺サイトか、と気づいて購入をやめました。自分でも怪しいと気づくまでに少し時間がかかったのを考えると結構引っかかってる人はいそうです。

ということでサイトがどうやって作られているのか調べつつまとめてみました。

実際のサイトへのリンクは被リンクが増えてサイトの評価が上がっても困るのでつけませんが気になる人は直接Twitterにでも連絡をください。

サイトについて

  • 楽天とかにありそうな家具屋のECサイト
  • 普通に登録・ログインできて購入まで問題なくできる
  • 会社の住所は福島県のそれっぽい住所
  • 会社名は 株式会社○○商事
  • 安い

f:id:miyasakura:20161106223831p:plain

怪しいところ

  • ドメインが .pw
  • 商品が安すぎる
  • 在庫がある表示なのに納期がなぜか5週間
  • 説明にはクレカOKと書いてあるのに銀行振込のみ。しかも振込先の情報を得るには購入後に問い合わせが必要
  • 一部日本語がおかしい

これくらいだと納期を優先しない人だったら引っかかってしまってもおかしくないのでは。振込が購入後なので一旦冷静になる時間がおけるのは多少救いかも。

サイトデザインについて

  • 商品情報は家具の通販サイトからパクる
  • 全体デザイン、フッターなどは別サイトからパクる
    • 家具サイトなのにmetaタグはファッションサイトで、titleタグなどはよく見るとおかしい

発見したパクリ元の両サイトは何度もやられているらしく注意書きが書かれていた。

f:id:miyasakura:20161106224509p:plain

f:id:miyasakura:20161106224515p:plain

誰がやってるのか

一部日本語がおかしくなっているのもあり、おそらく中国人と予想される。

お手数ですが、お振込先はお問い合わせまでにお願いいたします

とかパクリ元サイトに無く自分で加えたと思われる文章は日本語がアレ。

検索もちゃんと動いていることなどから自作したシステムとみられ、詐欺サイトを量産するためのシステムが作られていそう。

とはいえ初心者がphpで頑張って作りました感が強い。

f:id:miyasakura:20161106224640p:plain

対策

自分の親世代がEC好きだったとして、こういうのに引っかからないようにアドバイスするとしたらなかなか難しい。

  • 安すぎるサイトは疑え
  • 少しでも怪しいと思ったら他の人の意見を聞く
  • ウイルス対策ソフトを入れる

とかこんな感じだろうか。ドメイン名が〜とか言っても対策されたらどうしようもないし、そもそもドメインという概念を理解してもらうのはなかなか難しい。最近のウイルス対策ソフトは既知の詐欺サイトなら警告してくれる気はするが、初めて引っかかる人は防げない仕組みなのでそれに頼るのもどうかという気もする。

盗用されているECサイト側としてもどうにかしたいはずだが、とはいえ海外からやられるとどうにもできないのがもどかしい。AWSとかのクラウドを使っていたらEDoSとかそういうので嫌がらせをしたりとかはできるかもしれない。

感想

自分が購入者の立場でサイトを発見しましたが、思ったより簡単に引っかかってしまうかもと感じました。安全なネットというのはもう少し先の未来で、しばらくは自衛が必要そうです。

事業検討ログ

日記

記録として。

 

第0回MTG 8/27

飲み会にてこんなのが欲しいで盛り上がる。前に話した事がある内容に近かったのでお互い納得感あり。

 

第1回 8/29

サイゼリアにて。事業スコープを話しながら決める。課題感を広めに持ち寄って議論し、コアとなる部分がどこなのか認識を合わせた。システム構成についてもちょっと話す。

 

第2回 9/2

コワーキングスペースにて。やることを明確化するため、また初期ユーザ（知人）への売り込みトークとして、エレベーターピッチを作成。今までにないほどすんなりと作れたため事業の正しさに期待が膨らむ。アプリケーション定義ステートメントは定義する必要がないほど単機能なので省略。その後必要な要素や画面を洗い出し、最初に作るものを決めた。ここまで2時間程度。システムの構成要素をざっくり話し、技術的検証部分をリストアップ。次回は技術的課題の検証を行った状態でMTGを実施予定。

 

 

 

 

シリコンバレー式 自分を変える最強の食事 まとめ

日記

昨年に発売されて話題になったこの本。

www.amazon.co.jp

ここに書かれている完全無欠コーヒー（と本書の内容を取り入れた糖質制限と筋トレ）を3ヶ月続けてBMIが20.3→18.3になりました。

改めて読みなおしたのでメモがてらまとめました。

この本について

原題は「The Bulletproof Diet: Lose up to a Pound a Day, Reclaim Energy and Focus, Upgrade Your Life」ということで「シリコンバレー式」というのは日本の編集者がつけたタイトルですね。

食べるものを変えたら痩せるし頭は冴えてくるし最高にハッピーだぜ、というのがこの本の内容。

とにかく「パフォーマンスを上げる」ということに対して、著者が実践と計測を続けた結果がこの本にかかれています。

自身での計測、あるいは論文等に根拠があることがかなり重要視されています。この辺は日本の健康本とは大きな違いでしょうか。

ざっくりまとめ

糖質制限・グルテンフリー

最近話題の糖質制限。ケトーシスと呼ばれる体の状態を作ることで脂肪を燃焼しやすくします。

ただし継続するために極度の糖質制限ではなく、週に一度多めの糖質をとったり、寝る前にはちみつを摂取するなど行き過ぎないように調整されている印象です。過度な糖質制限は色々問題ありますからね。

それに加えてジョコビッチの本でも話題になったグルテンフリーというところも重視しています。

カビ毒がある食品を避ける

カビ毒がある食品は避けるべき、という話で多くのページを割いていますが、いきなり聞くと本当かよ、という印象を受けますが、カビ毒は、下記のように厚労省がリスク管理を行っているものです。 いろいろなかび毒：農林水産省

これを許容摂取量に関わらず避けるべきというのが筆者の主張です。

本の中では水銀が多い魚を避けることも主張していて、許容摂取量はあくまで最大値で基本的には有害な物質は避けるのが良いのでしょう。

タンパク質の摂り過ぎは内臓に負担がかかる

腎臓への負担などがかかるのでタンパク質の摂り過ぎは良くないとのこと。

※ちなみに2015年時点で耐用上限量は設定しないというのが厚生労働省の結論です。 http://www.mhlw.go.jp/file/05-Shingikai-10901000-Kenkoukyoku-Soumuka/0000042630.pdf

良質な油を取る

糖質の摂り過ぎはパフォーマンスの低下、タンパク質も摂り過ぎてはいけないとなると、カロリー摂取の主役は油となります。

そのため、良質な油を取ることが重要になってきます。

中鎖脂肪酸、オメガ３などこの辺りも昨今の健康界隈ではよく言われていることですね。

それに加え、肉もグラスフェッドでなければならないなど。

断続的ファスティング

食事は一番エネルギーを使う行為であり、1日3食は健康的では無い、というのは最近各所で言われています。

それらが正しいかは別として、この本でもファスティング（断食）を取り入れることを主張しています。

具体的には一日の2回の食事の間隔を6時間程度にし、毎日15〜18時間のファスティングを行います。

完全無欠コーヒー

ファスティングが良いとはいえ、朝食を食べないと頭がまわらず、パフォーマンスを上げることとは正反対になってしまいます。

そのために生み出されたのが「完全無欠コーヒー」（良質なコーヒー＋グラスフェッドバター＋MCTオイル）。

糖質、タンパク質を摂取しなければファスティングの効果は続くので、そのため脂肪でカロリーを摂取しようという発想だと思います。

コーヒーはカビ毒が含まれる可能性が高いので「良質な」、牛が穀類を食べていると結局カビ毒に汚染されているので「グラスフェッド（牧草飼育）」、MCTオイルは中鎖脂肪酸によりケトン体の生成を促します。

完全無欠な食事

その他カビ毒やアレルギー反応をできる限り避けた食事をしましょうという内容。

乳製品を避けるなど、できることはありますが、完全に本書の通りにやるにはお金と時間がかなり無いとつらそうです。

運動

「30秒間全力疾走後、90秒間休む」を15分間繰り返す、これを週に1回行えば十分とのことですが、これ自体は非常に理にかなった方法で、Tabata ProtocolやHIIT(High-intensity interval training)などをググってもらえれば十分に根拠のある方法だというのがわかると思います。

睡眠

どれも基本的で寄せ集め感はありますが、カフェインは14時以降は取らない、Sleep Alarmで睡眠の質の計測など誰もがやったほうが良いことがまとめられています。

全体を通して

「完全無欠コーヒー」がキャッチーなためそこばかり注目されていますが、それ以外の部分では基本的には昨今の食事理論やダイエット方法の組み合わせなので信頼性は高いのではないでしょうか。論文などに根拠があるものはそれを引いていて、そうでないものは筆者が自身の体を繰り返し計測することで根拠としています。

痩せるかといえば、完全無欠コーヒーは満足感を得ながら朝食に糖質を取ることは無くなり、更に昼食の量も減るような気がしていて、単純に摂取するカロリーが下がるので痩せる可能性は高いと思います。

完全無欠の食事だけしていればカロリーを気にしなくてもベストな体重に収束していくというのが筆者の主張ではありますが、グラスフェッドの牛肉など完全無欠コーヒー以外の完全な実行は難しく、私はそこまではできませんでした。

IQが20上がるというパフォーマンス向上についても、完全無欠コーヒーだけだと驚くほどの変化はありませんでした。とはいえコーヒーで頭が冴えて午前中から仕事が捗るのは確かで、お腹もすかないので私は完全無欠コーヒーについてはもうしばらく続けてみようと思っています。