Dbignore·これは便利！Dropbox版.gitignore MOONGIFT
Dropboxは手軽で便利に使えるのですが、細かいカスタマイズには対応していないので融通が利かないなと思ってしまうこともあります。例えば同期しないフォルダの指定はできますが、ファイル単位で指定したいという場合もあるのではないでしょうか。 そんな時に使えるのがDbignoreです。.gitignoreと同じフォーマットを使って同期しないファイルを指定できます。 Dbignoreの使い方 インストールは次のように行います。 $ ./install ++ dirname ./install + BUILD_DIR=. + cp ./dropbox_inj.dylib /Applications/Dropbox.app/Contents + grep -Fxq DYLD_INSERT_LIBRARIES /Applications/Dropbox.app/Contents/Info.plist 例
PWA Starter Kit - PWAを学ぶためのテンプレート
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました PWA（Progressive Web Apps）というキーワードがトレンドになっています。しかしPWAは特定の技術を指すのではなく、Webでの体験をよりネイティブ並に向上させるという概念でしかありません。そのため何から取り組んだら良いかが分かりづらいです。 そこで勉強のベースに使ってみたいのがPWA Starter Kitです。PWAに関する要素が盛り込まれたテンプレートです。 PWA Starter Kitの使い方 こちらがテンプレートです。 カウンター。これは再読み込みすると消えてしまいます。 ショッピングカート。 マニフェストファイルもきちんと設定されています。 PWA Starter KitではPWAとして必要になる要素（レスポンシブ、SPA、アプリマニフェスト）などの要
Utatane - プログラミング用の日本語等幅フォント
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 日本語でプログラミングをしている時に困るのが英字と日本語のバランスです。記号や英字で幅が違ったりすると何となく気持ちが悪かったり、さらにそこに日本語まで加わるとずれが大きくなります。 そこで使ってみたいのがUtatane、プログラミング用の日本語等幅フォントです。 Utataneの使い方 Utataneの文章例。英語は日本語1文字分にきちんと収まっています。 プログラミングの中で使った場合。可読性も高く、文字幅もちょうどいいです。 UtataneはRichyからフォークしたCicaをさらにフォークして作られています。さらにUbuntu Monoとやさしさゴシック、やさしさゴシックボールド を合成と調整して作られています。様々なフォントの工夫が盛り込まれたフォントだけにプログラミング
Js-geolocation - クライアントサイドで使える位置情報取得ライブラリ MOONGIFT
ユーザ登録の際に住所や都道府県を入力させるWebサービスはたくさんあります。また、グローバルなサイトによっては国や地域を選択させる場合もあります。 ああいった入力は非常に面倒で、インターネットサービスであればアクセス情報を使ってもっとスマートに解決できるはずです。そこで使ってみたいのがJs-geolocationになります。 Js-geolocationの使い方 Js-geolocationはIPアドレスから位置情報を取得できるWebサービスです。 返り値は以下のようになっており、位置情報や国が返ってきます。 {"city":"ota","cityLatLong":{"lat":35.569999,"long":139.799999},"country":"JP","region":"13"} Web APIベースなので、JSONPコールバックにも対応しています。 https://eu-j
ExcelJS·node.jsからExcelファイルを読み書き MOONGIFT
Windowsなんて嫌だ！Officeファイルなんて嫌い！なんて言いつつもシステム開発時にお世話になるのがExcelです。CSVファイルを出力したり、逆に読み込む機能は良く作るのではないでしょうか。 わざわざCSVを介さずにExcelファイル（xlsx）をそのまま読み込んだり、書き出せるのがExcelJSです。node用の便利なライブラリです。 ExcelJSの使い方 例えば書き出しを行った場合、こんなにカスタマイズされた書き込みが行えます。 逆に読み込んだ場合。各セルの値やシート名などデータがとれます。値が入っているセルの範囲も取得できます。 $ node testBookRead.js ./test.xlsx Worksheets: 1 Sheet 1 - blort Dimensions: A1:S12 値の種類としては数字、テキスト、日付、リンク、関数が使えます。ただし関数は関数の
pdfmake - クライアント/サーバサイド両方に対応したPDFジェネレータ MOONGIFT
Webシステムを作っていて、時々PDFの帳票が必要になることがあります。サーバサイドでPDF出力するツールは幾つかありますが、それらのセットアップは面倒ですし、サーバの負荷も気になるでしょう。 そこで使ってみたいのがpdfmakeです。サーバ、クライアントサイド両方に対応したPDF作成ツールです。 pdfmakeの使い方 pdfmakeではJSONを使ってPDFの形式を定義します。 スタイル設定も可能です。 より複雑なスタイルを使った例です。 段組のサンプル。 テーブルも使えます。 リスト。ネストもできます。 より本格的な形式ですね。 画像も使えます。 pdfmakeの良いところはJavaScriptによる生成なのでサーバサイドの負荷なく、かつ編集した内容をその場で反映して生成し直すこともできるということです。さらにnodeで動かすこともできるのでクライアントサイドのコードを使ってそのまま
Ahoy – Railsに組み込むアクセス解析ライブラリ
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 新しいWebサイトを作ると何となくGoogle Analyticsを選んでしまっています。しかし他にも選択肢はありますし、データを外部に出せない場合（イントラなど）もあります。そういった場合、どのようにアクセス解析を行えば良いでしょうか。 もし使っているフレームワークがRuby on RailsであればAhoyを使ってみると良いかもしれません。Railsのモデルに組み込めるアクセス解析機能を提供します。 Ahoyのインストール まずはGemfileに記述します。 gem 'ahoy_matey' インストールと初期設定を行います。 $ bundle install $ rails generate ahoy:install $ rake db:migrate 後は app/asse
深いインデントであっても色付けすれば見やすく·JavaScript Scope Context Coloring MOONGIFT
JavaScript Scope Context Coloringはシンタックスやスコープによる色づけができるJavaScript用ハイライトライブラリです。 JavaScriptのプログラミングではコールバック方式のコーディングが多いため、インデントが深くなりがちではないでしょうか。そこで使ってみたいカラーリングツールがJavaScript Scope Context Coloringです。 分かるでしょうか。スコープによってカラーリングが変わっています。 こちらは通常のシンタックスによるカラーリング。 さらに分かりやすくするとこんな感じに。8階層までサポートされています。 インデントがあまり深くなると可読性が下がるために個人的には好きではないのですが、深くなってしまうのであればそれに向いた見せ方があると思われます。変数のスコープも色づけで分かるようになったりすると変な不具合が紛れ込まな
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のオープンソース・ソフトウェア
まるでネイティブのようなUIを実現できる高機能JavaScript UIライブラリ·w2ui MOONGIFT
w2uiはデスクトップ、スマートフォン、タブレットに対応したJavaScript UIライブラリです。 新しいJavaScript UIライブラリの紹介です。名前はw2ui、多数のウィジェットを搭載したUIライブラリとなっています。 レイアウト。 グリッド。 詳細検索対応。 ツールバー。 サイドバー。階層表示に対応しています。 タブ。 フォーム。 ポップアップ。 ツールチップ。 その他ユーティリティ。 w2uiのサイズは37KB（ミニファイ&Gzip）で、これはExtJSの1/12、Kendo UIの1/6となっています。また、jQueryベースという特徴、全てのウィジェットをまとめて提供、IE9、Firefox7、Google Chrome、Safari5に対応となっています。デスクトップはもちろん、タブレットやスマートフォンにも対応しています。 w2uiはJavaScript製、MIT
Androidアプリを開発する際のベースにどうぞ！·Android Bootstrap MOONGIFT
Android Bootstrapは多彩な機能が実装されたAndroidアプリ開発ベースです。 Webサービス開発時においてBootstrapが活躍しています。そういったベースがあると開発がとてもスムーズになるのではないでしょうか。そこで今回はAndroid Bootstrap、Androidアプリ開発のベースを紹介します。 ログイン画面。 ユーザ一覧。 ニュース。 タイトルをタップすると記事詳細が表示されます。 チェックイン。 タップすると地図が表示されます。 メニューはログアウトのみ。 紹介動画です。 Android Bootstrapはフラグメント、ページャー、アカウント管理などの実装に加え、Android Mavenプラグイン、RoboGuice 2、ActionBarSherlock 4、ViewPagerIndicator、http-request、GSON、Robotiumと
ウィンドウサイズに合わせて自在にJavaScriptを実行する·Response MOONGIFT
ResponseはレスポンシブWebデザインを実現するのに必要な情報を取得できるJavaScriptライブラリです。 レスポンシブデザインを実現する際にスタイルシートだけで全てをこなすのは難しいかも知れません。ウィンドウの幅に応じて最適な見せ方を実現するためにJavaScriptの力が必要ならばResponseを使ってみましょう。 テストの画面です。ウィンドウや画面のサイズが出ています。 ウィンドウサイズを縮めると値がリアルタイムに変化します。 縦のスクロール値も出ます。 各種判定値が用意されています。 ウィンドウサイズによる簡易的な判定も可能です。 もちろんこのページ自体がレスポンシブです。 Responseを使えば現状のウィンドウサイズやスクロール位置などレスポンシブWebデザインを実現するのに必要な情報が一気に取得できます。さらにリサイズなどのコールバックにも対応しているので、表示し
複数のスライドをまとめて一つのHTMLプレゼンテーションに·slideshow.html MOONGIFT
slideshow.htmlはHTML5製のプレゼンテーションソフトウェアです。 最近ではHTMLベースのプレゼンテーションソフトウェアが増えてきました。HTMLのみで一から作るのも良いですが、今回はslideshow.htmlを紹介します。Rubyのサーバアプリケーションを使ってファイルを更新する度に自動でスライドショーを作成します。 最初の画面です。 矢印キー、スペースキー、マウスなどでスライドを切り替えます。 表示は順番に行われます。順を追って説明したりするのに便利そうです。 文字は大きめで分かりやすいです。 書き方。sectionで区切ります。スタイルはscopedをつけてスライドごとに適用します。 スワイプ操作も対応しているとのことで、iPadを使ったプレゼンにも向いていそうです。 フルスクリーン表示対応です。 デモ動画です。 slideshow.htmlはマスターに加えて各スラ
UIKitにインスパイアされたTwitter社製のUIフレームワーク·TwUI MOONGIFT
TwUIはTwitter社が開発しているGPUなどを使ったUIフレームワーク。 TwUIはMac OSX用のオープンソース・ソフトウェア。OSには大抵デフォルトで用意されているコンポーネントがあり、それを使うことでアプリケーションの開発を手軽にできるようにしている。だが、その枠内だけで十分かと言われるとそうでもない。 サンプルアプリ もっと複雑な描画をしたい、もっと高速化したいといったことを考えると標準の枠では収まらない新しい一手を考えなければならない。Twitterでさえそうだ。その実験モデルがTwUIになる。 TwUIは現在リリースされているTwitter for Mac OSXではない、次世代のTwitterクライアントに投入されるであろう技術のモックアップだ。起動するとテーブルビューが表示され、ウィンドウ下にツールバーが出る。iOS向けなどでよく知られるTwitterクライアント風
appMobi社製。チェック必須のスマートフォン向けjQuery·jQ.Mobi MOONGIFT
jQ.MobiはjQueryをスマートフォン、HTML5に最適化・リライトしたJavaScriptライブラリです。 jQ.MobiはappMobi社の開発したHTML5をターゲットとしたスマートフォン向けJavaScriptフレームワークです。 黒を基調にした格好いいUIです。 jQueryをリライトして作られておりAPIは似ています。 フォーム系も格好いいです。 プラグインにも対応しています。 セレクタもこんな感じに書けます。jQueryで慣れた人なら問題なさそうです。 Ajaxも用意されています。 jQueryライクです。bindも使えます。 スマートフォンやiPadなどを判別する機能もあります。 デモ動画です。 jQ.MobiはjQueryの肥大化に対して開発されたようで、HTML5のみ対応ながら軽量でスマートフォン向け独自の機能を備えたライブラリとなっています。ベンチマークもありま
継続的インテグレーションに。iOSを自動操作してテスト·KIF MOONGIFT
KIFはiOSアプリを自動操作するテストフレームワークです。 iOSにおいて継続的インテグレーションを実現するのに使えるのがKIFです。アプリの操作を自動で行って、テストの自動化を推進してくれます。 iOSシミュレータ、実機の双方で動きます。 テストの記述です。タップするラベルを指定しています。 デモ動画です。シミュレータはマウスでは触れていません。 KIFではテストコードをアプリに組み込みます。テスト自体Objective-Cで記述するようになっています。なお、ドキュメントにないAPIを使っていますので、アプリ申請の際に注意が必要です（KIFでは使い方を細かく書いています）。なおKIFはモバイル課金プラットフォームで知られるSquareを開発している企業のソフトウェアになります。 KIFはObjective-C製、Apache License 2.0のオープンソース・ソフトウェアです。
Rubyでバーコードスキャン·Ruby Barcodescanner MOONGIFT
Ruby BarcodescannerはRuby製のフリーウェア（ソースコードは公開されている）。携帯電話にはカメラがついているので、外で写真を撮るのも手軽だ。そうした外部の情報をアップロードして楽しむサービスは数多い。書籍のバーコードを使って楽しむサービスも面白い。 実行した所 携帯電話自体にバーコードスキャナーの機能があればそのまま使えるが、それがない場合は別途連携を考える必要がある。例えばRuby Barcodescannerを使ってみると良いだろう。Ruby Barcodescannerは画像を読み込んでバーコードスキャンを行うRubyライブラリだ。 元になるのが画像というのが良い。写真やスキャナーで取り込んだ画像をそのまま利用できる。画像の取り込みにはImageMagickを使い、実際のスキャンはzbarというオープンソースのバーコードライブラリを使っている。Ruby Barco
注目！サーバサイドからjQueryを使ってDOM操作·nodeQuery MOONGIFT
nodeQueryはnode.js用のサーバサイドjQueryで、サーバサイドでクライアントサイドのDOMを変更できたりします。 node.jsでjQueryライブラリを読み込むと、jQueryが提供するメソッドを使えますが、さらに一歩進めたのがnodeQueryです。サーバサイドからクライアントサイドの描画を変更できたりしてとても面白い実装ができます。 インストールはnpmで行います。 まずサンプルのブログです。普通に表示されているのが分かります。 サーバサイドです。node.jsのスクリプトの中でHTMLタグを出力しているのが分かります。構文にjQueryが使われているのも分かります。 ブログの新規投稿です。 投稿できました。 Twitter検索です。 時間が更新されるデモです。サーバサイドの時間であるのがミソです。 サーバサイドのソースです。 nodeQueryを使うとサーバサイドと
Androidでも文明を育てる！·Freeciv for Android MOONGIFT
Freeciv for Androidはオープンソースのシビライゼーション、FreecivをAndroidに移植したソフトウェアです。 個人的にシミュレーション系のソフトウェアは大好きです。シムシティをはじめとするシム〜シリーズをやっていると時間も忘れてしまうくらいハマるので怖くて最近はできません。同様に大好きなのが文面を作り上げるシビライゼーションなのですが、Androidでも楽しめるのがFreeciv for Androidです。 インストール画面です。デバイスによりますが、かなり時間がかかります。 まだまだインストール中…。 終わりました！さっそく開きます。 起動してもまだインストールです。 さらにインストール。結構時間がかかります。 ようやく起動しました。サウンドはないようです。 色々準備に時間を要します。 設定です。国はAからはじまる国名だけが選べるようです。 ゲーム開始です。小
jQueryで作られた本格的表計算ソフトウェア「jQuery.sheet」 - MOONGIFT|オープンソース・ソフトウェア紹介を軸としたITエンジニア、Webデザイナー向けブログ
jQuery.sheetはjQueryで作られたWebベースの表計算ソフトウェアです。 業務システムなどではWeb上にテーブルを表示するというケースがよくあります。さらに一歩進んで表計算のように集計したり並び替えたりしたいという無茶な要望が出るかも知れません。そんな時に使ってみたいのがjQuery.sheetです。jQuery製の表計算ソフトウェアです。 カラムはもちろん、グラフの表示までできてしまう本格的な表計算ソフトウェアです。 最大化表示。セルの値を参照することもできます。 テキストだけではなくラジオボタン等も使えます。 関数も多彩に用意されています。 編集しているところ。 文字装飾を変更します。メニューから選択できます。 HYPERLINKはその名の通りリンクを埋め込みます。 データにはHTML/XML/JSONが使えます。エクスポートも各フォーマット向けに可能です。 JavaSc
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
