GitTouch - Flutter製のGitHubクライアント
GitHubを通じて開発者とコミュニケーションしている人は多いでしょう。社内においてもIssueやPRを使って対話したり、意見を求められたりします。必ずしもコードを書かずともGitHubを使っているという人は多いはずです。 そうした方にお勧めなのがGitTouchです。Flutterで作られたGitHubクライアントアプリです。 GitTouchの使い方 まずアカウントを登録します。これはOAuth2認証で行います。 アカウントを追加しました。 ニュースでアクティビティを確認できます。 通知一覧。 リポジトリ検索機能もあります。 個人のプロフィール画面。 テーマを変更しました。 GitTouchはGitHubの情報を確認したり、コメントしたりと言ったGitHub上での活動を支援してくれます。外出時にスマートフォンから操作するよりも手軽に対応できるでしょう。 GitTouchはDart/Fl
GitBucket - 立ち上げ簡単なScala製GitHubクローン
GitHubを使ってプロジェクトのソースコードを管理しているというケースが多くなっていますが、それでもコードを外部サービスに配置してはいけないといった規定があるケースは多いです。そうなるとGitHubを使うことはできません（Enterprise版を買えばいけますが）。 しかしGitで管理し、さらにWebベースの使い勝手が良いUIが欲しい…なんてわがままを考えてしまう方に使ってみて欲しいのがGitBucketです。 GitBucketの使い方 GitBucketはScala製で、TomcatなどのWebアプリケーションサーバと連携できます。さらに単体でも動作が可能で、Mac OSXであればHomebrewでインストールできます。 $ brew install gitbucket インストールが終わって立ち上げると、 http://127.0.0.1:8080/ でサーバが立ち上がります。 な
React - Facebook製。JavaScriptのUI生成ライブラリ MOONGIFT
Facebookからまた面白そうなソフトウェアが出てきましたよ！ JavaScriptにおけるテンプレートフレームワークは数多く出てきています。いずれも興味深い作りなのですが、ここにきてFacebookがReactというライブラリをリリースしました。 ReactはUIを生成するJavaScriptライブラリで、MVCでいうところのVになります。さっそくコードを見てみましょう。 一番シンプルな実装例。左側がコード、右側が実行結果になります。 Reactは必須ではないのですがJSXというXMLライクな記法を使っています。 <hellomessage name="John" />のように定義するとthis.props.nameで値が取り出せます。実際の描画はリアルタイムに反映されるので、Helloのところを修正すればすぐにレンダリング内容が変わります。 こちらはタイマーを使った例。コードが見やす
まるで本物！雨粒が窓に落ちる様子をリアルに再現·rainyday.js MOONGIFT
rainyday.jsはJavaScript製、GPLのオープンソース・ソフトウェアです。 コンピュータ上で自然現象を再現するのはとても面白い試みです。例えば物理エンジン、ライフゲームもその一つです。今回はWebブラウザ上で雨が窓にあたる様子を再現するrainyday.jsを紹介します。 背景はぼやけ、曇ったガラスに雨があたっていく感じが再現されています。 中央の枠はYouTube動画の再生ができます。 時間が経つと雨粒が増えていきます。 雨で窓が曇っている感じがうまく再現されています。 雨は垂直だけでなく、斜めに降らせることもできます。 rainyday.jsは背景を曇らせるのはもちろん、雨粒が落ちるところは曇りがとれて向こう側が見えるようになるなど細かい所にもこだわって作られています。さらに雨粒自体も背景の写真を透かしていて本物そっくりです。 コンピュータと異なり、自然現象はランダムな
Googleマップ上に任意の画像を表示·GMap-JSlicer MOONGIFT
GMap-JSlicerはJavaScript製のオープンソース・ソフトウェア（MIT License）です。 Googleマップはみんな、普段から使っているでしょう。技術的に見てもズーム、移動など便利なものが多いです。自分でもあのUIを実現したいと思っている人も多いのではないでしょうか。そんな方に使ってみて欲しいのがGMap-JSlicerです。 デモ。GoogleマップのUIに任意の画像を載せています。 移動、ズームは自由にできます。 全体像。 GMap-JSlicerでは画像をタイル状に並べる訳ではなく、一枚の画像をGoogleマップ上に貼付ける形になっています。とは言えゲームのマップのようなPNG画像で表現できるものであればそれほどサイズは大きくならないのではないでしょうか。 MOONGIFTはこう見る Googleマップの面白い点は情報源としてはもちろんのこと、埋め込み型のAPI
レスポンシブなグリッドだけを提供する軽量スタイルシート·fitgrid MOONGIFT
fitgridは本番環境下でも耐えられる軽量なレスポンシブグリッドなスタイルシートです。 レスポンシブなWebデザインを実現するのは大変ですが、Bootstrapを使うとそれっぽさが残ってしまう…。そんなジレンマを感じている方はfitgridを試しましょう。fitgridは軽量なグリッドレイアウトを提供します。 デスクトップサイズでの表示。 1〜4列で細かく制御できます。 タブレットサイズ。幅が狭くなっても奇麗に表示されます。 画像もグリッドに沿っています。 幅を狭くすると画像の並びも変わります。 一番狭くした場合。整然と並んで表示されます。 fitgridは横幅を12に分割してグリッド化します。.fg3といったクラスを使えば4つ並べられる計算です。12を一つ、4を3つといった具合に組み合わせて利用できます。fitgridは軽量であり、本番環境下でも使えるように余計なことはしないように設計
SVGをもっと活用するために使いたい·svg.js MOONGIFT
svg.jsはアニメーションやイベント駆動型のSVGを実現するライブラリです。 SVGはまだ広く利用されているとは言いがたいですが、ビットマップではなくベクターデータなので拡大してもきれいなど特徴が多数あります。今回紹介するsvg.jsはSVGを使ったアニメーションを実現するライブラリになります。 デモです。単純なオブジェクトの生成、移動、中央寄せが簡単に指定できます。 クローンして重ね合わせ。重心の判定、傾けるのも手軽です。 X軸、Y軸のずらし。塗りつぶし。 枠だけを描く、グラデーション（線形、円形）。 クリック、マウスオーバー、画像マスクもできます。 クリックしたオブジェクトだけ色を変更します。 さらにアニメーションも自在に。 プラグインによる拡張もサポート。 svg.jsを使えばアニメーションはもちろんのこと、画像を重ねて表示したり、マウスイベントによって形状や色を変更したりすること
JavaScriptを使ったリアルタイムA/Bテスト·Abba MOONGIFT
AbbaはJavaScriptを使ったUIのA/Bテストを行うソフトウェアです。 Webサイトの良いところは変更コストがとても小さい所にあると思っています。ちょっとしたテストを行うのが簡単で、戻すのもそれほど難しくありません。そこでWeb上でA/Bテストを行う際に遣ってみて欲しいのがAbbaです。 管理画面です。この右側に出ているコードを実行することでA/Bテストを行えます。 測定結果はリアルタイムに反映されます。 Aの方が反応が良いといった結果が簡単に分かります。 Abbaの仕組みとしては、A/BそれぞれについてJavaScriptを実行します。例えばボタンの配置を変えたり、CSSのクラスを変えて見た目を変更できます。そしてその結果クリックなどのイベント対してテストが完了したというアクションを実行する仕組みです。 AbbaはRuby製、MIT Licenseのオープンソース・ソフトウェア
あの懐かしいシムシティで遊ぼう·Micropolis MOONGIFT
Micropolisは初代シムシティのオープンソース版です。 間もなく新作シムシティ6が登場するシムシティ。1989年の登場以来、ずっと愛され続けている有名なゲームです。そんなシムシティのクローンソフトウェアがMicropolisになります。 懐かしい画面！ ゲーム開始です！ 例えばこんな感じに拡張していきます。 税率などの設定。 Micropolisは子供たちに一人一台PCを渡そうとするプロジェクトOLPC向けに初代シムシティのコードをオープンソースにして公開されています（一部相違があります）。あの懐かしいシムシティの世界に浸りたい方はぜひダウンロードしてください。 MicropolisはWindows/Mac OSX/Linux用のオープンソース・ソフトウェア（GPL v3）です。 MOONGIFTはこう見る 初代のAngry Birdsもフリーになるなど、旧来のゲームをオープンにする
LWFを使った開発をサポートする自動生成ツール·LWFS MOONGIFT
LWFSはGREE製のLWFを自動生成してくれるデーモンです。 GREEが積極的に開発を行っているFlashからHTML5/Unityへ変換を行うのがLWFです。その変換処理をもっと手軽にスムーズにしてくれるツールがLWFSです。 一覧です。ファイルを更新すると自動的にLWFが更新されます。 Webブラウザ上で簡単に試すことができます。 Warningなども確認できます。 LWFSはデーモンであり、ファイルの更新を感知して自動的にLWFを更新してくれます。Canvas/WebGL/WebKit CSSなど3パターンでファイルを生成してくれるのでデザイナーの方は生成の手間を全くなくなるはずです。 LWFSはRuby製のオープンソース・ソフトウェア（zlib/libpng License）です。 MOONGIFTはこう見る Flash周辺の状況はここ数年で大幅に変わってきました。一時はガラケー
Facebook製。プログラマー向けのプロジェクト管理·Phabricator MOONGIFT
PhabricatorはFacebookが開発しているプロジェクト管理です。ソースコードレビュー、バグトラッキングなど開発者フレンドリーな機能が数多くあります。 企業においてGitHubをソースコードリポジトリ/プロジェクト管理に使っているケースも増えてきていますが、大規模な企業では難しいケースも多いでしょう。そこで紹介したいのがFacebookで開発されているPhabricatorです。 最初にログインを求められます。 ついでユーザ名を入力します。 ダッシュボードです。 チケットの詳細画面です。 ソースコードレビュー。 もちろんコードハイライター付き。 リポジトリビューワー。 コミットログ。 画像付きでディスカッションもできます。 Wiki。 IRCのチャンネルリスト。 PhabricatorではGit/Subversion/Mercurialをサポートしています。また、OSはWindo
フォーム入力内容をローカルストレージに保存·Garlic.js MOONGIFT
Garlic.jsはフォーム入力データをローカルストレージに保存し、再読み込みしても復元してくれるソフトウェアです。 Webサイトフォームへの入力において間違ってウィンドウを閉じてしまったり、何かエラーがあったために全ての入力結果が消えてしまったなんていうと非常にがっかりします。それを防止できるのがGarlic.jsです。 テキストボックス、テキストエリアに適当な文字を入力します。リロードしてもちゃんと入力が保持されています。 Ajaxベースの入力エラーチェックにも対応しています。 今のところ、テキストボックスとテキストエリアのみ対応しているようです。指定した項目だけ対象外にもできます。今後、ラジオボタンやチェックボックスなどにも対応が願われます。 Garlic.jsはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る 最近ではモ
膨大なデータから最適な結果を得るための検索エンジン·Cloud Mining MOONGIFT
Cloud Miningはタグクラウドや全文検索を使った構造化データに向いた検索エンジンです。 Webサイトで常に必要になるのが検索エンジンです。最近は全文検索エンジンが人気ですが、より大量の構造化データを検索するのに最適な検索エンジンとしてCloud Miningを紹介します。 デモです。IMDBを解析した検索エンジンです。 画面上部にタグ（検索キーワード）が出ています。 さらにタグを追加します。 最終的に1件にまで絞り込まれました。 こちらも別な検索エンジンです。 Cloud Miningは全文検索としてSphinxを使い、データからタグクラウドを生成したり、絞り込んだ件数の表示、年数や共演者などのデータをピックアップもできます。複雑な構造データから望んだレコードを取り出すのに使えそうです。 Cloud MiningはPython製のオープンソース・ソフトウェア（GNU Affero
ダッシュボード構築用UIライブラリ·Dashing MOONGIFT
Dashingはダッシュボード用ライブラリで、グラフを表示したり並び替えが自由にできます。 システムには必ず管理インタフェースがあります。表向き華やかでも、裏のシステムは中の人用とあって粗雑なUIであるケースが多いようです。そこで使ってみたいのがDashingです。 なんと奇麗なダッシュボード。 ドラッグアンドドロップによる配置換えも可能です。 自分の見やすいように配置を変更できます。 Dashingは数値やデータのリストを確認するのにぴったりなモダンなUIとなっています。細かなデータ管理ができる訳ではありませんが、ステータスをチェックしたりするのにぴったりです。APIが公開されているので、それにあわせてデータを配信すればDashingが華麗なUIにしてくれるはずです。 DashingはRuby製のオープンソース・ソフトウェアです。 MOONGIFTはこう見る Webサイトの表のUIが整っ
ウィンドウサイズに合わせて自在にJavaScriptを実行する·Response MOONGIFT
ResponseはレスポンシブWebデザインを実現するのに必要な情報を取得できるJavaScriptライブラリです。 レスポンシブデザインを実現する際にスタイルシートだけで全てをこなすのは難しいかも知れません。ウィンドウの幅に応じて最適な見せ方を実現するためにJavaScriptの力が必要ならばResponseを使ってみましょう。 テストの画面です。ウィンドウや画面のサイズが出ています。 ウィンドウサイズを縮めると値がリアルタイムに変化します。 縦のスクロール値も出ます。 各種判定値が用意されています。 ウィンドウサイズによる簡易的な判定も可能です。 もちろんこのページ自体がレスポンシブです。 Responseを使えば現状のウィンドウサイズやスクロール位置などレスポンシブWebデザインを実現するのに必要な情報が一気に取得できます。さらにリサイズなどのコールバックにも対応しているので、表示し
Mozilla製。OpenIDに代わる認証統合システム·BrowserID MOONGIFT
BrowserIDはWebサービスにおける認証を統合するシステム。 BrowserIDはnode.js/JavaScript製のオープンソース・ソフトウェア。今やWebサービスは無数に存在し、その中にはユーザ登録を求めるものがたくさんある。都度個人情報を登録したり、パスワードを設定するのは煩わしく、そのためにユーザ登録を断念するというケースも少なくない。 BrowserIDの画面 そんな中、認証情報を他のサイトに委譲するOpenIDが登場した。今はTwitterのようにOAuthを使って認証を行う場合もある。そんな中Mozillaが考えだしたのがBrowserIDだ。 BrowserIDはOpenIDの仲間のような仕組みだ。BrowserIDにユーザ登録（というかメールアドレス登録）を委譲できる。使うサイトはJavaScriptファイルを読み込むだけで良い。それだけでログイン状態が把握でき
マルチデバイス対応のDjango製CMS·Mezzanine MOONGIFT
Mezzanineは管理画面のあるDjango製のCMSです。 Webサイトの基本と言えばCMS。WordPressのような大規模なCMSも良いですが、今回はフレームワークとしてDjangoを使ったMezzanineを紹介します。実績も十分にあり、多機能なCMSになっています。 ユーザ向け画面です。 テーマの切り替え対応です。 ログインしました。 こちらは管理画面です。 ページの並び替え。 ショッピングカート用の商品管理です。 こちらはスマホ向けの画面です。 要素がぐっと減ってシンプルな表示です。 ユーザ向けとしてはページ内編集、ドラッグアンドドロップによる並び替え、WYSIWYG編集、ショッピングカートモジュール、ブログエンジン、タグ付け、スケジューリングした投稿などが特徴になります。開発者に対してはBootstrap利用、各種API、マルチデバイス対応のテンプレートシステムが特徴になり
node.jsで作られた実用的なブログエンジン·nodejs_blog MOONGIFT
nodejs_blogはnode.js/Express/MongoDBを組み合わせたブログシステムです。 node.jsはまだまだ際物だと思っていませんか。既に実用的なシステムも多数出てきています。今回はnode.jsを使ったブログシステムnodejs_blogを紹介します。 ユーザ向けの画面です。 管理画面。ポスト一覧です。 新しい投稿の追加。Markdownで記述します。 メッセージ一覧。コメントです。 nodejs_blogはフレームワークにExpressを使い、データベースにMongoDBを用いています。管理画面も用意されており、検索や認証もあるなど必要充分な機能は揃っていると言えます。Herokuでの利用も想定されていますので、無料で独自のブログシステムを開始するなんてことも可能です。 nodejs_blogはnode.js/JavaScript製のソフトウェア（ソースコードは公
オフラインでも使えるJavaScriptベースの全文検索エンジン·Fullproof MOONGIFT
FullproofはJavaScriptベースの全文検索エンジンです。高速に動作します。 Webサイトのコンテンツが充実してきたら欲しくなるのが検索機能です。Google検索を使っても良いですが、ここではFullproofを紹介します。何とJavaScriptベースの全文検索エンジンです。 色検索エンジン。 動作は高速です。 動物検索エンジン。 ゲーム検索エンジン。スコアが表示されています。 スコアの高いデータが上に出ます。 FullproofはHTML5のローカルストレージに対応し、WebSQLやIndexedDBにも対応します。Unicodeをフルサポートしています。スコアによって順位が決定します。発音記号に対応しますが、現在は英語とフランス語のみとなっています。JavaScriptだけとあって動作は高速です。 FullproofはHTML5/JavaScript製のオープンソース・ソ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Titaniumカンファレンス情報をアプリでチェック！·tiTokyo MOONGIFT