ITエンジニア/デザイナ向けにオープンソースを毎日紹介

プレミアムユーザー限定記事

MOONGIFTプレミアムは、月額500円の有料サービスです。詳細はこちらから

2017/12/14
できることを全力でやる
2017/11/25
恥ずかしさを感じないためにできること
2017/11/11
プロジェクトを遅延させないコミュニケーションパス管理

もっと見る

List

  • 2015/03/24

SkyBlue - ミニマム、軽量なCSS3フレームワーク

Bootstrapは非常に高機能で便利なフレームワークですが、多機能故にカスタマイズがしづらくなっています。自由自在に見た目を変更しつつ、全体の統一感を保つのは至難の業でしょう。そこまでするなら自分でイチから書く方が楽というデザイナーの方は多いはずです。SkyBlueはBootstrap対抗という訳ではありません。ただ...

List

  • 2015/03/23

animatedModal.js – アニメーションしながら表示される大きなモーダル

モーダルウィンドウといえばリンクやボタンをクリックした際などに小さく表示されるウィンドウです。しかしスマートフォンなどの画面領域が小さいブラウザの場合、画面全体に広がって表示されます。そんな大きなモーダルをデスクトップやタブレットでも使えるのがanimatedModal.jsです。大きく表示されるのでインパクトがあり、...

List

  • 2015/03/23

StyleCI - PHPのコーディングスタイルをチェック

CI、つまり継続的インテグレーションは何もコードのデバッグにだけ適用されるものではありません。自動的に、かつ継続的に何らかのチェックする仕組みを作れればCIになりえるでしょう。StyleCIもその一つと言えます。StyleCIがチェックするのはPHPのコーディングスタイルになります。## StyleCIの使い方!Git...

List

  • 2015/03/22

RICOH THETA Live Viewer – RICOH THETAの映像をWebブラウザから閲覧

RICOH THETAは全天球写真が簡単に撮れるデバイスで、最新版では動画の撮影も行えるようになっています。さらにAPIがあり、RICOH THETAと接続して連携するサービスを作ることもできます。RICOH THETA Live Viewerはその一つで、RICOH THETAの映像をデスクトップから閲覧できるように...

List

  • 2015/03/22

NativeScript - 夢再び。JavaScriptでiOS/Androidアプリを開発

ワンソース、マルチプラットフォームは甘美な響きであり、誰もが夢見る存在です。ずっと昔から言われており、アプリ開発において最も望まれている存在かも知れません。かつてはTitaniumが有力候補が出てきたのですが、最近ではあまり聞かれません。そこで登場したのがNativeScriptです。## NativeScriptの使...

List

  • 2015/03/21

wik – localStorageにデータを保存するWikiエンジン

Wikiは情報共有のサービスですが、個人であっても情報を手軽に蓄積できるので便利です。メモ代わりに使っている人も多いのではないでしょうか。そんな方に使ってみて欲しいのがwikです。サーバ不要ですぐに使える超お手軽なWikiエンジンです。## wikの使い方!こちらがトップページです。

List

  • 2015/03/21

Enable right click - 右クリック禁止サイトでも右クリック可能に

Webは自由なものであり、何らかの束縛があると思いの外大きなストレスを感じるものです。それはHTMLだけでなくブラウザの操作についても同様です。その一つが右クリック禁止ではないでしょうか。JavaScriptをオフにしたり、ショートカットから操作したりすれば右クリックしたりソースコードが読めたりするのにも関わらず右クリ...

List

  • Premium_s 2015/03/20

業務で使えるオープンソース(150)「Webファイルアップロード」

今回のテーマはWebファイルアップロードです。ファイルアップロードはHTML4の時代には本当に使い勝手が悪く、機能が貧弱でした。HTML5になって幾分マシになってきましたが、素のままではまだまだ機能不足です。そこでHTML5のファイルアップロード機能に関する内容と、より高機能にしてくれるオープンソース・ソフトウェアを紹...

List

  • 2015/03/20

Gun – データベース版Dropboxとも言うべき組み込み型データベースエンジン

Webアプリケーションにおいてデータベースを利用するのは当たり前になっています。しかしWebアプリケーション化が進んでいる現在、サーバとのデータ送受信においてはAjaxを使わなければなりません。Gunはそんな構成をもっとシンプルで分かりやすくしてくれます。各Webブラウザごとにデータベースを持ち、かつそれを自動的に同期...

List

  • 2015/03/20

Sharelock - 外部認証を用いてセキュアなメッセージ送受信

秘密のメッセージを送る際に、どうしたら手軽で、かつセキュアに保てるでしょうか。長いURLを生成する方法もありますが、URLが漏れてしまえば終わりです。かといって面倒な手順を踏ませるのは元々の手軽に共有という点において問題があります。手軽とセキュア、そのバランスを取ったソフトウェアがSharelockになります。専用クラ...

List

  • 2015/03/19

littlebox – スタイルシートだけで作られたアイコン集

最近はアイコンを画像で提供することが少なくなってきています。バイナリなのでサイズの可変に弱く、サイズも大きくなりがちです。そこで使われるのがWeb Fontなのですが、こちらもちょっとした内容なのにサイズが大きくなってしまいがちです。そこで使ってみたいのがlittleboxです。スタイルシートだけで作られたシンプルなア...

List

  • 2015/03/19

Konva - Canvasで2Dを描くためのJavaScriptフレームワーク

HTML5における表現力向上に期待がかかるのがCanvasやWebGLです。とはいえこれまでのHTML並に書きやすいという訳ではなく、描画や操作をするには異なる技術の習得が必要になります。そこで使ってみたいのがKonva、2DをCanvas上に描画するためのライブラリになります。## Konvaの使い方!サンプルです。...

List

  • 2015/03/18

Sldn – SlideShareのスライドダウンローダー

SlideShareに勉強会などで使った資料をアップロードしている方はたくさんいます。中にはダウンロードして使いたい資料もあるでしょう。しかしSlideShareではパーミッションを設定することでダウンロード不可に指定ができます。それでも資料が欲しい!という方はSldnを使ってみましょう。## Sldnの使い方インスト...

List

  • 2015/03/18

localFont - Web FontをlocalStorageを使ってキャッシュ

Web Fontを使うとこれまで画像で作っていたロゴのようなものをテキストで表現できたり、さらにアイコンフォントのように大きさや色を自由に決められるアイコンが使えるようになります。問題点としては画像一つに比べるとデータ量が多く、サイズが大きくなってしまうことでしょう。そこで使ってみたいのがlocalFontです。## ...

List

  • 2015/03/17

ExcelJS – node.jsからExcelファイルを読み書き

Windowsなんて嫌だ!Officeファイルなんて嫌い!なんて言いつつもシステム開発時にお世話になるのがExcelです。CSVファイルを出力したり、逆に読み込む機能は良く作るのではないでしょうか。わざわざCSVを介さずにExcelファイル(xlsx)をそのまま読み込んだり、書き出せるのがExcelJSです。node用...

List

  • Premium_s 2015/03/17

業務で使えるオープンソース(149)「localStorage」

HTML5で様々なAPIが追加されていますが(狭義ではHTML5に含まれないものも多いですが)、特に利便性が高くて使いやすいと思うのがlocalStorageです。localStorageを使ったWebアプリケーションや、すぐに使えるlocalStorageを使ったライブラリを紹介します。## Cookieより大容量C...

List

  • 2015/03/17

Staytus - サービスの状態を可視化するダッシュボード

Web APIを提供していると、サービス利用者向けにサービスのステータスを表示したいと思うことがあります。定期メンテナンスであったり、障害でサービスが停止している場合も、ユーザに適切に情報発信できる必要があります。GoogleやApple、Amazonなどは行っていますが、Staytusを使えば小さなサービスであっても...

List

  • 2015/03/16

Blackhole – 軽量、レスポンシブ対応のSass/CSSフレームワーク

スタイルシートのフレームワークはとても数多くあります。有名なところではBootstrap/Zerb/Ionicなどがありますが、有名なものは情報が多い一方、使った時のデザインが似通ったものになってしまいます。そこで人と違ったフレームワークを採用するのも面白さがあります。もちろんカスタマイズのしやすさなども大事でしょう。...

List

  • 2015/03/16

animachine - Google Chrome上でGreenSockを使ったHTML5アニメーションを作成

GoogleがFlashバナーを自動的にHTML5に変換する広告配信技術を発表しました。これにより既存資産を活用したままモダンなWeb環境においても広告配信が可能になります。つまりHTML5でもFlash並のアニメーション表現が可能になっているのです。そこでさらに高度なアニメーションを実現したい時に使えるのがGreen...

List

  • 2015/03/15

React.rb – ReactをRubyで書く

最近にわかに盛り上がっているReactですが、独自の書き方やHTMLとJavaScriptが密接することに対して何となく避けてしまっている人も多いかも知れません。サーバサイドでも使えると言ってもnodeを使うのが難点に感じる人もいます。もしあなたがRuby使いで、Reactを使ってみたいならばReact.rbを使うとい...