タグ

ブックマーク / r7kamura.hatenablog.com (39)

  • 石川県の和倉温泉に合宿に行った - ✘╹◡╹✘

    温泉地での開発合宿、通称シバ温泉ソンを敢行した。 予習 和倉温泉のある能登半島はアニメ『花咲くいろは』の舞台となった場所と聞いていたので、前日にTSUTAYAに入会してDVDを全巻借りて観ておいた。 京都駅から和倉温泉駅 サンダーバードに乗って終点まで行くと和倉温泉駅に着きます。最近だと新幹線で金沢まで行けるので、東京からも早い。意外と混んでいるので、デッキで立つ羽目になりたくなければ指定席を取っておいたほうが良い。ネットでJ-WEST会員になって早めに予約しておくと1000円ぐらい安くなります。 和倉温泉駅周辺 駅から温泉街までの数kmはこういう感じで、半島の海沿いにホテルが立ち並んでいる以外は、なんというかこう、土地が余っている。道の脇にいきなり70度の湯が湧き出ていたりする。 鳥 温泉卵を大量に抱えたわくたま君という恐ろしいキャラが居る。公園の奥に行くと海が見える足湯がある。 温泉

    石川県の和倉温泉に合宿に行った - ✘╹◡╹✘
  • amakanをDocker化した感想 - ✘╹◡╹✘

    https://amakan.net/ のこの辺の改善の続き。 amakanをUnicornからPumaに移行した - ✘╹◡╹✘ amakanでyarnを使うようにした - ✘╹◡╹✘ amakanでRuby 2.3.3を使うようにした - ✘╹◡╹✘ amakanを Ruby 2.3.3 から 2.4.0-preview3 に移行した - ✘╹◡╹✘ amakanのフロントエンドを色々改善した - ✘╹◡╹✘ amakanをSidekiqに移行した - ✘╹◡╹✘ amakanの開発環境をDockerに移行した - ✘╹◡╹✘ amakanの番環境をDockerに移行した - ✘╹◡╹✘ CIのビルドに時間が掛かるようになった これはわりとしんどい。CircleCIDockerのバージョンが古く、イメージのキャッシュをしづらいため、毎度新規にイメージをビルドしていることが原因。キャ

    amakanをDocker化した感想 - ✘╹◡╹✘
  • amakanの本番環境をDockerに移行した - ✘╹◡╹✘

    https://amakan.net/ のこの辺の改善の続き。 amakanをUnicornからPumaに移行した - ✘╹◡╹✘ amakanでyarnを使うようにした - ✘╹◡╹✘ amakanでRuby 2.3.3を使うようにした - ✘╹◡╹✘ amakanを Ruby 2.3.3 から 2.4.0-preview3 に移行した - ✘╹◡╹✘ amakanのフロントエンドを色々改善した - ✘╹◡╹✘ amakanをSidekiqに移行した - ✘╹◡╹✘ amakanの開発環境をDockerに移行した - ✘╹◡╹✘ 番環境で使うDockerイメージ これまで開発環境でのみDockerを動かしていたが、番環境でDockerを動かすには、番環境で利用できるようなDockerイメージを用意する必要がある。そこでamakanでは、こういう方法を取った。 開発環境と番環境で同

    amakanの本番環境をDockerに移行した - ✘╹◡╹✘
  • amakanの開発環境をDockerに移行した - ✘╹◡╹✘

    https://amakan.net/ のこの辺の改善の続き。 amakanをUnicornからPumaに移行した - ✘╹◡╹✘ amakanでyarnを使うようにした - ✘╹◡╹✘ amakanでRuby 2.3.3を使うようにした - ✘╹◡╹✘ amakanを Ruby 2.3.3 から 2.4.0-preview3 に移行した - ✘╹◡╹✘ amakanのフロントエンドを色々改善した - ✘╹◡╹✘ amakanをSidekiqに移行した - ✘╹◡╹✘ 環境構築 docker が動く環境なら、git clone して bin/setup を叩けば開発が始められる。 $ cat bin/setup #!/bin/bash set -ex docker-compose up -d docker-compose run --rm node yarn install docker-

    amakanの開発環境をDockerに移行した - ✘╹◡╹✘
  • amakanのフロントエンドを色々改善した - ✘╹◡╹✘

    https://amakan.net/ のこの辺の改善の続き。 amakanをUnicornからPumaに移行した - ✘╹◡╹✘ amakanでyarnを使うようにした - ✘╹◡╹✘ amakanでRuby 2.3.3を使うようにした - ✘╹◡╹✘ amakanを Ruby 2.3.3 から 2.4.0-preview3 に移行した - ✘╹◡╹✘ react_on_rails amakan ではサーバサイドで React.js で記述したコードを使ってHTMLを生成していて、このために react_on_rails というライブラリを使っている。このライブラリの最新バージョンが v5 から v6 に上がっていたので、まず v6 を使うように変更を加えた。 v5 までは、サーバサイドとクライアントサイドで別々の Webpack の設定ファイルを用意するような設計になっていたが。しかし

    amakanのフロントエンドを色々改善した - ✘╹◡╹✘
  • amakanをUnicornからPumaに移行した - ✘╹◡╹✘

    移行したぞ、というだけで特に技術的な知見の無い記事です。 移行の背景 https://amakan.net/ という、レビューの無いシンプルな読書管理サービスを2016年7月から運営している。 5ヶ月ほど運用している中で、利用してくれている人達に色々な意見をもらうことができて、これに対応して年末に時間を取って大きく改善しようとしている。しかし「年末に時間を取ってやろうとしていて...」という発言は明らかに危険信号で、高確率で「結局やれなかったよHAHAHA」ということになるのが目に見えている。そこで、年末に向けて小さな改善を徐々に積み重ねていくことで、モチベーションを高めつつ、新たに変更を加えることへの心理的障壁を無くそうと目論んでいる。今回はその一環として、amakanを動かすWebサーバをUnicornからPumaに変更することで、改善を図ることにした。 amakanの事情 amaka

    amakanをUnicornからPumaに移行した - ✘╹◡╹✘
  • amakanでyarnを使うようにした - ✘╹◡╹✘

    amakanをUnicornからPumaに移行した - ✘╹◡╹✘ に引き続き、小さい改善を加えた。 変更の概要 https://amakan.net/ への今後の変更に備えて、テストやデプロイに掛かる時間を短くする恩恵が良いだろうと思い、node_modulesの管理に使うツールとしてyarnを使うことにした。結果的に、テスト用ビルドの所要時間が130秒から70秒に、デプロイ用ビルドの所要時間が300秒から200秒になった。 CircleCIの設定変更 継続的なテストとデプロイ作業の実行のために、amakanではCircle CIを利用している。Circle CIを使っている理由は、仕事でも使っている上にPrivateでも無料だから。 yarnを利用するためにCircle CIに追加する必要があった設定は、以下の通り。 指定したバージョンのyarnが入っていない場合はインストールする グ

    amakanでyarnを使うようにした - ✘╹◡╹✘
  • Podcastのやっていきかた - ✘╹◡╹✘

    9mとsoramugiから、やっていきエフエム という名前でPodcastをやりませんかという話を承け、Podcastをやることになった。既にサイトが公開されていて、https://yatteiki.fm からアクセスできる。昨日できたばかりで準備中なところが幾つかあるが、サイトを開いて音を聴けるという点では最低限の体験は保証されている。 10月25日にSlackチームを立ち上げ 10月28日に練習でSkypeで通話 10月29日に1回目を収録 10月30日に公開用のサイトを作成 という流れで、発足から企画、収録、公開まで進み、この順調さには当の我々ですら驚かされた。 個人的には、雑談レベルの会話が淡々と展開されていくような、例えばカンファレンスの懇親会での会話を隣で聴いているような、あるいは飯屋での雑談を隣で聴いているような、更に言えばマックで隣の女子高生のガールズトークを聴いているよう

    Podcastのやっていきかた - ✘╹◡╹✘
  • Ruby on Rails on React on SSR on SPA - ✘╹◡╹✘

    amakan での設計を例に、RailsでSingle-Page Applicationをつくるときの自分のやり方をまとめてみます。 GemJavaScriptで書かれたReactのコンポーネントからHTMLを生成する」というのをRubyでやるために、RubyのV8エンジン実装であるmini_racerというGemを使う。この処理を楽に実行するために、react_on_railsというGemも使う。 gem "mini_racer" gem "react_on_rails" View body要素内のHTMLは全てReactで生成するので、layout以外にviewのテンプレートは存在しない。 Controller 初回リクエストの場合はHTMLを返す ページ遷移時に呼ばれるリクエストの場合はJSONを返す 外部サイトからブラウザバックで戻ってきたときにJSONを見せない という要求に

    Ruby on Rails on React on SSR on SPA - ✘╹◡╹✘
  • ソフトバンクからIIJmioに乗り換えた - ✘╹◡╹✘

    iPhone 7を購入するついでにSIMフリー版を選択し、ついでにソフトバンク回線を解約してIIJmioを契約した。 ソフトバンク利用状況 2009年にiPhone 3GSが発売された頃から、iPhone経由でソフトバンクの回線をずっと利用していた。最近の平均的な月額利用料金は8,200円ぐらい。毎月の通信量は3GB強。以下は8月の利用料金の内訳。まあ高い。 通話料 140円 基料 (ホワイトプラン) 934円 パケットし放題フラット for 4G LTE 5,700円 PCダイレクト 1,000円 S!メール (MMS) 100円 S!ベーシックパック 300円 テザリングオプション 500円 IIJ mio IIJ mioにしたのは、周りの信頼できる人間が利用していたからという感じです。SIM1枚でdocomo回線で月3GBの通信量のプランを選んだので、月額利用料金は税抜きで1,60

    ソフトバンクからIIJmioに乗り換えた - ✘╹◡╹✘
  • amakanでKindle Unlimitedの上位100件を集めた - ✘╹◡╹✘

    近年、Kindle Unlimited の日上陸により、我々の進捗はますますダメになっている。理想状態において、無限に漫画を読み続けることができれば、人は進捗を完全に停止させることができる。しかしこの仮定は、如何にして読みたい作品を発見するかという問題に我々を導く。 Kindle Unlimitedで作品を探す方法として、masawadaの日記 では「刊行数が少ない出版社順にタブを開く」「星4以上の書籍に限定する」「あとはがんばって全部みる」という手法が紹介されている。id:masawada はこの課題について新たな試みを行ったが、多くの人間はがんばる気概を持ち合わせていない。 先月から開発を始めた amakan.net では、それぞれの作品ごとに、漫画やラノベのシリーズ判定、Kindle Unlimited対応判定、読みたい・読んだの管理を行っている。そこで、このデータを利用して「

    amakanでKindle Unlimitedの上位100件を集めた - ✘╹◡╹✘
  • 43型4Kディスプレイ注文したので決め手を書いとく - ✘╹◡╹✘

    おおよそ間違いが幾つか含まれてそうな知見 HDMI 2.0 か Display Port で出力するとほぼ最高の状態で出力できる HDMI 2.0 で出力できるマシンは今のところ少ない (例えば最近のMacbook ProでもHDMI 1.4) Macbook Proでは代わりにDisplay Port経由で出力すると良い 4つの入力を受け取って1画面に4分割する機能を備えたディスプレイもある (PBP4in1というらしい) IPS液晶とVA液晶では基的にはIPSのほうが視野角が優秀だが最近はそこまで顕著に違いはない 40型前後の4Kディスプレイは5万円から9万円ぐらいのものが多い TV寄り製品かPC寄り製品かでリモコンの有無や自動電源オフなどの使い勝手が異なる 注文したもの はい / 次の商品を購入しました:Philips(フィリップス) 『Philips 43型ワイド液晶ディスプレイ

    43型4Kディスプレイ注文したので決め手を書いとく - ✘╹◡╹✘
  • 近況 - ✘╹◡╹✘

    近況報告です。 WikiHub 今年の2月につくりはじめた https://wikihub.io/ の開発がまだ順調に続いている。全ての変更を CHANGELOG - WikiHub Help に書くようにしているので、最近WikiHubの開発の様子が見たければこれを見るのが早い。数日に1つ新機能を追加しながら、1つ不具合を潰すぐらいの速度で元気。 https://wikihub.io/@r7kamura を見るとわかるけど、利用者としてもほぼ毎日何らかの記事を書いている状態。最近 https://nippo.wikihub.io/ という日報を書くためのコミュニティが少しずつ流行ってきている。公開された場で書くとわりとちゃんとしようという気持ちが湧くのでオススメ。良かったら皆さん日報書きましょう。誰でも書けます。日人には日記より日報。 あとは https://gaming.wikihu

    近況 - ✘╹◡╹✘
  • WikiHubの開発意外と続いてる - ✘╹◡╹✘

    前回の記事 あのWikiHubが天下Wiki武道会に参戦 - ✘╹◡╹✘ で触れたけど、先月から WikiHub というWikiをつくっていて、趣味程度ではじめたものの結構な勢いで開発が続いてる。 最近の変更点 ここ最近の新機能として、 SSL対応 GitHubアカウントでのログイン エクスポート機能 ページテンプレート機能 Markdownでチェックボックスつけられるやつ HipChat・Slack連携 Webhook 二段階認証 などを実装してみたりしていた。CHANGELOG - WikiHub Help に変更点を書いていってあるので、ここ見るともっと詳しい様子が分かって便利。今日これやったぞーっていうのまとめて公開しておくとがんばった感が出るので、WebサービスとかでもCHANGELOGを書いて公開していくのは良い取り組みだと思いました。よく考えたらやってない感も出るので諸刃の剣

    WikiHubの開発意外と続いてる - ✘╹◡╹✘
  • 京都に引っ越した - ✘╹◡╹✘

    こんにちは、卓球ハウスアドベントカレンダー14日目です。前に住んでいた卓球ハウスというシェアハウスが12月で解散するので、先日シュッと京都に引っ越してきました。 シェアハウスは2013年の6月からやっていたので、2年半ぐらい住んでいたことになる。1月ぐらいに2人に声をかけて、そのあと3月ぐらいから住居を探してたので、準備云々を含めると大体3年ぐらい色々やっていた。人や家を探していたときの記憶が色濃く残っていて、振り返るとすぐそこにありそうなくらいつい最近のことのように思える。 3年というと、この辺りではちょうど人材の流れるスピードと同じぐらいで、実際入居してから職場が変わった人のほうが多いくらい。通勤環境が変わったり、身辺に大きな変化があったり、周辺環境に慣れてしまったり、また新しい変化への期待が込み上げてきたりということで、集まったときと同じくらいのノリで、まあ解散してみますかということ

    京都に引っ越した - ✘╹◡╹✘
  • エディタの実装をcycle.jsでMVIベースにしてみた話 - ✘╹◡╹✘

    最近Electronでエディタをつくっており、最初はReact.jsを使いながらゆるいFlux風の設計でつくっていたのを、cycle.jsを使いながら一部をMVI風の設計に置き換えてみた。400行程度の一画面のコードだったので3時間ぐらいで置き換えられて、前よりも責務が適切に分割されるようになったので、体部分も次の機能追加時に置き換えようと思っている。 とりあえずプレビュー画面だけ置き換えた 置き換えたのは、編集中のファイルを別画面でプレビューとして表示する画面で、ただプレビューするだけの機能のほかに連続したスライドとして表示するプレゼンテーション機能もある。1つ前のブログ記事を見てもらうとわかりやすいと思うけれど、次の画像のようなやつ。ボタンをクリックしてモードを切り替えたりキーボードを使って移動したり、またエディタ側でファイルの内容が書き換わったりと、それっぽく言えば幾らか動きのある

    エディタの実装をcycle.jsでMVIベースにしてみた話 - ✘╹◡╹✘
  • Qiitaのトップページのフィードの設計 - ✘╹◡╹✘

    @ainame user.articles.preload(:comments, :stocks_count) みたいにstocks_countのようなassociationを生やしており、stocks_countの内部実装はPreloaderが弄られていてIDだけ取ってる— 内製フレームワーク (@r7kamura) 2015, 8月 23 @ainame これを抽象化するために、Article.has_many(:stocks, counter: true) みたいにすると、article.stocksとarticle.stocks_countがほぼ同じSQLで同時に定義されるようになってる— 内製フレームワーク (@r7kamura) 2015, 8月 23 @ainame それを実現している実装がこれです / k0kubun/activerecord-precount https:

    Qiitaのトップページのフィードの設計 - ✘╹◡╹✘
  • UIコンポーネント集 Qiita:Coat - ✘╹◡╹✘

    LTを聞いているという感覚でご覧ください。 Qiita:Coat Qiita用のUIコンポーネント集 GitHub用のUIコンポーネント集をForkしてつくりはじめた レポジトリ: https://github.com/increments/qiita-coat デモサイト: http://increments.github.io/qiita-coat/ 今週月曜からやってる これはcommit数 Qiita:Coatが必要に感じた背景 全ての開発者に共通する願い 高速に開発したい 秩序がほしい (a.k.a. 最低限度の品質の保証) 開発体制の情勢に起因する理由 開発人数が徐々に増えつつある 社員11人+アルバイト3人 四半期に1人ぐらい増えてる 50人が51人になるとかならともかく、5人が6人とかになると大きく変わる その他の理由 サポートサイトや採用サイトなどQiita風のデザインを

    UIコンポーネント集 Qiita:Coat - ✘╹◡╹✘
  • 最近のAPI活動 - ✘╹◡╹✘

    進捗 2015-07-27 API Gateway用にRubyでSwagger触るやつ書いた 2015-07-30 Node.jsの練習にHTTPクライアントつくった 2015-07-31 Node.jsでAWSAPIで認証するやつ書いた 2015-08-02 Node.jsでAmazon API Gatewayのクライアント書いた 2015-08-03 Amazon API Gatewayに自動で定義するやつ 2015-08-04 Amazon Lambdaにまとめてアップロードするやつ 2015-08-05 SwaggerをAPI Gatewayに反映させるやつ 2015-08-06 LambdaAPI Gatewayまとめて管理するやつ 2015-08-07 LambdaAPI Gateway用のWAF 2015-08-08 fluctでAPI GatewayLambdaと仲

    最近のAPI活動 - ✘╹◡╹✘
  • Node.jsでAWSのAPIで認証するやつ書いた - ✘╹◡╹✘

    https://github.com/r7kamura/aws-signer-v4 Amazon API GatewayのREST APIを利用したかったんだけど、Node.js用のaws-sdkにはまだその機能が入っていないこともあり、自分で認証するためのライブラリを書いた。リクエストのメソッド、URL、ヘッダ、ボディ、AWSのAccessKeyID、SecretAccessKey、リージョンを、決められた手順に従って加工し、Authorizationリクエストヘッダに入れることで認証が通るようになる。その決められた手順を実装した。詳しい仕様は AWS Signature version 4 のページに記載されているがほとんどの人間は読む必要は無い。自分でこのロジックを実装したいなら、JavaScriptの場合は aws-sdk-js/lib//signers/v4.js にAWSのSD

    Node.jsでAWSのAPIで認証するやつ書いた - ✘╹◡╹✘