ごく簡単にVPN環境が作成できると話題になったSoftEtherVPNがついにオープンソース化されました。独自のVPN網を構築しているといった印象があったのですが、その他にも以下のプロトコルに対応しています。 SSL-VPN OpenVPN IPsec L2TP MS-SSTP L2TPv3 EtherIP プラットフォームはWindows/Mac OSX/Linux/FreeBSD/Solarisに対応しています。また、クライアントであればAndroid/iOSもVPN接続が可能です。Mac OSXやLinuxではGUIの設定画面はありませんが、以下のコマンドでVPNサーバが起動します。 $ ./vpnserver start SoftEther VPN Server Service Started. 起動中。 Mac OSXであればネットワークの設定でVPNを追加して接続できます。 セ

これは要導入検討ですね。 Webアプリケーションをセキュアに開発するのは基本ですが、それでも人が作るものである以上バグを含んでしまうのは致し方ありません。そこで未知の不具合を含めて防衛するための手段を考えなければなりません。 その一つとして、さらに外部からのアタックに対して考えられる手段がWebアプリケーションファイアウォール、通称WAFです。各種Webサーバに組み込めるオープンソースのWAF、それがModSecurityです。 デモが用意されておりインジェクションを起こそうと試みることができます。 特徴 ModSecurityの特徴として、多彩なWebサーバに対応しているというのがあります。Apache/nginx/IISサーバに対してインストールが可能です。また、以下のような特徴があります。 HTTPトラフィックのロギング 通常、Webサーバのログではリクエストボディは保存されません。

MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました WebアプリケーションはAjaxを多用するので処理状態を分かりやすくためローディングアイコンを使うと良いでしょう。通常その手のリソースにはアニメーションGIFが使われますが、色やサイズを変えたいと思う度に素材を作らないといけないのは不便です。 そこで新しいローディングアイコンを提供してくれるのがLoaders Kitです。なんとCSS3を使って多彩なローディングアイコンを提供しています。 画像では分かりづらいので動画にて。 実際の使い方ですが、例えば左上のタイマーの場合は次のようなスタイルシートになっています。 /* Timer*/ .timer{ width: 24px; height: 24px; background-color: transparent; box-shado

GitHubは各自がリポジトリを持つ分散型ソースコード管理システムになっています。そして各自が差分を受け取ることでコラボレーションを実現しています。 同じような仕組みをデータについても行おうとしているのがDatです。まだはじまったばかりのプロジェクトではありますが非常に興味深いソフトウェアになります。 インストールはnpmを使って行いますので簡単に完了します。 $ npm install dat -g インストールが完了したら、最も基本的な使い方を試してみます。 $ mkdir foo $ cd foo $ dat init これで初期化が終わります。Gitに似ていますね。次にデータを追加します。 # 一例 $ echo '{"hello": "world"}' | dat --json # CSVからも可能 $ cat some_csv.csv | dat --csv データの読み込みは

HTML5の普及によって各ブラウザの描画、動作誤差は昔に比べれば減ると思われたものの、機能が増えたことによってその実装状況は大きく違うといった状況になっています。 さらにデスクトップとスマートフォンで同じHTML5といっても違いが生じています。そんなHTML5のサポート状況を見える形にしてくれるのがDetectorです。 まずはユーザエージェントに関する情報が出力されます。 さらにCSS3の機能についてサポート状態が表示されます。 Chromeでも意外と完璧ではないようです。 Detectorではクライアントの判定をサーバサイドで行っています。予め用意されているテストの他、自分で独自のテストを追加することもできます。HTML5の機能について、多数のブラウザではどのように処理されるのかをテストするのにも使えます。 HTML5と一口に言っても対象になるデバイスは多数あります。サポート対象のブラ

TogetherJSはJavaScript製、Mozilla Public Licenseのオープンソース・ソフトウェアです。 Webアプリケーションをリアルタイムコラボレーション化しようと思うとサーバサイドの様々な仕組みを開発しないといけません。そこで頓挫してしまう人も多いでしょう。しかしTogetherJSを使えばチャット及びコラボレーション機能があっという間に手に入ります。 Todoアプリの例。右側に出ている部分がTogetherJSです。 マウスボタンにユーザ名が出ています。 チャットもできます。 複数人の表示に対応しています。 TogetherJSではテキストチャットの他、動画や音声チャットも提供しています。さらに同じドメイン中における別なURL閲覧を確認したり、コンテンツの変更をリアルタイム同期もできます。何よりTogetherJSを読み込むだけで実現できるという手軽さが良いで

これはインパクト大！が、多用は禁物なようです。 動きのあるWebサイトは目を引きます。Flashや画像を使ったアニメーションは多いですが、jQuery Lively LayoutはさらにWebサイト自体をアニメーションさせてしまうという凄いソフトウェアです。 何はともあれまずは動画を見てもらうのが良いと思います。 ということで凄さは分かってもらえたと思いますので使い方です。まずJavaScriptファイルを読み込みます。 <script type="text/javascript" src="/path/to/jquery.js"></script> <script type="text/javascript" src="/path/to/jquery.easing.js"></script> <script type="text/javascript" src="/path/to/jqu

OAuth daemonはnode/JavaScript製のオープンソース・ソフトウェア（GNU Affero General Public License）です。 OAuth.ioはフロントエンドエンジニアにとっては便利なサービスと言えますが、セキュリティ的にはOAuthの概念を覆してしまう問題があります。そこでOAuth.ioのコア部分を取り出してオープンソース化したOAuth daemonを使ってみましょう。 管理画面です。まず最初に管理者アカウントを設定します。 次にアプリケーションを作成します。複数作成が可能です。 ドメインも複数指定できます。 そしてプロバイダごとにキーの設定を行います。 例えばこんな感じです。 Tumblrなどになるとどこに設定を行うべきかのヘルプもあります。分かりやすいです。 クライアントID、シークレットを設定します。 その場で試すことができます。認証ダイ

Table-to-JSONはjQuery/JavaScript製のオープンソース・ソフトウェア（MIT License）です。 先日、JSONからテーブルを自動生成するTablerを紹介しましたが、今回はその逆です。テーブルタグからJSONを生成するTable-to-JSONを紹介します。 デモのテーブルです。Convertボタンを押します。 ダイアログが表示されます。確かにJSONデータで取り出せています。 Table-to-JSONではオプションとして指定したカラムを省く（またはそれだけにする）ことや、非表示な行は省くといった指定ができます。テーブルタグのデータを再利用する際に役立つのではないでしょうか。 MOONGIFTはこう見る Table-to-JSONの面白い点としては任意のテーブルに対して使える点です。うまく使えばテーブルのデータをJSONとして扱いやすく取得できます。この手

HTMLButcherはWindows/Mac OSX/Linux用のオープンソース・ソフトウェア（New BSD License）です。 画像で作成したデザインからHTMLを起こすのにPhotoshopがよく使われます。スライスツールを駆使して行われているかと思いますが、今回はその専用ソフトウェアHTMLButcherを紹介します。 適当な画像を開きます。 枠を作ったり、その名称を決めます（これが出力時のクラス名になるようです）。 実例（公式サイトより）。細かく指定することでより正確なHTMLデータが出力されます。 HTMLButcherではテーブルタグを使う、または使わないレイアウトが選択できます。使わない場合はスタイルシートで場所を指定する形になります。レイアウトのマスクを作成して、同じようなレイアウトの画像に対して使う回す事もできます。入力ファイルには通常の画像に加えてPSDも利用

PuPHPetはPHP製、MIT Licenseのオープンソース・ソフトウェアです。 Vagrantが注目を集めています。簡単に仮想サーバを立ち上げられますが、設定ファイルを書けばさらにコマンド一つで環境まで整ってしまいます。そんなVagrantの設定ファイルを設定を行うだけで生成してくれるのがPuPHPetです。 最初にディストリビューションを決めます。 次に最初にインストールするパッケージや設定を決めます。 HTTPサーバです。Apacheまたはnginxから選択します。 PuPHPetなのでPHPメインです。バージョンも5.3/5.4/5.5から選択できます。 PHPのモジュールです。入力補完がついているので簡単に選択できます。 PEARを組み合わせることもできます。 データベースです。MySQLまたはPostgreSQLが使えます。 後は設定ファイルをダウンロードするだけです。Zi

CharismaはHTML5/JavaScript製のオープンソース・ソフトウェア（Apache Licnese 2.0）です。 Webシステム開発において意外と不遇なのが管理画面です。内部の人が使うものなので適当に作られるケースが多くなります。そこで使ってみたいのがCharismaです。リッチな管理画面をBoostrapをベースに作り上げる事ができます。 ウィジェットがついた、リッチな管理画面です。ここまで恵まれているケースは早々ないでしょう。 ドラッグ&ドロップによる配置変更もサポート。 折り畳んで隠す事もできます。 グリッドは細かくサポートされています。 カレンダー。システム内部のデータをマッピングすると見通しが良くなりそうです。 メンバー一覧。検索やラベルもあって便利そうです。 ギャラリー。サムネイル写真をきれいに並べています。 タイポグラフィ。様々なタグをサポートしているので奇麗

mysqlenvは異なるバージョンのMySQLをインストールしたり切り替えられるインストーラーです。 最近プログラミング言語はrvmやnodebrewなどユーザ環境下でインストールできてバージョンの切り替えが簡単に行えるものが流行っています。そんな環境切り替えをMySQLでも行えるようにするのがmysqlenvです。 インストールします。 installコマンドで指定したバージョンのMySQLがインストールできます。 mysqlenvが対応しているのは3.23、4.0、4.1、5.0、5.1、5.5、5.6系となっています。特に5.5系はMariaDB、Percona、Twitterが選べるようになっていますので、それぞれのDBの特性をチェックするのに使えそうです。起動や停止、切り替えはコマンドから簡単にできます。 mysqlenvはBashスクリプト製のソフトウェア（ソースコードは公開さ

isbnjsはISBN10/13に対応したJavaScriptライブラリです。 Amazonや紀伊国屋、ヨドバシカメラなど多数のECショップで取り扱われている書籍。その共通コードになるのがISBNです。そんなISBNをJavaScriptで扱うのに適したライブラリがisbnjsです。 デモです。ISBNであるかどうか、10桁と13桁の判定や相互変換ができます。 洋書のISBNを入れるとEnglishと出ており、言語の判定もされています。 こちらも別なデモ。ハイフンも補完されます。 ISBNには10桁と13桁がありますが、その相互変換まで行えるのがユニークです。JavaScriptを使って書籍を検索したり、情報を引き出す際に使えそうです。 isbnjsはJavaScript製のオープンソース・ソフトウェア（MIT License）です。 MOONGIFTはこう見る Amazonでは取り扱い商

mysqlvizはMySQL/SQLiteの構造を可視化するライブラリです。 DBを使ったシステムを構築していると必要になるのがER図ではないでしょうか。そんなER図を実際のデータベースのダンプファイルをベースに描き出すのがmysqlvizです。 ヘルプです。 まずdotファイルを生成します。 さらにdotファイルをpngに変換して得られた結果です。 mysqlvizはMySQLとSQLiteに対応しています。MySQLの場合はダンプファイル、SQLiteの場合は実際のデータベースファイルを読み込んでdotファイルを出力します。後はGraphvizを使ってPNG画像に変換する仕組みになっています。 mysqlvizはPHP製、GPL v3のオープンソース・ソフトウェアです。 MOONGIFTはこう見る mysqlvizの面白いところはMySQLについてはダンプファイルを使っているということ

OSS License Generatorはオープンソースのライセンスファイルを生成するソフトウェアです。 GitHubが流行るのにつれてソースコードを公開するソフトウェアが増えたのは良いのですが、ライセンスが明記されていないものも数多くなっています。そこで利用をお勧めしたいのがOSS License Generatorです。 インストールしました。 listオプションで作成できるライセンスファイルの一覧が取れます。 例えばMIT Licenseの場合はこのような実行です。 ちゃんとライセンスが生成されました。 ライセンスはファイルを置けばいいものもあれば、Copyright部分を編集しなければならないものもあります。そうしたちょっとした手間の部分を軽減してくれるOSS License Generatorを使ってオープンソース・ソフトウェアとしてきちんと登録するのが良いのではないでしょうか