Activity

投稿数
20253
20222
20219
202013
201913
201850
20161
  • 2016
  • 2017
  • 2018
  • 2019
  • 2020
  • 2021
  • 2022
  • 2023
  • 2024
  • 2025

Archives


2025

(3記事)

2025/2/12

zig v0.13.0で作成したバイナリをHomebrew経由でインストールできるようにするためにGitHub ActionでCI/CDを構築した

zig言語で作ったzagというライブラリをHomebrewでインストールできるようにするまでの物語です

zig
homebrew

2025/2/8

Homebrewの用語を挙動を確認しながら理解する

Homebrewにライブラリをリリースする際に遭遇したよくわからない言葉をまとめました

tap
Formula

2025/1/29

これまでの振りと2025年からはじめること

しばらく個人ブログなんて書いていなくて、かな〜り間が空いてしまったので書く

blogs

2022

(2記事)

2022/7/7

OIDCを利用したGitHub ActionsからGoogle CloudへのDocker Pushの設定方法

OIDCトークンを利用したdocker pushをGitHub Actionsで構築します。これを利用することにより、Secretの管理が不要になります。

Docker
docker push

2022/1/18

ArgoCDで複数のapp of appsを作成できるか検証する
Argo CD
argocd

2021

(9記事)

2021/12/18

2021年ニコニコ生放送のWEBフロントエンドを継続的に支えている技術の紹介

ドワンゴアドベントカレンダー2021年12月18日目を@Himenonの提供でお送りします。

openapi
filesize

2021/9/29

EnvoyのExternal Processing Server開発時のTroubleshooting

EnvoyのExternal Processing(ext_proc)の開発時のトラブルシュート一覧を紹介します。

envoy
envoyproxy

2021/9/28

EnvoyのExternal Processingのgoの実装サンプル紹介

作成したext_procのサンプルを紹介します。

envoy
envoyproxy

2021/7/20

Reactで作る簡易検索機能

配列操作を利用した検索機能を紹介します。

react
search form

2021/6/23

ボタンの振る舞いと実装のパターン

「ボタン」の実装とひとえに言っても何パターンか存在するため、パターン化して列挙する。

Button
Design Pattern

2021/4/23

JavaScriptにおけるパッケージレイアウトの比較

JavaScriptプロジェクトの規模と運用に応じた分割のアーキテクチャ(モノリス・モノレポ・メニーレポ)の比較

JavaScript
Monorepo

2021/4/8

Google SpreadSheetをGitHubでバージョン管理するためのアドオンVersion Oceanをリリースしました

SpreadSheetをGit管理する方法を提供するプラグインを紹介します。

Git
GitHub

2021/3/15

通信が絡むUIを仕様書で定義するときのパターン

仕様書でもれなく記述するために知識を整理します。

仕様書
通信

2021/1/12

OpenAPI TypeScript Code GeneratorをASTを利用して作成しました

様々な辛さを解消したTypeScript用のコードジェネレーターを作成しました。すべてTypeScriptで実装されています。

OpenAPI
TypeScript

2020

(13記事)

2020/12/23

TypeScriptでErrorを拡張して独自のExceptionを出力する

独自のエラーの名前を生成する方法を紹介。

Exception
Error

2020/12/14

fish shellのセットアップ

平文でパスワードを入力した場合など、履歴を消したい場合に利用します。

fish
shell

2020/11/18

flat is not a functionの原因と対処

Array#flatが利用できない場合の確認内容と対処方法

javascript
typescript

2020/11/12

TypeScriptで非同期/同期関数のwrapper関数を定義する

同期処理、非同時処理の両方に対応した定義を紹介

TypeScript
AsyncFunction

2020/11/10

JSONからOpenAPIのSchemaを生成する

巨大なJSONをOpenAPIのSchemaに落とし込むのは大変なのでスクリプトに仕上げました。

TypeScript
JavaScript

2020/11/10

OpenAPI(Swagger)を利用してTypeScriptのAPI Clientを自動生成する設計と実装

複数のendpointに対するビルドパイプラインの設計と実装例を紹介する。

OpenAPI
Swagger

2020/8/31

yarn installをオフラインで行うときの管理方法

「There appears to be trouble with your network connection.」というエラーが出た場合、yarnのofflineインストールを利用して回避する方法を紹介します。

There appears to be trouble with your network connection
yarn

2020/4/19

ReactのServer side rendering時に'Invalid hook call'が出てしまう問題と解決方法

'Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons'の対処方法

invalid hook call
react

2020/4/11

TypeScriptで、TS2307のエラーが出たとき、TS1149のエラーも疑う

error TS1149: File name 'library.ts' differs from already included file name 'Library.ts' only in casing.

typescript
error

2020/4/3

認証を通したlighthouseをprogramaticallyに利用する

ログイン後にLighthouseを利用する方法を紹介します

lighthouse
puppeteer

2020/4/3

認証後にcypressを利用してe2eテストを行う

cypressをログイン後にCORSで弾かれずに実行する方法を紹介します

cypress
e2e

2020/3/16

[mobx] you are running a minified build, but 'process.env.NODE_ENV' was not set to 'production' in your bundler. This results in an unnecessarily large and slow bundle

mobxを含むアプリケーションをビルド後に起動すると、minifyのwarnがログにでるときの対処方法。

mobx
webpack

2020/2/8

JavaScript・TypeScriptのimport・exportの依存関係を可視化するcode-dependencyの紹介

js、tsのファイル間の依存関係を可視化するツールについて紹介します。

JavaScript
TypeScript

2019

(13記事)

2019/12/30

emccコマンドをインストールする

emccコマンドをインストールする方法を紹介します。

webassembly
wasm

2019/12/15

JavaScriptでHTMLを動的に生成するときの書き方の実践例

コーディングルールを決めた上でJavaScript内で動的にDOMを生成する実装をステップを踏んで紹介します。

javascript
html

2019/12/14

JSConf JP 2019に行った後、次に何をやるか考えている

JSConf JP 2019が11/30-12/1にかけて開催されました。参加後の記録です。

jsconfjp
jsconfjp 2019

2019/6/27

hubコマンドのreleaseを使ってみる

GitHubにシェルでreleaseするときのコマンドについて調査した

git
hub

2019/6/12

NodeJSでローカルのファイルを操作するときのwrapper

fs-extraとpathを利用してよく使うパターンにまとめます。直接使うのも良いですが、デバッグ用のログを仕込んだりMockテストをすることを考えると一層間に噛ませると融通が効きます。

nodejs
filesystem

2019/6/12

JavaScriptで同期的なwait/sleep/delay関数を作る

ありそうでない待つ(wait/sleep/delay)処理の作り方。Promiseチェーンとコールバックでの表現についても解説しました。

javascript wait
javascript sleep 同期

2019/6/12

yarn installが遅い原因の調査方法

プロジェクトが依存するパッケージに比例して線形にインストール時間が増えていることが期待します。

yarn 遅い
npm install 遅い

2019/6/11

JavaScriptでクエリパラメーターを書き換える

検索フィルターを保存するときクエリパラメーターを利用すると、シェアするときに状態ごと共有できるため再現性を保つことができます。

javascript
browser

2019/6/11

NodeJSのrequireがどのファイルを探索しているのかを調べる

`require.resolve`を使えば良いでしょう。requireが参照するディレクトリや、moduleが見つからない場合の対処方法を紹介します。

nodejs
require.resolve

2019/6/7

Docker Registry API v2を利用してtag、manifest、imageの情報を取得する

Docker imageの情報を整理するときに利用します。

docker
image

2019/6/7

AlfredのSnippetsに登録しておく内容

詠唱不要で多くの技を繰り出す虎の巻

alfred
shortcut

2019/6/7

fish shellで過去に入力した履歴を削除する

平文でパスワードを入力した場合など、履歴を消したい場合に利用します。

fish
shell

2019/5/21

コンテナーアプリケーション作成時のディレクトリ成長設計の考察

コンテナーを利用したアプリケーションを作成するときのディレクトリ設計について考えてみた。

docker
kubernetes

2018

(50記事)

2018/12/12

mdx-jsの実装を解読するまでの話

mdx-jsの内部実装について解説します。

JavaScript
JSX

2018/12/1

AbemaTV Developerカンファレンスに行ってきた

AbemaTV Developerカンファレンスに行ってきたときのメモ

conference
abemaTV

2018/10/5

Gitの最新のCommitメッセージに対する正規表現

最新のコミットメッセージをgrepする場合のコマンド

git
grep

2018/9/26

Kubeflow Meetup #1に行ってきた

Kubeflow Meetup初回に参加したときのメモ

kubeflow
meetup

2018/9/25

c8r/genのリファクタリングの作業工程を振り返っておく

リファクタリングの振り返り

静的サイトジェネレーター
node

2018/9/24

c8r/genのリファクタリング中に見つけたコード

c8r/genのリファクタリング中に興味深い実装を見つけたので書き留めておく。

静的サイトジェネレーター
node

2018/9/23

c8r/genのserverのコードを分析してみる

jsxを静的ファイルとして書き出すc8r/genというライブラリのserverのコードを解析する。

静的サイトジェネレーター
node

2018/9/22

c8r/genといライブラリのリファクタリングの進捗

jsxを静的ファイルとして書き出すc8r/genというライブラリのリファクタリング

静的サイトジェネレーター
node

2018/9/22

c8r/genのcliのコードを分析してみる

jsxを静的ファイルとして書き出すc8r/genというライブラリのcliのコードを解析する。

静的サイトジェネレーター
node

2018/9/20

c8r/genというjsxから静的ファイルライブラリを買い替えている

jsxを静的ファイルとして書き出すc8r/genというライブラリをTypeScript化しつつ写経してみた。

静的サイトジェネレーター
node

2018/9/17

PyCon JP 2018の個人レポート

スライドとタイトルをざっと眺めて、あとから見返したいものだけをまとめました。

pyconjp
pycon,

2018/9/16

URLからJavaScriptでドメイン名を抽出するには?

与えられた文字列から、文字列操作でドメイン名だけを抽出する

javascript
ドメイン名

2018/9/16

JavaScriptの高階関数を利用して処理に対して明瞭な命名を行う

map, filter, reduceを利用して処理を小さく記述する工程をまとめました。

javascript
forEach

2018/9/15

Djangoでfixtureを読み込む

DjangoでFixtureを読み込むときのメモ

python
django

2018/9/15

DjangoでMany to ManyをAdmin画面のリストに表示する

多対多の関係を持つデータベースを管理画面に表示する

python
django

2018/9/15

Djangoにおいてデータベースに保存する前後に処理をフックさせる

DjangoのSignalを利用してデータベースの保存前・保存後に処理をフックさせる

python
django

2018/9/15

Djangoにおける静的ファイルの探索がコケたときのエラー

静的ファイルの探索エラー

python
django

2018/9/15

DjangoでNginxのUnix Socketを利用する

Unix socketでDjangoを公開する

python
django

2018/9/15

DjangoでValidation アルファベットのみのバリデーションを実装する

バリデーションメモ

python
django

2018/9/13

Dockerで利用するコマンド例

コピペで動くコマンドを書き連ねる

docker
shortcut

2018/9/13

DockerをPycharmで使う

バックグラウンドでDocker内部のPythonを参照するように設定する

docker
pycharm

2018/9/13

Docker Swarmで使うコマンド

クラスター操作のコマンド

docker
swarm

2018/9/13

DockerのMySQLでUTF-8を使えるようにする

DockerのMySQLコンテナでUTF-8を使えるようにしておく

mysql
docker

2018/9/9

RaspberrypiにOSインストールする

重いぞ!

raspberrypi

2018/9/8

Raspberrypiのパーツを買った

買ってみた

raspberrypi

2018/5/22

Cloud Native Meetup Tokyo #1に行ってきた

Cloud Native Meetup Tokyo #1に参加してきたときのメモ

cloud
meetup

2018/5/20

自作のファイルテンプレート(雛形)を生成するCookiecutterの使い方

クッキーカッターというテンプレートジェネレーター

cookiecutter
generator

2018/5/3

Flaskのv1.0のリリースで変わったこと

リリースノートのメモ。

python
flask

2018/4/16

JavaScript(NodeJS)のDynamic Import

NodeJSで他のモジュールを動的にインポートするときの書き方。

nodejs
dynamic import

2018/4/16

Djangoでデータベースを分割して利用する

複数のデータベースへの参照をDjangoで構築する

python
django

2018/4/12

ローカルのgitに登録しているショートカット

git configに書いておくもの

git
shortcut

2018/4/9

nodeのrequestライブラリの`json`オプションの取り扱いについて調べてみた

json:trueの指定をしてもPOST時にjson化されないらしい?

javascript
library

2018/3/30

GKEをCronで起動・停止させる

GKEを平日の朝9:00に起動して、18:00に停止させるようにcronを仕込む

kubernetes
cron

2018/3/30

2018年のGithubの活動状況

2018年における@HimenonのGitHubの活動略歴

github
profile

2018/3/30

2018年のプロフィール

2018年における@Himenonのプロフィール目次

github
profile

2018/3/30

Flaskのpytestのコードを少しだけ覗いてみる

Flaskのテストコードを垣間見る

python
flask

2018/3/28

2018年に参加した勉強会

2018年における@Himenonが参加した勉強会などのまとめ

github
profile

2018/3/27

2018年3月時点のスキルセット

2018年における@Himenonのスキルセット

github
profile

2018/3/26

復習用MongoDBの基本クエリ

簡易的な復習用にわかり易い例をメモしておく

mongodb

2018/3/26

pythonで利用するmongo DBの基本的なRead Write

pythonでmongoDBを利用するときに最初に動作確認で叩きそうなコマンド

python
mongodb

2018/3/26

jupyter_notebook_config.pyの読み込み先を変更する

jupyter notebookの設定

python
jupyter

2018/3/26

PandasのColumnをDateTimeに型変換する

日付変換

python
jupyter

2018/3/22

Error: incompatible versions client[v2.8.2] server[v2.7.2]

helmのバージョンがクライアントとサーバーで異なるときに起きたエラー

error
helm

2018/3/12

Django 2.0にCelery 4.0を導入し、WEBの管理画面でCronを管理する

管理画面つきCron Jobの指定

celery
python

2018/3/9

Flaskのストリーミングを利用してみる

ジェネレーターを利用して文字列のストリーミングを試す

flask streaming
flask ストリーミング

2018/3/7

CeleryのPeriodic Tasksを使う

定期的なタスク(Periodic Task)の使い方についてまとめました。

celery
python.celery

2018/3/6

DjangoにAppを新たに追加したときにやること

新しくアプリを追加するときに設定する事項

python
django

2018/2/19

複数のホストをoauth2_proxyを用いてOAuth認証してリバースプロキシする

oauth2_proxyを複数のリバースプロキシ先に対応させてみた。

oauth2_proxy
nginx

2018/2/15

Kubernetesに配置したNginxでアクセス制御する

NginxのPodを置いてバランシングする話

nginx
kubernetes

2018/2/14

静的サイトジェネレーターの選定時に考えること

様々な静的サイトジェネレーターの中から自分にあった静的サイトジェネレーターをどうやって探すのか考えてみた。

static site generator
静的サイトジェネレーター

2016

(1記事)

2016/12/4

簡単なPythonのパッケージを作る方法

pythonのライブラリを作る方法を紹介します。

python
library

その他

(36記事)

2018年3月2日 酔いどれGCPUG で発表してきました

GKEを数ヶ月扱ってきた中で、最初に見ておくと良かったね、というものをまとめました

Adobe Premiere Pro

LUTsの出力ディレクトリ

nginxからEnvoyに乗り換えることはできるか

Envoyはnginxの代替になるのかまとめます。随時追加

envoy
envoyproxy
EnvoyのExternal Processingとはなにか

External Processingとはなにか

envoy
envoyproxy
WEBアプリケーションにおけるGoogle Analyticsの導入と実装の手引

Google OptimizeをWEBアプリケーションで利用する方法

Google Analytics
実装
A/B/nテストの設計方法とチーム内に展開する方法

ABテストの設計と共有の方法を紹介

google optimize
ABテスト
Server Side Rendering (SSR)を利用したReactのSPAにおけるGoogle OptimizeのABテストの実装方法

Google OptimizeをReactのServer Side Renderingとともに利用する

gtag.jsでGoogle Optimizeを利用する
google optimize
WEBアプリケーションにおけるGoogle Optimizeの導入と実装の手引

Google OptimizeをWEBアプリケーションで利用する方法

Google Optimize
Google Analytics
Google OptimizeとGoogle Analyticsを利用した効果測定が行える条件

Google OptimizeをWEBアプリケーションで利用する方法

google optimize
目次
ローカルホストをインターネット上に外部公開するinletsの紹介

開発環境をサーバーでProxyを行い、インターネット上に公開する方法を紹介します。

proxy
localhost
nodejsから実行するコマンドのログをstreamで出力する

execSyncなどを利用すると、実行されたコマンドが完了したあとにログが返ってきます。ログをstreamで取得するにはspawnを利用します。

nodejs
command
CSSのDynamic Load

cssのdynamic loadをJavaScriptで行う際に、First Paintのパフォーマンスに影響を及ぼさない方法を確認します。

JavaScriptライブラリにおけるProxy Directoryパターンとライブラリの参照整理

ライブラリ内部でpackage.jsonを参照解決のproxyとして扱い、ライブラリの開発者と利用者の両方に恩恵のある設計を提供する方法を示す。

Proxy Directory
design pattern
viz.jsをReactを利用する

viz.jsをReactで利用する方法を紹介します。

viz.js
react
rust入門

rust入門の記録

特定のディレクトリ内にある拡張子を数え上げる

シェルスクリプトで数え上げる

API Client 増加問題の対策

HTTP/websocket/RPC などの各種クライアントがエンドポイント単位で作成されメンテナンスコストが増える問題と対策

OpenAPI
メンテナンス
環境ごとの基底URL定義変更問題の対策

開発環境や本番環境でURLを変更する必要がある問題

OpenAPI
メンテナンス
UIの表示の組み合わせを網羅するための方法

動的に変化するアプリケーションにおける表示状態の再現をどのように行うか。

web
storybook
minifyや難読化されたコードのデバッグする方法

Production用のコードで不具合が生じたときにいかに速く問題を突き止めることができるか。

簡単にデモをシェアできない問題の対策

容易にホスティングできない DEMO を開発者らに共有するときに、わざわざクローンさせる手間の問題の対策

web
share
SVG ファイルのバンドルによる成果物のサイズ増加を防ぐ対策

SVGを動的にインポートしてバンドル対称から外す方法を紹介

web
react
Web開発の節

成長するサービスを開発を継続的に行う上でぶつかる問題と対策を考える

開発
問題
フロントエンドビルドツールのメンテナンス

複数のアプリケーションを抱えている場合や独自のビルド設定が必要な場合の対策

フロントエンド
サーバーサイドのnode_modulesをminifyしてコンテナ化する方法

コンテナイメージの容量削減の方法

minify
Docker
Web開発を行う上で直面する問題一覧

複数人開発や大規模な開発において発生する問題をまとめました。

problems
問題
静的サイトのメンテナンスモード

静的サイトをいかにしてメンテナンスモードを実現するか

web
UIの一時的な状態の保存の実現

UIの状態保存を行うために状態をどこで管理するか。

web
localstorage
Time to Interactiveが長くなる問題と対策

JavaScriptの初期化に時間がかかる問題

初期化
継続
「顧客が本当に必要だったもの」のフィードバック

フィードバックを受けて必要だったものを見つめる。

「顧客が本当に必要だったもの」の改善と撤退

リリースした成果物の改善と撤退について考える。

「顧客が本当に必要だったもの」はどうやって作られるか

顧客が本当に必要だったものを作るための因子を考えてみる。

「顧客が本当に必要だったもの」の事前調査と設計

実現可能性を測るための事前調査と設計について議論する。

「顧客が本当に必要だったもの」を実現するための制約条件

実現可能性を測るためにまずは制約条件を知り、それぞれの条件について議論する。

「顧客が本当に必要だったもの」を思想と五感で見る

サービスの視点から見た思想と五感で必要だったものを提供する。