タグ

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

  • MastodonをAWSでシュッと動かすやつ - ✘╹◡╹✘

    MastodonAWS で動かしたい人のために、https://github.com/r7kamura/mastodon-terraform というのをつくった。簡単に動かすという目的以外に、MastodonAWS で動かすために必要な設定をコードで表現することで、どういうインフラが必要になるのかを共有しようというねらいもある。 使い方 https://github.com/r7kamura/mastodon-terraform を fork する CircleCI と連携する 適当な環境変数を与えてビルドする マストドン動く ✌(‘ω'✌ )三✌('ω’)✌三(✌'ω')✌ 別に必ず fork しないといけない訳ではなくて、copy して使ったり terraform module として参照したりしても良い。 構築される環境 ┌---------------┐ | Web B

    MastodonをAWSでシュッと動かすやつ - ✘╹◡╹✘
    nagayama
    nagayama 2017/04/21
  • 2017年4月9日 - ✘╹◡╹✘

    ぐったり 今週末はどうも調子が出ずに何もせずにぐったりしてしまった。あんまり自炊せず、漫画読んで、Electron でちょっとアプリつくったりしてた。休日とは、来こういうものではないだろうか…。よく考えたら Electron でちょっとアプリつくってるので進捗してる。 Electron Markdown からスライドをつくるありがちなやつを Electron でつくってみている。Electron アプリを試すのは 1 年半ぶり 3 回目。以前に Twitter クライアントとエディタを試作している。どちらもプロトタイプ止まりで、きちんとしたアプリとして世に送り出すレベルまで持っていったことはない。 Markdown を投稿してスライドとして描画するスライドホスティングサイトをつくって、来はそこで動かそうという理想があるんだけど、最終的には Electron で動くデスクトップアプリとし

    2017年4月9日 - ✘╹◡╹✘
    nagayama
    nagayama 2017/04/13
  • amakan の React コンポーネント設計 - ✘╹◡╹✘

    説明用の図 例として、amakan anime のトップページ https://anime.amakan.net/ の構造を挙げながら説明する。(ところで amakan anime は今月中に完成予定のサービスで実験的に公開している状態なので、まだまだ至らないところが多々あります…) 登場するコンポーネント一覧 React.Component クラスを継承したクラスをコンポーネントと呼ぶ。主に登場するコンポーネントは以下の通り。 Header Layout Router VideoPrograms Router コンポーネント 最上位のコンポーネントとして、Router コンポーネントが存在する。このコンポーネントを利用して、ページごとにどのコンポーネントを表示すべきかを分岐させる。amakan anime のトップページでは VideoPrograms コンポーネントを描画し、amaka

    amakan の React コンポーネント設計 - ✘╹◡╹✘
    nagayama
    nagayama 2017/03/15
  • 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化した感想 - ✘╹◡╹✘
    nagayama
    nagayama 2017/01/03
  • 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に移行した - ✘╹◡╹✘
    nagayama
    nagayama 2016/12/26
  • 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に移行した - ✘╹◡╹✘
    nagayama
    nagayama 2016/12/21
  • 天井照明を改造してプロジェクタを付けた - ✘╹◡╹✘

    いろいろ試行錯誤してプロジェクタを取付けた記録です。 つい先日引越した ところ、新居にいい壁があり、またいいところに照明用のレールがありました。賃貸物件で天井に穴を開けられないため、このレールを利用してプロジェクタを取付けられないかどうか調べてみることにしました。ネットで見てもほとんど事例が出てこないので暗中模索です。 前の住居で利用していた照明器具が運良く余っていたので、これを分解し、天井の引掛け金具とプロジェクタ用のアダプタとを繋ぐ部品として利用することにしました。 DI CLASSE(ディクラッセ) Ferrico flat3 フェリコ フラット3 シーリングライト LC5101ST 出版社/メーカー: ディクラッセメディア: ホーム&キッチンこの商品を含むブログを見る ちなみに部品を取り外した照明はこれで、そこそこの重さがある照明だったので、それなりに (5kg程度) までは耐えら

    天井照明を改造してプロジェクタを付けた - ✘╹◡╹✘
    nagayama
    nagayama 2016/12/13
    配線ダクトにプロジェクタつけるのいいな
  • 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 - ✘╹◡╹✘
    nagayama
    nagayama 2016/11/24
  • エンジニア立ち居振舞い: 気持ちよりも行動を評価する - ✘╹◡╹✘

    エンジニア立ち居振舞い」 というお題に対しての投稿。 立ち居振る舞いというか、姿勢、それも比喩的な意味での姿勢の話なのだけど、所謂やっていく気持ちよりも、行動した事実に価値を見出すように努めている。エンジニアと言うとその職業柄、仕事の所作みたいな話が多くなりがちだけれど、何も仕事に限った話ではなくて、例えばブログ記事を書くときなどもそうであると思う。こういうものを頑張ってつくっている最中であるとか、こういうところで困っていて大変といった気持ちを吐露したくなることがある訳だけど、そこは矜持としてグッと我慢して、早くいいものを完成させてみんなを驚かせたいとか、苦しい気持ちはひた隠しにして反骨精神を高めるとか、そういう気持ちに変換して、より大きな成果を上げられるようにしたいと思っている。 自分に限らず他人の行動についてもそうで、何かやりたいと言っている人や、あるいは筋の良さ悪さについて考えあぐ

    エンジニア立ち居振舞い: 気持ちよりも行動を評価する - ✘╹◡╹✘
    nagayama
    nagayama 2016/11/11
  • キーボードショートカットをカスタマイズするブラウザ拡張 - ✘╹◡╹✘

    この文章は https://github.com/r7kamura/keyworks/ の製作記である。Keyworksはキーボードショートカットをカスタマイズするための凡庸なブラウザ拡張であり、つい先日、思いつきによりつくられた。 いま見ているページをTwitterで共有するとき、あるいはMarkdownで書いた文書にページのリンクを載せるとき、皆どのようなツールを利用しているのだろう。この話題を出すと、それ専用のChrome拡張や、秘蔵のブックマークレット、VimEmacs風のキーバインドを実現するツールのプラグインなど、みな懐から様々なツールを取り出して楽しませてくれる。自分はというと、これまでKeyconfigというChrome拡張を使っていた。 Keyconfig - Chromeウェブストア https://github.com/os0x/ChromeKeyconfig Ke

    キーボードショートカットをカスタマイズするブラウザ拡張 - ✘╹◡╹✘
    nagayama
    nagayama 2016/11/10
    “自分が何かをつくるとき、こういうものがつくりたいという気持ちよりも、こういうものがつくれる自分になっておきたいという気持ち”
  • 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 - ✘╹◡╹✘
    nagayama
    nagayama 2016/10/10
  • 汎用絵文字ライブラリ Somemoji - ✘╹◡╹✘

    ここ最近絵文字で遊んでいて、Somemoji というライブラリをつくったので知見を共有します。 さまざまな絵文字セット 様々なプラットフォームのために、様々な組織が、様々な絵文字セット (絵文字画像の集合) を提供しています。 Apple emojidex EmojiOne Facebook Google HTC LG Microsoft Mozilla Samsung Twitter 大抵の絵文字セットはUnicodeのEmojiの仕様に則って実装されていて、このコードポイントに対応する絵文字画像はこれ、というように互換性があります。Unicode 6.0, Unicode 7.0, Unicode 8.0, ... とバージョンが増えるに従って定義されるEmojiの数も増えていっているので、それぞれの絵文字セットごとに対応具合はまちまちという状況ではあるものの、よく使う主要なものについ

    汎用絵文字ライブラリ Somemoji - ✘╹◡╹✘
    nagayama
    nagayama 2016/10/09
  • 掲示板のJavaScriptこういう風に最適化しました - ✘╹◡╹✘

    最近Rails掲示板つくってて、サボって後回しにしていたJavaScriptの最適化をやりました。 掲示板の構成 Webpackを使っている Reactを使っている Server-Side Renderingをやっている Railsを使っている Sprocketsを使っていない 作業内容 webpack-bundle-size-analyzerで容量の大きいpackageを調査 HTTPクライアントに利用していたjQueryを撤廃 HTTPクライアントにaxiosを採用 lodashを一部しか読み込まないように変更 moment.jsの不要なlocaleを読み込まないように設定 変更結果 これでminify後の容量が770KB→476KBに。gzip圧縮状態では202KB→125KB。 $(npm bin)/webpack --profile --json | webpack-bundl

    掲示板のJavaScriptこういう風に最適化しました - ✘╹◡╹✘
    nagayama
    nagayama 2016/10/04
  • モデルからJSON生成するときこうやってます2016 - ✘╹◡╹✘

    最近RubyReact.jsをよく利用していて、Rubyで扱っている値をJSONとして表現したいケースが増えてきた。こういうのどうやっていますかと人に聞きたいので、自分はこうやっていますよというのを説明のためにまとめておくことにする。 概観 自分の場合、次のような方法で実装することが多い。 JSONとして表現したいオブジェクトをコンストラクタで受け取るクラスを定義する クラスに #as_json を定義して適当なHashを返すようにする Object#to_json が再帰的に #as_json を利用するようにする (ActiveSupportがやってくれる) コード 具体的には、以下のようなクラスをつくっている。これは最近つくっている掲示板での例で、Megaboard::Resources::Comment はコメントのJSON表現のためのクラスである。いわばコメントのJSON表現に

    モデルからJSON生成するときこうやってます2016 - ✘╹◡╹✘
    nagayama
    nagayama 2016/10/03
  • 最終掲示板戦争 - ✘╹◡╹✘

    こんにちは、r7kamuraです。26年なにも考えずに生きてきて、レールに沿った人生を歩んできました。 さて、数日前からなんとなく気が触れてRuby on Rails掲示板をつくってみている。上の画像はいまつくりかけのもの。CSS全部手で書いてみてるからまだ見てくれがかなりショボい。最初に手を動かしはじめたきっかけは、2007年頃に「Railsを使って15分で掲示板をつくってみよう!」という記事を見たのを思い出したのがきっかけ。いまのところ10時間ぐらい経過している。15分はちょっと無理そう。2016年にもなって10時間以上かけて掲示板つくってるのは皮肉すぎる事実。もはや何故掲示板をつくっていたのか分からなくなってきつつある。とりあえず濁り切らない内に考えていることを書いておく。最近なんで掲示板つくってんのって聞かれることが増えてきたので、そのときにこの記事のURL出せると多分便利。 掲

    最終掲示板戦争 - ✘╹◡╹✘
    nagayama
    nagayama 2016/09/28
    また戦争がはじまる…
  • SoundCloudの曲を一緒に聴けるやつをつくってみた - ✘╹◡╹✘

    https://syncbeats.herokuapp.com/ ※利用者も減ってきたということで、現在は公開を停止しています。 syncbeats というのを作ってみました。端的に言うとSoundCloudの曲をみんなで同時再生する君 です。部屋をつくってSoundCloudのURLを適当に突っ込むと順番に再生してくれて、あとから部屋に入ってきた人も同じ位置から再生されるというやつ。試しに曲を入れてリロードしてみると、途中から再生されるのが分かる。曲が無くなると、新しい曲が追加されるのを待ち受ける状態になる。たまに壊れるんでリロードすると治る。SlackTwitterで部屋のURLを共有して一緒に聴くみたいな使い方がいいんじゃないでしょうか。 背景 前にシェアハウスに居たときにたまにリビングで音楽掛けることがあったんだけど、SoundCloudだとその場限りのセットリストつくるのも難し

    SoundCloudの曲を一緒に聴けるやつをつくってみた - ✘╹◡╹✘
    nagayama
    nagayama 2016/08/14
  • 作業用に買った4Kディスプレイが届いた - ✘╹◡╹✘

    43型4Kディスプレイ注文したので決め手を書いとく - ✘╹◡╹✘ で書いてたやつが届いたので、様子を紹介します。はてなブログの貼り付け機能便利ですね。全然文章書かなくても貼り付けていくだけで何かが生成される。 購入したやつ Philips 43型ワイド液晶ディスプレイ (4K対応/IPSパネル/5年間フル保証) BDM4350UC/11 出版社/メーカー: Philips(フィリップス)発売日: 2016/04/15メディア: Personal Computersこの商品を含むブログを見る 他の検討候補 DOSHISHA 43型 4K液晶ディスプレイ D431US 出版社/メーカー: DOSHISHA発売日: 2015/10/20メディア: Personal Computersこの商品を含むブログを見る I-O DATA 40型ワイド液晶ディスプレイ (HDMI端子4K/60Hz・HDC

    作業用に買った4Kディスプレイが届いた - ✘╹◡╹✘
    nagayama
    nagayama 2016/07/15
    “ゆくゆくは背も伸びるかもしれない”
  • 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ディスプレイ注文したので決め手を書いとく - ✘╹◡╹✘
  • 今日もAmazon API Gatewayを撫でた - ✘╹◡╹✘

    帰宅後に r7kamura/fluct の開発をちょっと進めて、AWS Lambdaの関数でHTTPリクエストのパスとかリクエストボディの内容とかを取れるようにした。文字で説明しただけでは意味が分からないだろうと思いデモを用意しましたのでこちらをご覧ください。 https://os92ef4zmf.execute-api.us-east-1.amazonaws.com/production/echo us-east (バージニア) のAmazon API Gatewayにos92ef4zmfというIDのREST APIを作成してあって、これのproduction環境にGET /echoというエンドポイントを用意している。このエンドポイントは内部でAWS Lambda上に作成したshow_echoという関数を実行するように設定されていて、show_echoはAPI Gatewayから受け取っ

    今日もAmazon API Gatewayを撫でた - ✘╹◡╹✘
  • 京都に引っ越した - ✘╹◡╹✘

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

    京都に引っ越した - ✘╹◡╹✘
    nagayama
    nagayama 2015/12/15
    おお