開発の記事一覧
Copenhagen - 高機能なWeb埋め込み型プログラミングエディタ
Web上でユーザにコードを書いてもらう機能を用意するとします。その際、ただのテキストエリアを配置するのは良くありません。ハイライトもありませんし、Tabキーを押すと別なコントロールにフォーカスが移動したとしたら、使う気も失せてしまいます。Webページに埋め込める高機能なエディタが欲しければ、Copenhagenの利用を...
DataAnalyzer.app - JSON/CSVから各種言語向けのスキーマを生成
Web APIを使った開発時において、JSONを解析して他の言語向けに構造化することがよくあります。定型作業なので、毎回行うのが面倒だったりします。JSONは柔軟なフォーマットですが、スキーマを用いずに使えるので、こうした手間が発生します。そこで使ってみたいのがDataAnalyzer.appです。JSONから各種言語...
Source Map Visualization - Source Mapファイルの可視化
Source MapはWebフロントエンドを開発している際にブレークポイントを入れたり、エラー箇所を見やすくするのに使われています。コードがミニファイされていたりして分かりづらいJavaScript、CSSファイルがSource Mapによって分かりやすくなります。そんなSource MapをビジュアライズするのがSo...
ijq - インタラクティブに使えるjq
Web APIを使った開発ではJSONがデータ送受信フォーマットとしてよく使われます。その際にJSONの構造を調べたり、可視化する際にjq
EStimator.dev - モダンなJavaScriptにすればどれくらいパフォーマンスが向上するか
JavaScriptの書き方は年々変わってきています。モダンになるにつれて省略した書き方もできるようになり、よりコード量を減らせるようになっています。サイズが小さくなればダウンロードサイズも減り、よりパフォーマンスが高くなるでしょう。今回紹介するEStimator.devは旧来のJavaScriptをモダンな書き方にす...
gron - JSONをコード化して検索しやすくするコマンド
JSONはシステム開発で多用されています。それだけにJSONを扱いやすくするツールがあれば、それだけで生産性が上がることでしょう。システムから出力したJSONを検索したり、目的通りにデータが入っているか確認する機会は多いはずです。そんな時に使えるのがgronになります。JSONを検索するのに便利なコマンドです。## g...
Snapcode - Webベースのスニペット管理
プログラミングをしていると、繰り返し使いたくなる便利な関数ができたりします。そうした関数は同じプロジェクトではなく、異なるプロジェクトでも使いたくなるでしょう。今回はそうしたちょっとしたコードを管理する、Webベースのスニペット管理であるSnapcodeを紹介します。## Snapcodeの使い方メイン画面です。タグと...
LogBox - 開発者ツールを開かずにエラーを補足する
Webサイトを訪問していて何かJavaScriptのエラーなどが起こった際、開発者ツールを立ち上げる必要があります。逆にいえば、開発者ツールを開いていないとエラーに気付かない可能性もあります。これは開発者にとっては面倒な一手間です。今回紹介するLogBoxは開発者ツールを開かずにエラーを報告してくれるGoogle Ch...
Object Visualizer - Web上のJSONビューワー
JSONがWeb APIのフォーマットとして使われるようになり、複雑なデータも作られています。そうした内容を確認する際に開発者ツールは便利です。一部だけ展開したり、折りたたんだりできます。そんなJSON閲覧機能をWebブラウザ上で実現するのがObject Visualizerです。## Object Visualize...
Trex - deno用のパッケージ管理
新しいJavaScript実行環境であるdenoでは、パッケージ管理を行いません。ネットワーク上からのファイルも読み込み可能で、実行時に取得します。これは便利な仕組みですが、場合によってはパッケージ管理したいでしょう（特にバージョンを固定化したい、キャッシュしたい場合など）。そこで使えるのがTrexです。JSONファイ...
Anvil - PythonだけでWebアプリケーションを作る実行環境
Webアプリケーションを作ってリリースするまでには幾つものステップがあります。プログラミング以外にも色々なことをしなければなりません。例えばフロントエンドのUIもそうですし、サーバ周りの準備もあります。今回紹介するAnvilはPythonだけでWebアプリケーションを開発できるフレームワーク/エンジンになります。## ...
Live.js - JavaScriptを読み込むだけで使えるライブリロードライブラリ
Webサイトを開発している時には、その修正内容を素早く確認したいはずです。ライブリロードやホットリロードといった技術もありますが、専用のサーバなどを用意するのでちょっと手間です。そこで使ってみたいのがLive.jsです。JavaScriptを読み込むだけで使えるライブ/ホットリロードを実現します。## Live.jsの...
AnyGrids - 高機能なテーブル表示ライブラリ
業務システムで最もよく使うのが一覧でのデータ表示ではないでしょうか。多くはテーブルタグを使って構築しますが、ソートや表示するデータの多様さによって、より多機能を求められます。今回紹介するAnyGridsはビジネスデータの表示に特化したライブラリとなっています。業務システムでのデータ表示に一役買ってくれそうです。## A...
LightProxy - ネットワークをキャプチャ。Web開発用プロキシ
Webアプリケーションやスマートフォンアプリの開発時に、ネットワークのやり取りを確認したいことがあります。その手のソフトウェアとしてCharlesが知られていますが、有償であるために避けている人もいるかも知れません。そんな方に使ってみて欲しいのはLightProxyになります。Charles同様、ネットワークをキャプチ...
ControlRoom - Apple用アプリ開発のシミュレーションを一括管理
iOSやiPadOSなどのアプリを開発している時にはエミュレータを利用します。エミュレータには位置情報をダミーで送ったり、ネットワーク速度を変更したりする機能が用意されていますが、メニューから都度変更するのが面倒です。そこで使ってみたいのがControlRoomです。エミュレータの動作設定をGUIから簡単に行えます。#...
GitHub CLI - GitHub製のPR/Issue管理ツール
Gitはバージョン管理を行うためのCLIであり、個人の開発であればGitコマンドだけで事足りるでしょう。複数人になるとPRやIssueといった機能が必要になり、そのためにGitHubにアクセスする人も多いはずです。そこで使ってみたいのがGitHub CLIです。PRとIssueに関して管理が可能なGitHub製のCLI...
massCode - マルチプラットフォームで使えるスニペット管理
開発をしていてプロジェクトをまたいで繰り返し使うようなコードはスニペットとして登録しておくと便利です。ライブラリ化するまでもないコードだったり、Webブラウザの開発者ツールで頻繁に実行するコードもスニペットにしておくと便利です。今回紹介するmassCodeはマルチプラットフォームで使えるスニペット管理となっています。#...
gore - 入力補完も可能なGo用のREPL
プログラミング言語を学習する際に対話的にコードとその結果を確認できるREPLの存在は欠かせません。RubyやPython、PHPなどスクリプト言語であれば大抵用意されています。JavaScriptであれば開発者ツールを使うことが多いでしょう。そんな中、Go言語で使えるREPLがgoreです。入力補完も可能なソフトウェア...
CuteUID - かわいいユニークIDを生成
ユニークなIDを生成したいと考えた時、どんな方法を使うでしょうか。大抵各言語向けに用意されたUUID生成ライブラリを使うと思います。それを使えば数字だけ、または英数字を絡めたIDが生成されます。しかし、そんなIDに楽しさが感じられない、そう思う方はCuteUIDを使ってみましょう。## CuteUIDの使い方CuteU...