とあるプロダーツプレイヤーの徒然日記

とあるプロダーツプレイヤーが徒然なるままによしなし事をそこはかとなく書きつくろいます

JavaScriptでデバイス判定する

フロントエンド メモ

概要

どうしてもJavascriptでデバイス判定しないと行けない時って有りますよね。 実際、MSDNとしては非推奨との噂を聞いたことがあるのですが、 どーしてもやりたかったので調べた備忘録として。

端的に

2015年版JavaScriptユーザエージェント判別・判定

この記事に書いてある通り。 素晴らしい。

これを埋め込み

var _ua = (function(u){
  return {
    Tablet:(u.indexOf("windows") != -1 && u.indexOf("touch") != -1 && u.indexOf("tablet pc") == -1) 
      || u.indexOf("ipad") != -1
      || (u.indexOf("android") != -1 && u.indexOf("mobile") == -1)
      || (u.indexOf("firefox") != -1 && u.indexOf("tablet") != -1)
      || u.indexOf("kindle") != -1
      || u.indexOf("silk") != -1
      || u.indexOf("playbook") != -1,
    Mobile:(u.indexOf("windows") != -1 && u.indexOf("phone") != -1)
      || u.indexOf("iphone") != -1
      || u.indexOf("ipod") != -1
      || (u.indexOf("android") != -1 && u.indexOf("mobile") != -1)
      || (u.indexOf("firefox") != -1 && u.indexOf("mobile") != -1)
      || u.indexOf("blackberry") != -1
  }
})(window.navigator.userAgent.toLowerCase());

これで使うだけ。 ね、簡単でしょ？

if(_ua.Mobile){
//この中のコードはスマホにのみ適用
}else if(_ua.Tablet){
//この中のコードはタブレットにのみ適用
}else{
//この中のコードはスマホとタブレット以外に適用
}

Let's Encrypt + Nginxでhttpsアクセスにする！

インフラ

概要

Let's Encryptを使って、友人に作ってあげた塾のWebページをhttpからhttpsアクセスにした話。 このページはNginxを使っているので、そこをhttpsにする設定も記す。

Let's Encryptとは？

Let's Encryptは、独自ドメインとWebサーバがあれば、誰でも簡単に Let's Encrypt の SSL/TLS 証明書を取得することができるオープンソースの取り組み。

SEO的にもhttpsの方が評価が高いらしいので、検索順位を上げたいなら導入する価値がある。（参考：『HTTPSをSEOで優遇』 SSL化を推奨するアルゴリズム導入をGoogleが公式発表）

通常のSSL証明書を導入しようとしたらそこそこ高いので、そこまでセキュアじゃなくてもいいならばこれで充分かと。 もちろん、無料のものと有料のものには差があるので、そこを認識した上で使うこと。 参考：無料SSL/TLS証明書ができないこと

とりあえず、証明書を発行する

Let's Encrypt の使い方に従い、進める。 基本的にはこの通り。 コマンドだけまとめておく。

443ポートの開放と80ポート使っていたらそのプロセスを止めることを忘れずに。

letsencrypt導入

$ git clone https://github.com/letsencrypt/letsencrypt
$ cd letsencrypt/
$ ./letsencrypt-auto --help
$ netstat -na | grep ':80.*LISTEN' # 80ポートを使っているものがないかを探す
$ sudo service nginx stop # あれば止める
$ sudo emacs /etc/sysconfig/iptables #443ポートを開放しないといけないので
$ # /etc/sysconfig/iptablesに下記を追加
$ # -A INPUT -m state --state NEW -m tcp -p tcp --dport 443 -j ACCEPT
$ sudo /etc/init.d/iptables restart # iptableをリスタート
$ ./letsencrypt-auto certonly -a standalone -d 自分のドメイン

※pythonが古いと怒られるので、pythonの入れる 参考：PyenvによるPython3.x環境構築(CentOS, Ubuntu)

nginxの設定

$ sudo emacs /etc/nginx/conf.d/default.conf # nginxのconfをいじる

以下、nginx設定サンプル

upstream unicorn {
  server unix:/tmp/unicorn.sock;
}
# httpをhttpsへリダイレクト
server {
  listen 80;
  server_name www.example.com;
  return 301 https://$host$request_uri;
}

server {
  listen 443 ssl;
  server_name www.example.com;

  # www.example.comの部分は適宜、自分のドメインに置き換える
  ssl_certificate /etc/letsencrypt/live/www.example.com/fullchain.pem;
  # www.example.comの部分は適宜、自分のドメインに置き換える
  ssl_certificate_key /etc/letsencrypt/live/www.example.com/privkey.pem;

  access_log /var/log/nginx/sample/sample_access.log;
  error_log /var/log/nginx/sample/sample_error.log;

  root /var/tmp/sample;

  location @unicorn {
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header Host $http_host;
    proxy_pass http://unicorn;
    proxy_redirect http:// https://;
  }
}

nginxをrestartすれば完了！

$ sudo service nginx restart

スクリーンショット 2016-01-27 16.21.37.png

Let's Encrypt!

GoogleChromeのキャッシュからhtmlファイルを復元する

その他

概要

先日、ブログの新しい記事を書こうとして、古い記事からコピペしようとしたら、 古い記事を上書きしてしまい泣きそうになった時にやったことを書きます。

（ちなみに、復元できませんでした）

手順

1. クロムでurlに'about:cache'と打つ

そうすると、 f:id:yamadagenki:20160125010144p:plain のような、urlがひたすら羅列されたページに行く

2. バイナリデータ部分だけを抜き出す

ボーダーで4段落くらいにわかれていると思うので、一番したの段落の文字列を全部コピーしてくる ※語尾だけちょっと加工する

https://github.com/shengbo-medley/MiscForStudy/tree/master/20160119に書きだした一時ファイルを実行するスクリプトを書いた。 ※data.txtにhtmlに復元したい部分をペーストするとよい。

$ ruby tmp.rb | pbcopy

3. バイナリーデータを変換し、ファイルに保存

Mac OS Xのバイナリエディタ « TORQUES LABSを使って、2.でペーストボードにあるデータをペーストする。

そして、拡張子を.gzでファイル保存する

4. 解凍してChromeで開く

該当ファイルを下記のコマンドで解凍して開く

$ gzip -d **.gz

終わりに

ハテブに編集履歴機能欲しいです(´・ω・｀)

悲しい。

4時間半睡眠三週間目経過レポート

ライフハック

概要

4時間半熟睡法

を買って、実践したみたので、それの三週間目経過レポート

その他

三週間目の過ごし方振り返り

1月18日(月)

  • 1時寝6時半起き
    • この週は月曜日から眠かった
    • 寒すぎてベッドから出れなかった
  • 7時半前出社19時半退社
    • 昼寝(15分)を挟む
  • 退社後ダーツリーグ戦に行く
    • とりあえず、勝つ

1月19日(火)

  • 1時半寝6時
    • この日はすっきり起きれた
  • 7時出社19時過ぎ退社
    • 昼寝(15分)を挟む

1月20日(水)

  • 1時寝6時半起き
    • 結構眠い
  • 7時15分出社21時前退社
    • 昼寝(15分)を挟む
  • 退社後ジム行って5km走る
    • 5km程度では睡眠時間は特にランニングに使う体力に響かない感じ

1月21日(木)

  • 1時寝6時起き
    • からの2度寝の7時半起き
    • からの3度寝の8時半起き
    • 寒い + 会社行きたくない病（特になにか嫌なことがあったわけではない）が発動した
  • 9時半出社19時半前退社
    • 昼寝しなかった
  • 退社後ダーツのリーグ戦に行く
    • とりあえず、なんとか勝つ

1月22日(金)

  • 1時寝7時起き
    • 早起き失敗
    • 6時間寝るとかなりスッキリした
  • 8時45分出社21時半退社
    • 昼寝しなかった
  • 退社後、ジム行って、フラッと一人で飲みに行く

1月23日(土)

  • 1時寝6時起き
    • とても眠いが、ダーツの試合に行く
  • 電車の中で15分くらい寝た気がする
  • 試合の結果はそこそこ
    • 睡眠不足のせいで、お酒が回りやすかったのが勝因かも？

1月24日(日)

  • 12時寝8時起き
    • めっちゃ寝て回復した

三周目総括

  • 三週間目となり、そろそろダレてきた
  • これ、とても暖かくて仮眠の質が上がった
  • 最近、朝めっちゃ寒いのでそれを言い訳に起きれない
  • 平日週5は長い
  • お腹すくのは、だんだん慣れてきた

課題と対策について

  • 三週間目となり、だんだんダレてきた気がする

    • 続ける週間で紹介されている通り、おそらく現在は倦怠期に入っている
    • なにか変化が必要らしいので、変化について考えてみる
      • ダーツには体幹が大事なので、朝起きて100回腹筋することをFacebookに投稿してみる
      • このアプリには、腹筋することを投稿する機能があるので、それ使ってみる Runtastic Sit-Ups- Runtastic

  • 朝、とにかく寒くて起きれない

    • エアコンのタイマーをうまく使って、起きやすい温度にしてやる

以上、来週も頑張る

2016年1stクールドラマ初回感想（今日までに見た分）

ドラマ

概要

プログラム書きながらドラマ見れるタイプの人間なので、家での作業や土日の作業中は基本的に常にドラマ見てます。

とりあえず、今週数本見たのでそれの感想をメモ

ドラマ

ヒガンバナ～警視庁捜査七課～

一度スペシャルドラマだったものが、連続ドラマ化したもの。

ツンツンのキャラの堀北真希もさることながら、個性豊かな警視庁捜査七課のメンバーが面白い。

ダメな私に恋してください

とにかくだめな深田恭子の話。

ドSのディーン・フジオカのツンデレさに女性が釘付けになると予想。

最終的には、深田恭子とディーン・フジオカがくっつくと今後の展開を予想

ナオミとカナコ

広末涼子周辺のドラマにしては、少々重たい雰囲気が感じられた。

木曜日のフジテレビドラマってこんな感じのドラマの枠ですよね。

週もそろそろ終盤っていうことで、若干ホラーが混じってくるんですかね。

ニーチェ先生

  • 主演：だれ？

B級ドラマ過ぎて面白かった。

今後も見続けてしまいそう。

フラジャイル

変わり者の長瀬智也（医者）の毒舌っぷりが面白い。

武井咲もかわいい。病理医という変わった視点から描いた医療系ドラマ。

ドクターハウスっぽいドラマ。

※こういうドラマばっか見てるから、大きい病院って闇いっぱいあるんだろうなって勘違いしてしまうタイプの人間です

まとめ・感想

とりあえず、久しぶりにドラマで深田恭子と広末涼子を見た気がする。

「ダメな私に恋してください」ではいつもどおりの深田恭子のドラマであったが、「ナオミとカナコ」は正直少し暗めのドラマで拍子を取られた。

にしても、ツンツンした堀北真希いいですね。

みんな違ってみんないい。

4時間半睡眠一週間目経過レポート

概要

4時間半熟睡法

を買って、実践したみたので、それの一週間経過レポート

どうやって実践したかは

4時間半熟睡法のススメ - とあるプロダーツプレイヤーの徒然日記

を参照

一週間の過ごし方振り返り

1月5日〜1月8日の過ごし方を軽く書いてみる

1月5日

  • 1時過ぎ寝、6時前起き
  • 7時出社20時退社
  • ジム行って帰ってゴニョゴニョやって寝る
感想

全然平気。わりかしすっきり起きられて、一日を有効活用してる感。

一日が長い。午前中長い。 やたらとお腹すく。

1月6日

  • 1時過ぎ寝、6時前起き
  • 7時前出社20時退社
  • ジム行って、ダーツして12時前に帰って1時ごろ寝る
感想

まだすっきり起きられる。

一日長い、やたらとお腹すく。

1月7日

  • 1時過ぎ寝、6時前起き
  • 7時出社19時半退社
  • 退社後、友人と飲みに行く。（22時以降アルコールはやめる）
感想

そろそろ辛い。度々眠気に襲われる。

寝起きは悪くはない。

相変わらず一日長い、お腹すく

1月8日

  • 1時半寝、6時起き
  • 7時出社
  • 退社後、帰ってゴニョゴニョして1時過ぎ寝る
感想

もう限界。起きるのも昼間も辛い

お腹すく

1月9日（現在）

  • 7時起き（6時間睡眠）
  • とりあえず、二度寝して9時に起きた（7時間半睡眠になった）
感想

すっきり起きられた。 用事があったら二度寝しなくても行けた感じ。

まとめ

  • 4時間半睡眠は、1,2日は大丈夫だが3日目から辛い
  • 4日目からめっちゃ辛い
  • 今週が4日間でよかった
  • 6-7.5時間寝れば回復はできるっぽい
  • 当たり前だが、一日がとても長い
  • 朝、会社に人がいないので作業に集中できる
  • 夜の時間もすごく長い
  • とてもお腹すく

とにかく食料募集中です。 お腹すきました。

gitレポジトリ変更による、Capistranoの変更点

Ruby on Rails その他

概要

gitレポジトリを訳あって変更したので、 それにともなってRailsアプリケーションデプロイする際に起きた問題とそれの解決方法を記す。

※鍵の登録等は済んでいるものとする

簡単な話をすると

簡単な話をすると、要はCapistranoがgitの最新をfetchする際、及び引っ張ってくる際に、 その引っ張ってくる元の向き先を変更する必要があるということ

コード的には

コード的には、基本的にCapistranoの設定で記されている

set :repo_url, 'git@github.com:medley/sample_a.git'

と言う部分を

set :repo_url, 'git@github.com:medley/sample_b.git'

に書き換える。

次にデプロイする各サーバーで

次にデプロイする各サーバーで、それぞれ、 Capistranoで配布する際のディレクトリ以下で

$ ls
current  releases  repo  revisions.log  shared

のようなディレクトリがあると思う。

これにおいて、repoのディレクトリを消せば大丈夫

$ rm -rf repo

これで、capistranoを走らせれば問題なくデプロイされる。

※参照： Ruby - gitリポジトリを変更したらCapistrano3が失敗する時の対応 - Qiita

最後に

睡眠4時間半、3日目にして相当つらい。 とりあえず、明後日起きたら一週間のレポートを書こうと思う。