タグ

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

  • katatema.js - ✘╹◡╹✘

    次のようなコードを書いて、 import React from "react" export default () => <div>Hello!</div> 次のようなコマンドを叩くと、 katatema build 次のようなファイルが生成されるという、katatema というツールをつくった。 <!DOCTYPE html> <html> <head> </head> <body> <div>Hello!</div> </body> 最先端の消耗 前に キーボードショートカットをカスタマイズするブラウザ拡張 - ✘╹◡╹✘ で、こういうことを書いた。 id:moznion へ、寒い日が続きますがお元気ですか。ともあれChrome拡張を1つこさえれば、大の大人が寄ってたかってモダンと言い合う類のものが一通り学べるだろうと思います。 最近のJavaScriptの周辺環境は大変で、何をやるに

    katatema.js - ✘╹◡╹✘
  • amakanにstylelintを導入した - ✘╹◡╹✘

    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に移行した - ✘╹◡╹✘ amakanをDocker化した感想 - ✘╹◡╹✘ amakanのCIをShippableに移行した - ✘╹◡╹✘ amakan の CSS は勘で書いていて、何となく気が向いたので style

    amakanにstylelintを導入した - ✘╹◡╹✘
  • 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を使うようにした - ✘╹◡╹✘
  • amakanをUnicornからPumaに移行した - ✘╹◡╹✘

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

    amakanをUnicornからPumaに移行した - ✘╹◡╹✘
  • 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 - ✘╹◡╹✘
  • 急に高まって深夜にiOSアプリつくった - ✘╹◡╹✘

    ※当方iOSアプリ開発経験無し react-native、デモ見たときタップしたら画面上の数が増えるぐらいのアプリしかつくれなさそうという印象だったけど、いま丁度タップして読んだ数が増える程度のアプリつくりたいんで使いたい— 生産職 (@r7kamura) 2016年8月23日 とち狂ってreact-nativeのチュートリアルに沿ってインストールはじめてしまった、死にたい— 生産職 (@r7kamura) 2016年8月23日 殺してくれ 殺してくれ— 生産職 (@r7kamura) 2016年8月23日 アプリ完成した pic.twitter.com/bep81pzWAR— 生産職 (@r7kamura) 2016年8月23日 とりあえずバナナでも表示してみるか— 生産職 (@r7kamura) 2016年8月23日 なるほどなるほど pic.twitter.com/mgLilyL09

    急に高まって深夜にiOSアプリつくった - ✘╹◡╹✘
  • 全てがJSONになる - ✘╹◡╹✘

    TL;DR JSON Schemaを使ってこういうことが実現可能になった。 ダミーAPIサーバの提供 ドキュメントの自動生成 APIクライアントの動的定義 APIサーバのバリデータの動的定義 APIサーバのレスポンスの自動テスト JSON Schemaとは JSON SchemaというのはあるJSONのデータ構造を記述するための方法および書式の仕様で、 JSON SchemaもJSONで記述される。 これを利用すれば、リソースベースの(=RESTfulライクな)APIの仕様が簡便に記述できる。 例えば、我々のAPIレシピとユーザというリソースを扱っていて、 それぞれCRUDのAPIを備えており、レシピはidとtitleとdescriptionという属性を持つ、 という旨をJSON Schemaで表現できる。 なんで最近ちょっと流行ってんの Mobile First、 Service Or

    全てがJSONになる - ✘╹◡╹✘
  • Node.jsでAmazon API Gatewayのクライアント書いた - ✘╹◡╹✘

    https://github.com/r7kamura/amazon-api-gateway-client Amazon API GatewayのREST API (紛らわしい) を操作するためのクライアントライブラリを書いた。書いたというよりか書き始めたぐらいの感じで、まだ一部のエンドポイントにしか対応していない。とりあえずこういう風に使える。 var Client = require('amazon-api-gateway-client').Client; var client = new Client({ accessKeyId: '...', region: '...', secretAccessKey: '...' }); // 新しくRestapi (API Gateway上で複数のエンドポイントをまとめる管理単位のこと) をつくる client.createRestapi({

    Node.jsでAmazon API Gatewayのクライアント書いた - ✘╹◡╹✘
  • Railsアプリつくった - ✘╹◡╹✘

    最近APIサーバ用途でRailsアプリを1個つくったので振り返る。 概要 接続元はiOSやAndroidアプリとか、Webブラウザとか、別のWebアプリケーションとか。1ホストあたり秒間数百リクエスト、平均応答時間10msぐらい。Rails 4.1.0.rc2、Unicorn、Nginxを使ってる。正直Railsは全部入りで重いイメージがあったので何となく平均50ms以内程度であれば良いところだろうと思ってたけど、意外と速い。多分そもそもサーバの性能が良いんだと思う。実装時に気を付けたことは普段の開発と特に変わりない。いつもは大勢でワイワイ開発するものに少し手を加えるということが多いんだけど、今回は珍しく自分一人でつくったから目が行き届いてたのかもしれない。DBへの問合せの効率に気を配るとか、Rubyでの処理の無駄を省くとか、アプリケーションのプロセスに無駄なコードを読み込ませないとか、計

    Railsアプリつくった - ✘╹◡╹✘
  • Boxenを実行すると何が起こるのか - ✘╹◡╹✘

    http://boxen.github.com/ https://github.com/boxen/boxen https://github.com/boxen/our-boxen スゴイスゴイと言われていて誰も使っていないBoxenだけど、昨日の朝コードを読んでみた。折角なので、boxenコマンドを実行すると何が起こるのかというのを、Rubyのメソッド単位のコールグラフという形で簡単に説明する。 処理の流れ 1. レポジトリをgit-pullで更新 2. 環境変数や前回実行時に保存しておいたJSONから設定を読み込み 3. 前処理 4. コマンドライン引数に応じて 4-A. puppet-applyを実行 → 後処理 4-B. その他便利コマンドを実行 → 終了 Puppetの扱い librarian-puppetという仕組みが利用されていて、Puppetfile(=Puppet版Gem

    Boxenを実行すると何が起こるのか - ✘╹◡╹✘
  • 1