git-remote-dropbox - DropboxをGitリポジトリに
DropboxにGitリポジトリを保存している人は多いかと思います。筆者もそうやって使っています。ただしこの場合、ファイルを下手に編集していると編集中コピーができあがってしまうことがあります。 そこで使ってみたいのがgit-remote-dropboxです。git-remote-dropboxはまさにDropboxをGitリポジトリのマスターにしてくれるソフトウェアです。 git-remote-dropboxの使い方 git-remote-dropboxをインストールすると、次のようにdropbox::が使えるようになります。 $ git clone "dropbox::/Files" これを実行すると手元のディレクトリにリポジトリが作成されます。もしDropboxにディレクトリがない場合は自動的に生成されます。git-remote-dropboxはローカルではなく、Web APIを使って
GitUp - Mac OSX用の軽量なGitクライアント
Gitは誕生して10年になろうとしているそうです。そして現在、GitHubを筆頭として多くのエンジニアがGitを使っています。しかしGitの使い方について、日々多くのエンジニアが悩んでいるのではないでしょうか。 そこで作られたのがGitUpです。分かりやすくGitを使えるようにしたいと考えているクライアントソフトウェアです。 GitUpの使い方 GitUpを立ち上げるとまず、リポジトリを選択するウィンドウが表示されます。 リポジトリを開くとグラフが表示されます。 ブランチなども見やすいです。 コミットメッセージも見られます。 修正した場所も分かります。ここからコミットもできます。 GitUpでは操作の殆どがundo/redo可能であり、タイムマシーンさながらに指定したリポジトリの状態に戻すのも簡単にできます。UIはとてもシンプルですが、GitUpを使うことで普段のGit運用がとても楽になる
SVG PORN - 各種サービスロゴをSVG化
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました SVGはHTML5になって標準化されているメディアフォーマットですが、まだあまり広く活用はされていません。ただし、現在の高解像度化であったり、幅広い画面幅に対応していこうと考えるとSVGのようなベクター画像はとても大事になっていくでしょう。 今回はそんなSVGを使って各種サービス、ソフトウェアのロゴを描いたSVG PORNを紹介します。 SVG PORNの使い方 SVG PORNはとても数多くのサービスに対応しています。一覧でお見せします。まずはAngular、Ansible、Apache、Arduino、Atom、Auth0、Autoprefixer、AWS。 続いてBabel、Backbone、Bash、Bem、Bitbucket、Blocs、Bootstrap、bourbon
KeyCastr - Mac OSXのキーボードショートカット・ビジュアライザ MOONGIFT
キー操作を見せたいと思うことが時々あります。例えばキーボードショートカットは単に画面を見ているだけでは分かりづらいので画面上にショートカットキーを表示してあげると操作を見ている人にとって便利です。 コンピュータ操作の動画であったり、コンピュータの使い方を学習する際などにそういった操作を見せてあげると理解が進むでしょう。そのためのソフトウェアがKeyCastrです。 KeyCastrの使い方 KeyCastrを使う場合にはシステム環境設定のセキュリティとプライバシー設定において、プライバシーペインのアクセシビリティでKeyCastrを追加しておく必要があります。 設定画面です。キーボードショートカットで機能をトグルできます。 表示設定です。 例えばこんな感じにフロートで表示されます。通常の文字入力は出ず、キーボードショートカットだけを表示します。 Optionなども認識します。 KeyCas
Rocket.Chat·Meteor製のSlackクローン MOONGIFT
ここ数年チャットアプリが盛んになっています。機能として求められるものは決して多くなく、似通った作りになってしまうものの、UI/UXにおいてSlackが頭一つ飛び抜けた存在になってきています。 そんなSlackを真似て作られたのがRocket.Chatです。基盤としてMeteorを使ったのが特徴となっています。 Rocket.Chatの使い方 Rocket.Chatの画面です。まずユーザ登録をします。 こちらがダッシュボード的な画面です。 チャットルームに入りました。Slackと似ていますね。 メッセージを書いて、さらに編集もできます。 右側のペインは非表示にできます。 大勢いるとこんな感じ。 Rocket.Chatではファイルの添付はできないようですが、画像のURLを貼り付けると画像がインラインで表示されるようです。社内でSlack風のチャットが欲しかったらRocket.Chatを使ってみ
odpdown - MarkdownファイルをOpenDocumentのスライドファイルに
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Markdownでスライドを作る人が数多くいます。テキスト中心の方が内容に集中できるので、より分かりやすいスライドを作ることができます。また、そのためのHTMLプレゼンテーションを作成するソフトウェアも多いです。 odpdownもMarkdownファイルをプレゼンテーションファイルに変換するソフトウェアなのですが、ちょっと変わっています。なぜなら生成するファイルがOpenDocumentフォーマットなのです。 odpdownの使い方 インストールはGitHubのリポジトリをクローン後、関連ライブラリのインストールなどを実行します。 $ git clone git@github.com:thorstenb/odpdown.git $ cd odpdown $ pip install
Locat·Mac OSXのファイルのオープン/保存を便利に！ MOONGIFT
これはMac OSXユーザであれば必携のツールになるのではないでしょうか。Mac OSXでファイルの保存先、開く先を変更する際にFinder側にあるファイルをドロップするという方法があります。これをよく使う人は多いでしょう。 しかしドロップすると保存ファイル名まで書き換わってしまって逆に面倒なこともあります。そこで使ってみたいのがLocatです。 Locatの使い方 LocatはSIMBLプラグインになっています。EasySIMBLなどを使ってインストールできます。 後はFinder側でOption + Returnを押すと選択している項目をOpen/Saveダイアログに反映します。Shift + Returnはファイル名は反映せず、場所だけ移動します。ファイルをドロップせず、キーボードショートカットだけでできるのが便利です。 実際のデモ動画はこちら。 日々よく行う操作を手軽にしてくれると
Twine – ストーリーを整理するノートアプリ
プレゼンテーションは単純にスライドを並べてたんたんと説明していけば良いわけではありません。全体を通して一つのストーリーが必要です。ストーリーが一貫して提供されてこそ、聞き手は納得し、理解を深めることができます。 そんな納得感あるストーリーを作るのに適したソフトウェアがTwineです。Wikiっぽさのある面白いソフトウェアです。 Twineの使い方 Twineは元々Windows、Mac OSX用のソフトウェアでしたが、2.0からWebベースになったようです。プレゼンテーションのスライドや小説、マインドマップの代わりに使うのも良さそうです。 TwineはHTML5/JavaScript製のオープンソース・ソフトウェア（GPL v3）です。 Twine / An open-source tool for telling interactive, nonlinear stories tweeco
Textures.js - SVGをパターンで塗りつぶし MOONGIFT
SVGはWeb上でベクターグラフィックを表現するのに適した手法です。Flashのように外部プラグインはいらないですし、拡大/縮小しても綺麗なのでどんなデバイスの画面サイズにも対応できます。 そんなSVGの表現力をあげるのに適したライブラリがTextures.jsです。多数のパターンを使って塗りつぶし処理を行います。 Textures.jsの使い方 デモです。線は素のSVG（d3.js）で描いて、その内容をTextures.jsで描いています。 ライン系。 色の変更もできます。 線を細くしたり、間隔を調整するのも簡単にできます。 サークル、ドット系。 こういう特定のパスを描くことも、自分でカスタマイズすることもできます。 SVGで描いているとついベタ塗りになってしまいがちですが、さらにその描画内容をパターンで描けるようになるとカラーだけでなく、グレースケールで表現した際にも分かりやすくなりそ
スクショ撮る君·指定したURLのスクリーンショット画像を作成 MOONGIFT
Webサイトのスクリーンショットを撮る要望はずっと昔から存在し続けます。昔はIEを外部から操作してスクリーンショットを撮るものがあり、少し経つとFirefoxでスクリーンショットを撮るものが出てきました。最近ではWebKitベースが多いようです。 そんなWebサイトのスクリーンショットを撮ってくれるツールがスクショ撮る君です。URLを指定するだけのシンプルな仕組みです。 スクショ撮る君の使い方 デスクトップ版の撮影。表示されている内容は画像で保存できます。 スマートフォンを指定することもできます。 スクショ撮る君はCasperjs（node製のヘッドレスブラウザ）をキックしてスクリーンショットを取得して、その結果をBase64で返却しています。自分でスクショ撮る君を立てておくと便利に使えそうです。 スクショ撮る君はRuby製のソフトウェア（ソースコードは公開されていますがライセンスは明記さ
fake2db - 各種データベースに対応したダミーデータジェネレータ MOONGIFT
システム開発を行っているときにダミーのデータが欲しくなることは多々あります。そんな時に本番データをコピーして使うのは大きな問題につながる可能性があるので決してしてはいけません。電話番号やメールアドレスなどを置き換える作業が逆に手間になる場合もあります。 そこで使ってみたいのがダミーデータのジェネレータです。今回はPython製のfake2dbを紹介します。 fake2dbの使い方 fake2dbはSQLite、PostgreSQL、MySQLそしてMongoDBに対応しています。インストールはpipでできます。 pip install fake2db インストールしたらfake2dbコマンドでデータベースに直接データを流し込めます。 fake2db --rows 200 --db sqlite # SQLiteの場合 fake2db --rows 1500 --db postgresql
kuromoji.js - Webブラウザ上で分かち書き！ MOONGIFT
テキストから意味を読み取るというのは非常に難しく、そのための専用ソフトウェアが存在するほどです。そしてテキスト解析手法の一つとして知られているのが分かち書きです。日本語であればChasenがよく知られています。 kuromoji.jsはそんな分かち書き処理をJavaScriptで行ってしまおうというソフトウェアになります。KuromojiというApache財団のオープンソース分かち書きエンジンをJavaScriptにポーティングしています。 kuromoji.jsの使い方 こちらはデモです。Webブラウザベースで動作しています。nodeでも使えます。 適当な文章をリアルタイムに分かち書きできます。 kuromoji.jsは辞書ファイルをAjaxで取得しています。そのためサイズは大きくなりますが、分かち書きの精度はとても高くなります。サーバサイドで辞書を用意したり分かち書きエンジンを用意する
Ptty - Webブラウザ上のターミナル
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 特定のアプリケーションに関して操作に不慣れな時はGUIのが便利ですが、十分に慣れて繰り返しの作業が増えてくるとCLIで操作したいと思い始めるものです。Webにおいてもそれは変わらないでしょう。 WebのUIに面倒さを感じるような熟練したユーザが多いWebアプリケーションであればPttyを使ってみてはいかがでしょう。 Pttyの使い方 PttyはjQueryプラグインなので入力によって結果の出力を変えるのは難しくありません。自分たちのサービスに組み込むこともできるでしょう。UIがない分、目移りせずに作業できそうなので、業務系システムにはDOS風で使いこなせるかも知れませんね。 PttyはjQuery/JavaScript製のソフトウェア（ソースコードは公開されていますがライセンスは明
Glance Year·GitHub風に年間の活動をグラフ化 MOONGIFT
一年分の活動を振り返る際にはどういった表示が良いでしょう。各月のカレンダーを表示して、日付ごとに色分けするのも良いでしょう。しかし開発者であればもっと面白い方法があります。それがGitHubのコントリビューショングラフ（正式名称は知りませんが）です。 縦軸に曜日、横に52週分並べればそれだけで一年間を意味するグラフになります。後は活動の多かった日を濃く、何もしていない日を薄くすればOKです。そんなグラフを自分でも簡単に作れるのがGlance Yearです。 Glance Yearの使い方 サンプルです。まさにGitHubのグラフ風です。 クリックすると詳細が分かります。 例えばデータは次のように作ります。 var massive = [ {date: '2014-8-3', value:'1'}, {date: '2014-8-4', value:'2'}, {date: '2014-9-
Alasql.js - オンメモリで動作するJavaScriptデータベース MOONGIFT
JavaScriptを活用したWebアプリケーションを開発している際に、一時的に保存したいデータをどのように扱うかは大きな問題です。何となく変数や配列、ハッシュに保存してしまいがちですが、そのデータの取り出しや更新が面倒だったりします。 そこで使ってみたいのがAlasql.jsです。JavaScriptだけで作られたクライアントサイド向けのSQLデータベースになります。 Alasql.jsの使い方 使い方の例。データを配列で放り込んで、SQLで取り出せます。 デーブルの作成を含めてSQLが書けます。 データはlocalStrageに保存することもできるので、再読込時に復元も可能です。 Alasql.jsはHTML5仕様の中で検討されていたWeb SQLとは異なる実装で、オンメモリで動きます。高速で動作し、かつデータはlocalStrageに保存しておくこともできるので容量は小さいながらも永
pgweb – 単体ファイルで使えるWebベースのPostgreSQL管理
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Webシステムを開発しているときには大抵データベースを使います。そしてデータベースを使った開発時にはそれ用の管理インタフェースが欲しくなるでしょう。たとえばPHPであればphpMyAdminが昔から有名です。 対してPostgreSQLについてはphpPgAdminなどもありますが、もっとモダンなUIが欲しいと思う人も多いでしょう。そんな方に使ってみて欲しいのがpgwebです。 pgwebの使い方 pgwebの良いところとしてはApache + PHPなどのサーバを仕込むことなく、単体でWebサーバ機能を持っていることです。 $ pgweb --host localhost --user myuser --db mydb こんな感じで起動します。ちなみにテーブルが一つもないと起動に
mdr – ターミナルでもMarkdownを読みやすく
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Markdownフォーマットがどこでも使われるようになっています。それだけ普及したこともあって、専用のエディタや各種エディタでのMarkdownフォーマットのハイライトサポートが当たり前になっています。 そこでターミナルでも同じようにMarkdownの可読性をあげてくれるのがmdrです。一度使うと意外と手放せない存在になりそうです。 mdrの使い方 インストールはnpmを使います。 $ npm install -g mdr 面白いのはローカル、オンラインのどちらでも読み込めることでしょう。 mdr # Show README.md from current directory mdr foo.md -i # Use dark-on-light style mdr http://ex
nexe - nodeスクリプトをラッピングして実行ファイル化
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました nodeを使えばJavaScriptでローカルで動くコマンドなどを作ることが出来ます。これはとても便利で個人的にはよく使うのですが、そのためには予めnodeがインストールされていなければなりません。 もちろんバイナリでも配布されているのですが、インストールの手間は初回実行には相当大きいと言えます。そこで使ってみたいのがnodeスクリプトを実行ファイル化するnexeです。 nexeの使い方 nexeは他の同じようなソフトウェアと同じく、nodeの実行エンジンをスクリプトと一緒にするタイプのソフトウェアです。 コンパイルはこのように行います。 nexe -i ./ -o ./hello-world.nex -r 0.8.18 コンパイルのためにnodeのコンパイルまで行うので初回は時間
Responsive Dashboard - Bootstrapベース、レスポンシブな管理画面テンプレート MOONGIFT
Bootstrapの良いところは使い手（主にエンジニア）の気持ちを理解し、その利用シーンが想定されていることでしょう。こだわったデザインにすることだってできますが、それでは応用がききません。その汎用性と見栄えのバランスを上手に保っています。 今回紹介するResponsive Dashboardもその応用例と言えます。いわゆる管理画面系のダッシュボードですが、AngularJSとjQueryに対応し、カスタマイズして利用するのが容易になっています。 Responsive Dashboardの使い方 こちらがメイン画面です。管理系で良くありがちなウィジェットがたくさんあります。メニューは左側です。 デスクトップもメニューを折り畳めます。 タブレットサイズになると自動でメニューの文字が折り畳まれます。 スマホサイズ。カラムが1列になります。 Responsive DashboardはBootst
HTML5pano - HTML5で楽しむ360度パノラマ写真
スマートフォンでパノラマ写真が撮影できるようになっていますが、問題はいいビューワーがないことです。撮るのは面白いのですが、それを活かせるビューワーがなければムダなコンテンツになってしまいます。 そこでHTML5を使ってパノラマ写真を楽しめるのがHTML5panoです。左右だけでなく、上下も含めたパノラマ写真が楽しめます。 HTML5panoの使い方 HTML5panoに対応した写真を撮る、または複数の写真から合成するのは難しいかも知れませんが、ビューワーがあればこれに合わせて写真を撮ってみるというのも面白そうです。 HTML5panoはjQuery/JavaScript製のソフトウェア（ソースコードは公開されていますがライセンスは明記されていません）です。 DeuxHuitHuit/HTML5pano
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
