Folioscope

英和辞書をポップアップするVimプラグインを作った

Vim Vimscript

ついこの間、Vimにpopupが実装されたという話題と、Mouse Dictionaryがタイムラインに流れてきました。 自分もVimのPopupを使って英単語の意味を調べるプラグインを作ってみました。

スクリーンショット

GitHubレポジトリはこちらです。

ueokande/popupdict.vim 読力、活力、元気 github.com

使い方

dein.vimやvim-plugのパッケージマネージャーでインストールできるはずです。

" vim-plug
Plug 'ueokande/popupdict.vim'

" dein.vim:
dein#add('ueokande/popupdict.vim')

" NeoBundle …
もっと読む…

TSyringe - JavaScript/TypeScript向けの軽量DIコンテナ

Vim Vixen TypeScript

Vim VixenではClean Architecture風の設計をしており、扱うモデルやレイヤー毎にクラスを作成します。 現在はクラス数が100を超えて、クラスにインスタンスをいちいち渡したり、インスタンスの作成と管理が面倒になってきました。 そこでVim VixenではDependency Injection (DI)コンテナを導入することにしました。

いろいろ探してみると、すでにJavaScript/TypeScript用のDIコンテナがいくつか存在するようです。 その中で(巨人の肩に乗るつもりで)Microsoftの「TSyringe」という軽量DIコンテナを採用しました。

microsoft/tsyringe Lightweight dependency injection container for JavaScript/TypeScript github.com

TSyringeはデコレーター(Javaのアノテーションのようなもの)でDIするクラスを指定したり、必要なクラスをコンストラ …

もっと読む…

TypeScriptに移行して気づいた10の事実

Vim Vixen TypeScript

ついにVim VixenをTypeScriptに移行しました。 今まで強がりでECMAScriptで書いてたのですが、静的型付き言語の便利さに負けてついに移行しました。 その時に新しい発見がいくつかあったので簡単にまとめます。

エコシステムが十分に育っている

TypeScriptに移行するのなら、トランスパイラ本体だけではなく周辺ライブラリのサポートも必要です。 たとえばVim VixenではWebpackでのビルドやLinterのチェックをしてます。 また使ってるライブラリの型定義もほしいです。 それらTypeScript以外とのエコシステムの成熟度が、今回の移行の鍵でした。

結論として無事移行できました。 Vim Vixenのライブラリ利用状況は以下のようになりました。

  • ビルド: Webpack + ts-loader
  • Linter: ESLint + @typescript-eslint/eslint-plugin
  • テスト: karma-webpack + mocha/chai

若干@typescript-eslint/eslint-pluginで不具合がありま …

もっと読む…

いろいろできるぞexecuteScript()

WebExtensions

デバッグコンソール

WebExtensionsのtabs.executeScript()メソッドは、Background ScriptからContent Script上にJavaScriptを注入できます。 たまたま調べる機会があって挙動が面白かったので簡単に記事にまとめました。

基本動作

executeScript()はContent Script上で任意のスクリプトを実行して最後に評価した値を返します。 executeScript()はPromiseを返す非同期関数で、評価した値はthenの引数から取得できます。 最後に評価した値は、例えば以下の例では'my result'になります。

var foo='my result';foo;

executeScript() の結果は各フレームで評価された値がArrayに格納されます(フレームを指定しないとトップウ …

もっと読む…

3年間働いたサイボウズを退職しません

今年も花粉と共に退職エントリが舞う季節になりました。 せっかくなので退職しませんエントリを書きました。

この3月でサイボウズに勤めててから丸3年が経ちます。 学生の頃はWebエンジニアといえば、技術を片手に渡り鳥のように転々するかなと思ってました。 しかし実際サイボウズに入ってみると、意外と居心地が良かったので、この4月からも引き続きサイボウズで働きます!

サイボウズとのきっかけ

入社以前からサイボウズLiveは知っていて、母校(奈良高専)もサイボウズOfficeを導入してました。 そのためサイボウズが何を作ってるかはなんとなくイメージできました。

入社しようと思ったきっかけは、学校(NAIST)の説明会で中の人と合う機会があったからです。 企業向けビジネスだけどネクタイの会社じゃなかったという安心感もありましたが、中の人と実際会ってみてなんとなく雰囲気が合いそうという感じもありました。 話を聞けば聞くほど技術的にも会社的にも興味が湧き、自分にぴったりだと思い入社を決めました。

入社後アプリ基盤へ配属

初めて配属されたチームは「アプリ基盤」というチームで、製品のミドルウ …

もっと読む…

Envoy ProxyのためのEDSサーバーを作る

Envoy Proxy

いよいよEnvoyの肝であるxDSサーバーを使いたいと思います。 まず手始めにエンドポイントを設定できるEndpoint Discovery Service (EDS) を提供するサービスを実装します。

xDSおさらい

EnvoyではgRPCまたはREST API経由で動的に設定変更できます。 これはEnvoyにリクエストを送るのではなく、EnvoyがAPIを提供するサーバーに繋ぎにいきます。 APIには、エンドポイントの設定を提供する Endpoint Discovery Service (EDS) や、クラスタの設定を提供する Cluster Discovery Service (CDS) などがあります。 これらをまとめてxDS APIと呼びます。

xDS APIのデータ構造はProtocol Bufferによって定義されています。 v2 API referenceも大体はこのProtocol Bufferに基づきます。 またEnvoy起動時にロードする静的な設定も、ほとんどの設定項目がこの構造体の定義に基づきます。

xDS APIを提供するサーバーをコントロールプ …

もっと読む…

Envoy Proxyで作るHTTPロードバランサー

Envoy Proxy

Envoy Proxyに入門してポチポチ勉強を進めてます。 Envoy Proxyは動的な設定とxDS APIが魅力的ですが、手始めに静的な設定ファイルで動かしてみましょう。 この記事ではHTTPロードバランサーをEnvoyで構築します。 完成図は以下の図になります。

Envoyで構築するHTTPプロキシの図

HTTPロードバランサーの後ろには、目的の異なる2つのクラスタがあります。 今回はNGINXとApache httpdを使っています。 それぞれのクラスタはnginx.localhttpd.localというホスト名(バーチャルホスト)で経路を分岐します。

  • 2019-02-06追記 : DEPRECATEDなプロパティを修正しました。

Envoyの設定ファイル

Envoyをどういう環境で利用するにもBootstrap …

もっと読む…

ブログエンジンをMiddlemanからHUGOに移行した

HUGOのロゴ

このブログ、以前はMiddlemanでビルドしてたんですが、この度HUGOに移行しました。 結論から言えば、機能的にはほぼ同じで移行も簡単でした(すでにこのブログも移行済みです)。 いくつか工夫する部分があったのでそれを記事にまとめました。

テンプレートエンジンの移行

HUGOはテンプレートエンジンにGoのhtml/templateを使ってます。 HUGOではMiddlemanと同様 partial を使ってHTMLを外部ファイルとして記述できるので、パーツの共通化ができます。 MiddlemanからHUGOへの移行も、.erbファイルをGoのテンプレートに変換するだけで移行できました。 HUGOではMiddlemanと同じよう、テンプレート内から現在の記事のタイトルや全ての記事を取得できます。

MiddlemanではRubyで書いたヘルパメソッドをテンプレート …

もっと読む…

Envoy Proxyに入門した

Envoy Proxy

Envoy Proxy

最近Kubernetes周りの技術をよく触るのですが、Envoy Proxy (Envoy)もよく耳にするので勉強しました。

Envoyとは?

EnvoyはクラウドネイティブなWebサービスのために設計されたロードバランサーです。 元はLyftが開発しており、現在はCNCF (Cloud Network Computing Foundation) によって管理されています。 Envoyには大きく2つの用途があります。

  • サービスメッシュの通信バス: サービスメッシュ内の各サービス間の通信を制御するプロキシ。サービスディスカバリーや流量の制御をする。
  • エッジプロキシ: サービス内のプライベートネットワークとサービス外をつなぐプロキシ。データセンターやKubernetesクラスタの外からのアクセスを受け付ける。

背景

モノリスで …

もっと読む…

Arch Linux上でSteamのゲームで遊ぶ

Linux

Portal Bundle

PortalとPortal 2がセットで180円という電波を受信したので早速買いました。 自分のマシンはArch Linuxということで、Linux環境でSteamをインストールしてゲームの起動までチャレンジしました。 結果を先に言うと、普通にプレイできました。 大きな障害もなくて驚きです。

SteamのLinuxサポートはかなり前からニュースになってました。 正式にサポートしてるOSはUbuntuまたはSteamOS(Debianベース)のみですが、Arch Linuxでも動かしてみました。 自分の環境は以下のとおりです。

  • Arch Linux
  • nVIDIA GeForce GT 1030

依存パッケージのインストール

まずはゲームを起動するための依存パッケージをインストールします。 Steamのゲームは32ビットバイナリでビルドされて …

もっと読む…
Page 1 of 24 >