opn-cli - コマンドからリンクやファイルを開く
macOSにはopenコマンドがあります。これは便利なコマンドで、ファイルやURLを渡せば適切なソフトウェアで開いてくれます。しかし簡単に使える反面、細かなカスタマイズはできません。 さらに他のプラットフォームでも使ってみたいという方は多いかと思います。そこでインストールしたいのがopn-cliです。 opn-cliの使い方 コマンドはopnになります。便利なのはアプリケーションを指定できることで、普段使っていないブラウザでURLを開くこともできます。 $ opn http://sindresorhus.com -- 'google chrome' さらに文字列をWebブラウザで開くなんてこともできます。 opn-cliは多くの拡張子に対応しており、そのファイルを扱えるソフトウェアでファイルを開いてくれます。文字列は適切なmimeTypeを判断し、アプリケーションを振り分ける仕組みです。
Diff Cam Feed - Webカメラを使ったモーションディレクト&Twitter投稿
Webカメラを使うと手軽にセキュリティカメラを実現できます。大事なのは物体の動きがあった時にちゃんとそれを捉える機能と、その後どこかに通知する機能ではないでしょうか。 そんな機能を実現してくれるのがDiff Cam Feedです。Webカメラを使ってモーションディテクションを実現しつつ、スナップショットをTwitterに投稿します。 Diff Cam Feedの使い方 動作デモです。動かすとその差分が緑のドットで表現されます。 実際に動かしているところ。リアルタイムに解析されています。 モーションが判定されると、それが予め連携しているTwitterアカウントに投稿されます。自分のアカウントでも良いでしょうし、別なアカウントで監視目的に使っても良いのではないでしょうか。 Diff Cam Feedはnode/JavaScript製のソフトウェア（ソースコードは公開されていますがライセンスは明
image-diff - 画像の差分表示
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 開発者であれば差分表示に普段からお世話になっているでしょう。コードのどこを直したのか、どこが削除されたのかなどはDiffを使わなかったら目で探すことになってとても大変です。そして、それはテキストだけではありません。 今回紹介するオープンソース・ソフトウェアはimage-diff、画像で差分表示を行ってくれるライブラリです。 image-diffの使い方 一つ目の画像です。 二つ目の画像です。 差分を取ると、このような画像が生成されます。 image-diffは二つの画像と、その差分となる画像の3つの引数で実行されます。プログラムの中に組み込むこともできます。異なる部分が赤く表示されるので、どこが変わっているのかは一目瞭然でしょう。デザイナーの方などは必須のツールになるのではないでし
md2googleslides - MarkdownファイルをGoogleスライドに変換
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 最近、Markdownファイルで作成してHTMLプレゼンに展開するソフトウェアが増えています。便利なのですが、ちょっとしたアニメーションを追加したいなど既存のプレゼンソフトウェアで最後の仕上げをしたいこともあるでしょう。 そこで使ってみたいのがmd2googleslidesです。MarkdownファイルをGoogleスライドに展開してくれるソフトウェアです。 md2googleslidesの使い方 変換したスライドです。日本語も使えます。 背景画像を指定することもできます。 テーブル表示も行えます。 md2googleslidesでは他にも動画の埋め込みやコードの表示も行えます。Markdownを使ってコンテンツを作成し、後はmd2googleslidesでGoogleスライドに載
Certificate Dashboard - 証明書期限が一覧できるダッシュボード
SSL/TLS証明書の管理は面倒です。ついつい更新を忘れてしまってエラーが出たという経験は誰もがあるのではないでしょうか。大手のSSL事業者であればリマインダーメールもくれますが、これもスルーされがちです。 今回はWebブラウザで証明書の期限をチェックできるCertificate Dashboardを紹介します。 Certificate Dashboardの使い方 Certificate Dashboardのトップページです。ドメインは環境変数で指定できます。 22日後ということなので更新しました。 Certificate Dashboardを使えば証明書の期限をいつでも簡単にチェックできます。色分けもされるので赤くなったら更新するようにしましょう。 Certificate Dashboardはnode/JavaScript製のオープンソース・ソフトウェア（MIT License）です。
Winds - 個人の興味に合わせたフィードリーダー
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました フィードリーダーを使っている人はあまり多くないと思いますが、個人的にはまだまだ現役で使っています。効率的に多くの情報を収集しようと思うと、フィードリーダーが最適ではないでしょうか。 今回はそんなフィードリーダーの最新版、Windsを紹介します。エレガントなデザインが特徴です。 Windsの使い方 最初に興味のあるカテゴリを購読します。 記事の一覧です。空白が大きい、すっきりとしたデザインが特徴です。 購読しているフィードの一覧です。 WindsはGetStream.ioのサンプルソフトウェアで、個人の興味に合わせてコンテンツを最適化するというAPIが使われているようです。フィードを探す必要がなく、興味のある情報が入ってくるなら便利かもしれません。 技術的にはReact/Redux/
Scribe.js - nodeのログをカラフルに、かつWebブラウザ上で確認 MOONGIFT
最近Nodeで開発することが増えてきたのですが、標準出力に出てくるログはあまり見やすくありません。目的のデバッグメッセージがどこに出ているのか確認が面倒で、ターミナル上では検索もままなりません。 そこで使ってみたいのがScribe.jsです。ログを格好良く、見やすくしてくれます。 Scribe.jsの使い方 ログがWebブラウザで見られるようになります。左側がグループを選択できるようになっています。 Expressのログだけに絞り込み。 検索で絞り込みもできます。 Scribe.jsはカラフルなだけでなく、絞り込みもできるので開発時のログ確認がとてもスムーズになります。エラーなどログを分けておけばScribe.jsでの表示場所も変わるので分かりやすいでしょう。 Scribe.jsはnode/JavaScript製のオープンソース・ソフトウェア（MIT License）です。 Scribe.
moji - JavaScriptによる全角/半角の文字種変換 MOONGIFT
Webの入力フォームでイライラさせられるのは半角、全角の判定ではないでしょうか。データベースに入れる際にデータを統一したいだけで、利用者に対して苦痛を押しつけています。解決する手段など幾つもあるにも関わらずです。 今回はJavaScriptによる文字種変換ライブラリ、mojiを紹介します。 mojiの使い方 mojiはnpmでインストールできます。後は以下のように使います。 > var moji = require('moji'); undefined > moji('ＡＢＣＤ０１２３４').convert('ZE', 'HE').toString(); 'ABCD01234' > moji('ABCD01234').convert('HE', 'ZE').toString(); 'ＡＢＣＤ０１２３４' > moji('アイウエオ').convert('ZK', 'HK').toStrin
wzrd.in - Browserifyをサービス化 MOONGIFT
最近では多数のJavaScriptライブラリを使うのが当たり前になっています。そうした時に一つ一つのライブラリをscriptタグで読み込むのは大変であり、Browserifyを使って一つのファイルにまとめてしまうのが便利です。 今回はそんなBrowserifyをWeb上のサービスとして提供するwzrd.inを紹介します。 wzrd.inの使い方 wzrd.inの例です。以下のように読み込むライブラリを指定してPOSTメソッドで投げるとJavaScriptファイルが取得できます。 { "options": { "debug" : true }, "dependencies": { "concat-stream": "0.1.x", "hyperstream": "0.2.x" } } さらにWeb APIではGETによる取得もサポートしており、wzrd.in上で生成されるファイルをそのままs
Kap - Web技術を使ったスクリーンキャスト
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました ソフトウェアのデモ動画を作成する際などにスクリーンキャストが便利です。昔はあまり良い選択肢が多くなかったのですが、今では多くのソフトウェアが存在します。Mac OSXであれば標準でインストールされているQuickTimeで録画することもできます。 今回紹介するKapはオープンソースのスクリーンキャストソフトウェアで、Web技術で作られているのが特徴です。 Kapの使い方 起動するとメニューバーに常駐します。そこからボタン一つで録画、停止を切り替えられます。 録画した動画をアニメーションGIFに変換しました。マウスカーソルが表示されるタイプです。 Kapは録画する範囲を指定できます。記録と停止がボタンのクリック一つで切り替えられるので、ごく簡単に使えます。複雑な機能はありませんが、多
Excel Builder.js - node製のExcelファイル生成ライブラリ MOONGIFT
業務システムを開発していて度々ニーズがあるのがデータのエクスポートです。多くの場合、CSVファイルで出力されますが、数値や日付の型も指定できませんし、ユーザビリティは高くありません。 そこで実現したいのがExcelフォーマットのサポートです。今回はnodeで実現できるExcel Builder.jsを紹介します。 Excel Builder.jsの使い方 Excel Builder.jsで生成した例です。 実際ここまでのコードを生成するのは行数も長いのですが、フィルタが予めついていたり、データが右寄せになっていたりします。数値はちゃんと右寄せになっていて、型も指定できるのが分かります。Excel Builder.jsを使えばこだわったExcelファイル出力も容易でしょう。 なお、JavaScriptで生成はしますが、Webブラウザ向けではなくサーバサイド（node）で使うライブラリになりま
Texture - シンプルながらも構造化された文章を作成できるWebワードプロセッサ MOONGIFT
最近のエディタはとてもリッチで高機能になるか、Markdownのように記法に沿うことでとても簡単に書けるかの二極化されているように感じます。しかし、Markdownではちょっと物足りず、とは言え簡単に書けるエディタが欲しいと思うのではないでしょうか。 今回はそんな可能性を見せるWebベースのワードプロセッサ、Textureを紹介します。 Textureの使い方 Textureの画面です。左側がエディタ、右側にアウトラインが出ます。 文字の装飾ができます。 見出しなどの設定ができます。 リファレンスという単位で情報をまとめられます。 情報に対してタグをつけるという仕組みになっています。 TextureのコンセプトはLaTeXのように開かれた、それでいて昔のワードプロセッサのようにシンプルに、です。多機能化が進んでいくと使わない機能がどんどん増えていきます。Textureはそのバランスを維持し
Gistfy - GitHub/Gist/BitBucketに対応したコード埋め込みツール MOONGIFT
ちょっとしたコードをシェアするのに便利なのがGistです。外部サイト用に埋め込みコードも生成できるので、ブログ記事のために使っている方も多いでしょう。対してGitHubは埋め込みできず不便です。 そこでGitHubやGistでも、さらにBitBucketまで対応したコード埋め込みサービスGistfyを使ってみましょう。 Gistfyの使い方 実行例です。埋め込める形でコードが表示されます。 表示する行数を指定できます。 カラーテーマの変更も可能です。 シンタックスを別なものにもできます（デフォルトは自動で決定します）。 Gistfyが対応しているのはGitHub、GistそしてBitBucketです。認証不要で使えますが、パブリックなリポジトリでしか使えないので注意してください。カラースタイルを変えたり、シンタックスの変更、表示する行の指定（一部の行だけ表示できます）が可能です。 Gist
DataCamp Light - 自分のサイトで使えるインタラクティブな学習プラットフォーム MOONGIFT
プログラミングはコンピュータさえあればすぐにはじめられます。しかし、環境のセットアップであったり、チュートリアルなどもない状態では最初の一歩を踏み出すのがとても大変です。 そこで使ってみたいのがDataCamp Lightです。自分のWebサイトをインタラクティブな学習プラットフォームにできるソフトウェアです。 DataCamp Lightの使い方 DataCamp Lightはサイト上に埋め込んで使います。 今のところPythonまたはRに対応しているようです。実行すると右側に結果が表示されます。 期待した記述がされているかどうかのチェックもできます。 間違っている場合はどう書くべきかを指導してくれます。 DataCamp Lightを使えばWeb上でプログラミング言語を自己学習できるプラットフォームが作れるでしょう。書籍などを読むだけでない、より自分で書いて結果を実感できる学習環境にな
React Server - Reactの開発をはじめるのに最適なベースを生成
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Reactを触りはじめて思うのが、フレームワークのスタンダードが確立されていないということです。React自体はViewなので、それ以外の部分やアプリケーションサーバをどうすべきかといった部分が抜け落ちています。 そうした点で迷っている方はReact Serverを使ってみてはいかがでしょう。React Serverを使えばReactを使った開発環境周りの整備が一気に進むでしょう。 React Serverの使い方 React Serverをインストールした後はyeomenのコマンドで起動します。 yo react-server 後は npm run start でサーバが立ち上がります。 ボタンをクリックすると「！」が増えます。 ファイル構成は次のようになっています。 ベースにな
ReDoc - Swagger/OASを使ったWeb APIドキュメントジェネレータ MOONGIFT
開発者向けドキュメントの基本と言えるのがAPIドキュメントです。ライブラリだけでなく、最近ではWeb API向けのドキュメントも増えてきました。そのデファクトフォーマットになろうとしているのがSwagger/Open API Specification(OAS)です。 今回紹介するReDocはそんなSwagger/OASをベースにAPIドキュメントを生成するソフトウェアです。 ReDocの使い方 デモです。3カラム構成になっています。一番右側にJSON構造が書かれています。 スキーマが見やすくなっており、折りたたむこともできます。 右側のレスポンスについても折りたためますので見たいところだけをチェックできます。 SwaggerにはSwagger UIというビューワーがありますが、ReDocも負けず劣らず見やすいドキュメントではないでしょうか。公開されているJSONで自由に試せますので（CO
Kajero - JavaScriptがその場で実行できるドキュメントシステム
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Markdownを使うようになって、逆にその物足りなさを感じるのではないでしょうか。色が使えなかったり、装飾も限られたものしか使えません。その制限がちょうど良いのかも知れませんが、もっと高度なドキュメントにしたいという要望もあります。 しかしプログラマーであるならば制限されているそのものを使い続けるのではなく、自分で拡張だってできるはずです。今回はインタラクティブなドキュメントを実現するKajeroを紹介します。 Kajeroの使い方 こちらがドキュメントのページです。通常のMarkdown記法が使えます。 こちらが特殊な部分。コードが書いてあります。 右上の再生ボタンをクリックするとJavaScriptが実行されて結果が表示されます。 複数ある場合、変数が共有されます。 実行時間
Lever OS - サーバレス×マイクロサービスなWebアプリ実行環境 MOONGIFT
マイクロサービス、サーバレスアーキテクチャといったキーワードが盛んに言われるようになっています。確かにサーバレスアーキテクチャは小さなサービスを作るのに都合がよく、それらを合わせるとマイクロサービスとして成り立つかも知れません。 そんな2つを合わせて作られているのがLever OSです。まだ開発途中とのことですが、大きな可能性を秘めていそうです。 Lever OSの使い方 Lever OS自体はDockerでデプロイできます。起動したら例えばフォルダを作成し、その中にserver.jsとして次のようなコードを書きます。 module.exports.sayHello = function (name, callback) { callback(null, "Hello, " + name + "!"); }; そして lever.json というファイルを作成します。 { "name":
Weex - アリババ製のモバイルUIフレームワーク
スマートフォン用にWebサイトであったり、ハイブリッドアプリを提供する際には専門のUIフレームワークが欠かせません。デスクトップWebブラウザ向けとは異なるUI/UXが求められるためです。しかしそういった実装は簡単ではありません。 そこでUIフレームワークが重宝します。今回はアリババ社が作ったWeexを紹介します。 Weexの使い方 Weexでは多くのショーケースが登録されています。 マインスイーパのようなゲーム、計算機、さらに各種アニメーションもサポートされています。一般的なハイブリッドアプリはもちろん、ユーティリティ的なツールも作れそうです。 WeexではJavaScriptやHTMLを一つにまとめたtemplateと呼ばれる単位で開発を行います。Webコンポーネント的な考え方なのかも知れません。その中でアニメーションを実行したり、ページ切り替えを行うといった仕組みです。 Weexはn
AzerothJS - サーバサイドのコードを持たない静的サイトジェネレータ MOONGIFT
GitHub Pagesを使えば手軽にWebサイトを公開できます。静的なコンテンツのみですが、ローカルでコンテンツを作ってアップロードするような使い方であればブログやプロジェクトサイトは十分に作れます。 今回はそんな静的サイトを生成するAzerothJSを紹介します。シンプルな作りで、カスタマイズ性が高いのが特徴です。 AzerothJSの使い方 デモサイトです。 ソースコードのハイライトもできます。テーマは幾つか用意されています。 AzerothJSは独自のサーバ機能は持っておらず、Pythonなどのワンライナーを使うように指定されています。そして、コンテンツはMarkdownで作成し、開発中はMarkdownをダイナミックに読み込んで表示しています。 サイトができあがったらgenerator.jsを実行し、HTMLファイルが生成される仕組みです。テンプレートなどもシンプルなので、カスタ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
