Diagrams - システム構成図をコードで書く
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 開発者であっても図を描く機会は多いです。仕様書のようなドキュメントであったり、システム構成図の中に書いたりといった具合です。ドローソフトウェアを使ったり、スライド作成ソフトウェアを使ったりしまうが、操作やメンテナンスが面倒でストレスです。 そこで使ってみたいのがDiagramsです。開発者らしく、コードで図を描けます。 Diagramsの使い方 コードで書いた内容で図が書けます。 シンプルな例。 k8sなどの構成にも使えます。 GCP用。 DiagramsはAWS、GCP、k8s、AzureそしてAlibaba Cloud向けにアイコンが用意されています。これらのサービスを作ったシステム構成を考えた時に、Diagramsを使えばメンテナンスもしやすい図が描けます。 Diagrams
管理画面もあるPHP製の認証システム·AuthManager MOONGIFT
AuthManagerは認証およびユーザ管理を提供するシステムです。 Webサイトを作っていて認証はよく必要になります。しかしその度に作っていては面倒に感じることでしょう。そこでAuthManagerを組み入れてみましょう。認証とユーザ管理を一手に引き受けてくれる便利なソフトウェアです。 登録画面です。 ログイン画面です。 ログインしました！アイコンも表示されています。 こちらは管理向け。ユーザ管理画面です。 設定です。 reCAPTCHAの設定です。 AuthManagerの主な機能は指定されたコードを埋め込むことでコンテンツへのアクセスを制限できるようにする、管理画面を使ったユーザ管理、reCAPTCHA対応、Facebookコネクト、メールテンプレート、アクセスログ、Google Analyticsサポートとなっています。 AuthManagerはPHP製のソフトウェア（ソースコード
Yahoo Pipesのような表現やマインドマップにも·jsPlumb MOONGIFT
jsPlumbはWeb上でオブジェクト同士のつながりを表現できるJavaScriptライブラリです。 情報は有機的に結びついています。マインドマップやネットワーク図などを描く際には必ずオブジェクト同士が何らかの連結しあっているでしょう。そんな図をWeb上で描くのに使えるライブラリとしてjsPlumbを紹介します。 Yahoo! Pipesに似た連結です。 アニメーションもできます。 マウスでドラッグして接続もできます。 複雑に結びつけました。 一つのオブジェクトから複数のオブジェクトに派生するデモ。 jsPlumbはレンダリング先としてSVG、Canvas、VMLが選択できます。また、ライブラリとしてjQuery/MooTools/YUI3が切り替えられます。オブジェクトはマウスで自由に場所を変更でき、コネクトしているラインは自動で再描画されます。 jsPlumbはJavaScript製、
クエリの改善に。MySQLのSlow Query Logを可視化する·MySQL slow-query-log Visualizer MOONGIFT
MySQL slow-query-log VisualizerはMySQLの時間のかかるクエリをWeb上で閲覧するソフトウェアです。 MySQLには実行時間の遅いクエリをログファイルに書き出す機能があります。単純にテキストに吐かれるだけなので分析に時間がかかってしまうのではないでしょうか。そこで使ってみたいのがWebブラウザベースの解析ソフトウェアMySQL slow-query-log Visualizerです。 サンプルです。データ量が多くないとあまり面白くないですね。 公式サイトより。曜日ごとに発生回数をグラフ化しています。 クエリログファイルをWebブラウザの画面にドロップするだけで解析処理が行われます。その結果はグラフに描かれる仕組みです。また、クエリは一覧で表示され、任意の文字でフィルタリングすることもできます。曜日と時間によって分析されるので対応すべきポイントが分かりやすくな
1,000のサーバでも監視できるnode.js製死活チェッカー·uptime MOONGIFT
uptimeはnode.jsで作られたWebサーバ死活チェッカーです。 Webサーバがきちんと正常に動き続けているかどうか一番簡単にチェックするのは定期的にアクセスしてレスポンスタイムを見ることです。そんなWebサービスの死活チェックに使えるのがuptimeです。 サーバを立ち上げました。最初に監視するWebサーバを設定します。 URLと監視する間隔を指定するくらいです。 監視を開始しました。グラフは自動更新されないのでご注意ください。 イベントがあればこちらに出力されます。 グラフではなく一覧で結果を確認できます。 徐々にグラフが更新されていきます。 uptimeは1000以上のWebサーバを一括で監視できるパフォーマンスを持っています。またダウンしている際にはWebアラートを表示できます。エラーがあった際にはHTTPステータスやその内容を記録してくれます。サーバはタグを使ってグループ管
IE6から使えるHTML5/JavaScriptによるグラフライブラリ·envision MOONGIFT
envisionはHTML5/JavaScriptによるグラフライブラリです。ファイナンス系グラフ、フラクタルグラフを描けます。 HTML5/JavaScriptを使った高度なグラフライブラリとしてenvisionを紹介します。一般的なグラフというよりも、ファイナンス系のグラフ描画が得意なようです。 リアルタイムグラフ。刻々とグラフが追記されていきます。 タイムシリーズ。指定範囲だけを拡大できます。 こんな感じでマウスで幅を広げたりできます。 ファイナンス。株価、出来高といった指標を表示するのに使えます。 こちらも幅を変更できます。 中央をドラッグすれば左右への移動も可能です。 マウスでポイントにおける数値を表示できます。Ajaxによるデータ変更もサポートしています。 幅の変更ももちろん可能です。 フラクタル画像です。 マウスで範囲を指定して拡大できます。 envisionはHTML5のラ
プロジェクト管理に使ってみたい。jQuery製のガントチャートライブラリ·jQuery.ganttView MOONGIFT
jQuery.ganttViewはjQuery製のガントチャート表示ライブラリです。 jQueryを使ってガントチャートを表示するライブラリがjQuery.ganttViewです。表示だけでなくデータのメンテナンスもできるようになっています。 いい感じにガントチャートが表示されています。 ドラッグでタスクを左右に移動させられます。 期間の変更は枠の端をドラッグします。 データはJSONで与えるだけです。 jQuery.ganttViewは表示系のライブラリなのでデータベースに蓄積された内容をガントチャートにして表示すると言った使い方が便利そうです。なお表示はタスクごとに横に表示される形で、複数のタスクを同一線上に表示することはできないようです。 jQuery.ganttViewはjQuery/JavaScript製のオープンソース・ソフトウェア（MIT License）です。 MOONGI
ここまでやるか。SQLiteをJavaScriptに変換·SQL.js MOONGIFT
SQL.jsはSQLiteをEmscriptenを使ってJavaScript化したソフトウェアです。 SQL.jsはWebブラウザ上で使えるデータベースです。Emscriptenを使ってSQLiteをJavaScriptに変換した面白いソフトウェアです。 デモです。テキストエリアに書かれたSQLを実行できます。 実行した結果です。最終的な結果だけが出力されています。SELECTの結果はJSONデータとして取得されています。 もちろん普通にSQLが使えます。 日本語は出力時は化けてしまいましたがデータ上は問題ないと思われます。 SQL.jsはSQLiteがそのままJavaScriptになってしまったようなソフトウェアです。慣れた使い勝手でSQLを実行したり、データを取得できてしまうのは面白そうです。なお現状Google ChromeやFirefoxにしか最適化されていません。 SQL.jsは
これはnode.jsの時代が来るか！？全て揃ったnode.jsフレームワーク·Tower.js MOONGIFT
Tower.jsはフルスタックのnode.js用Webアプリケーションフレームワークです。 こ、これはやばい…。ついにnode.jsの時代が来るかもしれない、そう感じさせるWebアプリケーションフレームワークがTower.jsです。 インストールはnpmで簡単にできます。 まず新しいアプリケーションを作成します。 Scaffoldで簡単にコントローラ、モデル、ビューを生成。 生成された際の構成はこんな感じです。 towerコマンドのオプションです。 Webサーバを立ち上げ場合です。 Tower.jsはMongoDBをデータベースに、Redisはバックグランドジョブ、CoffeeScriptをメインの記述に使いつつ、Jasmineをテストフレームワーク、jQueryも使えるフレームワークです。メール、マイグレーション、MVC、RailsばりのO/Rマッピング、バリデーション、ルーティング、B
Metro UIをiOS/Androidに移植·TiMetro MOONGIFT
TiMetroはWindows PhoneのMetro UIをTitaniumで再現したモックアップアプリになります。 Windows Phoneが渾身の力をこめて投入してきたUIがMetroです。確かにすっきりとした格好いいインタフェースになっています。そんなMetro UIをTitaniumを使って再現したのがTiMetroになります。 最初にパネルが並んで表示されます。 パネルを選択するとアイテムが一覧されます。アニメーションが格好いいです。 デモ動画です。流れるようなアニメーションが格好いいです。 パネルやメニューをタップして情報を一覧表示するので、ダッシュボード的アプリで使っても面白いかも知れません。情報量が多いアプリにはぴったりです。 TiMetroはJavaScript/Titanium製のソフトウェア（ソースコードは公開されていますがライセンスは明記されていません）になりま
Google製のクライアントサイド、JavaScript製テンプレートエンジン·JsTemplate MOONGIFT
JsTemplateはGoogleが開発したJavaScript製のテンプレートエンジンです。 Webアプリケーションがさらに開発されていくために必要なのが高機能なJavaScriptテンプレートエンジンの存在です。幾つか出てきていますが今回紹介するのはかなり有力です。なぜならGoogleが開発したテンプレートエンジンだからです。それがJsTemplateです。 デモです。左上がテンプレート、右上がJSONの元データになります。 そして左下が実際に生成されたHTMLで、右下がレンダリング結果になります。 idを使ってテンプレート名を定義しています。 こういう風にデータがない場合のチェックもできます。 実際のコードです。jsdisplayのところに検証が入っているのが分かります。 データがある場合はもちろん繰り返し表示します。 実際のコードです。 JsTemplateは再帰処理ができたりev
JavaScriptに便利なメソッドを盛り込んだライブラリ·mofmof.js MOONGIFT
mofmof.jsはJavaScriptを積極的に拡張したライブラリで、Number/Array/Stringに便利なメソッドを追加しています。 JavaScriptは今やWebだけでなく、様々な環境で使われるようになっています。そこで基礎になりえるライブラリとして紹介したいのがmofmof.jsです。かゆい所に手が届く、便利なメソッドがたくさん追加されています。 コード例です。コピーメソッド。 日付周りの拡張も多いです。 Hashを取り扱うメソッドも多数用意されています。 二つのHashをミックスします。 Hashからキーと値を取り出します。 Hashのキーだけを抽出します。 mapメソッドです。 実行するたびにインクリメントされるユニークな値を返します。1秒間に100万回実行したとしても285年間ユニークであり続けます。 一気に配列を生成します。 文字列を置換しつつ生成します。 検索メ
PHPのさらなる利用者増を目指し再定義する·PHP.reboot MOONGIFT
PHP.rebootはJVM上で動作するPHPを再定義したプログラミング言語です。 PHPは恐らくWebサイトにおいて最も良く使われている言語でしょう。習得も容易で、手軽に色々なWebアプリケーションが作れる、そんな利便性の裏で言語仕様などについて毛嫌いされる声も聞かれます。そこで注目したいのがPHPを再定義するPHP.rebootです。 PHP.rebootの書き方です。< ?phpではなく、{}を使ってコードを埋め込みます。まさにテンプレート的です。ファイルの拡張子はphprになります。 実行結果はもちろん普通に表示されます。 サーバ、GET/POSTも使えます。面白いのは変数名に$をつけず、JavaScriptのように定義することでしょう。;も使いません。 実行結果はこのようになります。 基本的な文法はPHPと似ています。SQLとの親和性を高くしており、コードの中にSQLをそのまま埋
これでVisioを使ったネットワーク図作成からおさらば？運用まで管理できる·Prime MOONGIFT
Primeはハードウェア構成やソフトウェアも含めたネットワーク図を作成するソフトウェア。 PrimeはJava製のオープンソース・ソフトウェア。システム開発を行う際にデスクトップやルータ、サーバ等の配置を図に起こす時は多い。そういう時にドローソフトウェアとしてMS Visioを使うケースが多いのではないだろうか。他にも類似ソフトウェアはあるが、アイコンがどうも好きではなく結局Visioを使っていた。 描画中 しかしネットワーク図を描くためだけにMS Visioを購入するのではあまりにも勿体ない。デザインに優れたソフトウェアがあればそれを使えるはずだ。そこでネットワーク図を描く際にお勧めしたいのがPrimeだ。 Primeはデスクトップやサーバ、ネットワーク機器を配置してそれらを線で結んでネットワーク図を作成するソフトウェアだ。端末間の接続法をRJ45またはUSBから選べるなど芸が細かい。さ
PowerPointを使ってプロトタイプを作ろう·PowerPoint Prototyping Toolkit MOONGIFT
世の中には何でもPowerPointでやらないと気が済まないという人たちがいる。Excel使いがそうであるように、PowerPoint使いがいるのだ。余計なソフトウェアを購入するよりはよっぽども良いが、再利用性のない方法をとられても困る気はするのだが…細かいところは気にしないでおこう。 PowerPointを使ってアプリケーションの画面を作る そんなPowerPointウィザードな方々に送る、プロトタイプ作成ツールキットがPowerPoint Prototyping Toolkitだ。 今回紹介するフリーウェアはPowerPoint Prototyping Toolkit、PowerPointを使ってアプリケーションのプロトタイプを作成するツールキットだ。 PowerPoint Prototyping Toolkitは画面や画面を構成するオブジェクトを作成し、PowerPoint2007の
便利！jQueryのアクションをビジュアル的に作成する·IxEdit MOONGIFT
jQueryを使って画面のアクションを作ろうと思うと、そのコーディングの仕方を含めて習得する必要がある。イベントにもマウスやフォーカス、クリックなどの様々な種類が存在し、その結果として起こすアクションも無数に存在する。それらを適切に判断しながら構築するというのは意外と難しい。 jQueryを使った開発にぜひ！ 単純なJavaScriptであれば、オーサリングツールで対応しているものもある。だがjQueryのような高度なJavaScriptフレームワークには対応していない。そこで使うのがIxEditだ。 今回紹介するオープンソース・ソフトウェアはIxEdit、jQueryのビジュアルアクションビルダーだ。 IxEditは既に組み上がっているWebサイトに対して使うライブラリだ。指定されたJavaScriptファイルとCSSを読み込むと、Webサイトにフローティングウィンドウが表示される。そし
WebベースのMySQL管理インタフェースの新参·SQL Buddy MOONGIFT
MySQLをWebベースで管理しようと思ったら一番に思い当たるのがphpMyAdminだろう。ユーザの作成やデータベースのパラメータの変更など、必要な操作が殆どできてしまう。これがあれば他の管理インタフェースが出てくる出番はまずない。 データ構造の確認 ずっと同じものを使うのは利点もあるが、欠点もある。使わずとも代替えの存在は知っておくべきだろう。そこでこれだ。 今回紹介するオープンソース・ソフトウェアはSQL Buddy、WebベースのMySQLフロントエンドだ。 SQL BuddyはphpMyAdmin同様にPHPで作られたソフトウェアで、PHP4.3以上で動作する。特に設定はせずに設置すればすぐに利用できる手軽さが売りだ。データベース、ユーザ、テーブルなどを管理することができる。 全てのテキストを表示 データベースとテーブルはツリーになって表示されるのだが、テーブルの横に存在するレコ
クローラーを作るためのフレームワーク·Anemone MOONGIFT
RSSフィードやWeb API、Mashupなどの単語が注目を集める中、Webクローラーを通じて外部のWebサイトにあるデータをかき集め、それを解析して別な形にするというのはよく見られるものになってきた。 あるURLを指定し、そこからリンクされているURLを一覧表示できる そうした数々のシステムの中で、クローラーとなる基盤は大きな違いはない。Webサイトのデータを取得し、次のリンクを洗い出して取得していくようなものだ。そうした共通動作部分を切り出したフレームワークがAnemoneだ。 今回紹介するオープンソース・ソフトウェアはAnemone、Webクローラを開発するためのフレームワークだ。 Anemoneは任意のWebサイトにアクセスし、その内容を解析するWebクローラーだ。例えばあるURLに付けられているリンクを一覧で取得するようなことも簡単にできる。外部サイトなのかどうかも区別できるの
カヤック製、ブログパーツフレームワーク·suzunari MOONGIFT
実践に勝る訓練はない、と言われる。机上の空論や理想論では心には響かない、確かな経験があるからこそ重みが増していくものだ。ソフトウェアについても同様で、本当の意味で役立つものは、実際に運用で使われて培われてきたものばかりだ。 Old versionとのことですが、左側に表示されているのがブログパーツ ブログのサイドバーなどに貼付けるブログパーツ。そのブログパーツを効率的に開発、提供するためのフレームワークがsuzunariだ。 今回紹介するオープンソース・ソフトウェアはsuzunari、Flash + JavaScriptによるブログパーツフレームワークだ。 suzunariの開発元であるカヤックではブログデコというブログパーツポータルを運営している。そして以前に話題になった剣道ブログパーツをはじめ、多数のブログパーツを開発している。そこで培われたノウハウを集約したのがsuzunariだ。
MOONGIFT : jQueryベースのカレンダープラグイン「FullCalendar」 オープンソース・ソフトウェア/フリーウェアを毎日紹介
スケジュールソフトウェアに対する需要は意外と多い。グループウェアのような多彩な機能をもつものではなく、ただiCalファイルを読み込んで表示するだけのものといったシンプルな使い方ができるものに対する需要がある。 ドラッグアンドドロップでスケジュールを変更できるカレンダー ただ表示するだけなら問題ないだろうが、そこにちょっとした編集機能を付けるとなると面倒になる。そこで試したいのがFullCalendarだ。 今回紹介するオープンソース・ソフトウェアはFullCalendar、jQueryベースのAjax対応カレンダープラグインだ。 FullCalendarはその名の通り、フルサイズで提供されるカレンダーシステムだ。とは言え実際にはCSSで幅を制御しているので、小さなサイズにすることもできる。JavaScriptベースで、次の月/前の月への移動がページ遷移なしで行える。 サイズを小さくすること
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
