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

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

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

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

もっと見る

List

  • 2018/12/16

Image Map Resize - イメージマップをレスポンシブに

地図や写真などで一部をクリッカブルにする際に、昔はイメージマップを使うのが一般的でした。今はJavaScriptやCanvas、SVGで処理するかも知れませんが、イメージマップもWeb標準として利用できる機能です。ただし昔の機能なので、座標の設定などで制約が多い機能でもあります。そんなイメージマップをレスポンシブにして...

List

  • 2018/12/16

Tabulator - これはすごい。HTMLテーブルを高機能に

テーブル表示はWebシステムのデファクトとも言えます。業務システムはいうに及ばず、管理者画面などでも必ず求められる表示です。そしてただ表示すればいいという訳ではなく、ソートやフィルタリング、インラインでの編集など様々な機能が求められるものです。そんな多機能なテーブル表示を実現してくれるのがTabulatorです。多くの...

List

  • 2018/12/15

NES.css - ファミコン風サイトになるCSS

コンピュータはどんどん進化しており、より繊細なグラフィックス、リアルに近づく3D、臨場感あふれるサウンドといった具合に私たちを引きつけ続けています。そんな中、初代ファミコンもまた人気を持ち続けています。8bitでレトロ、とても今のコンピュータとは比較にならない代物であるにも関わらず、今なお多くの人たちを魅了しています。...

List

  • 2018/12/15

nginxconfig.io - Web上でnginxの設定を作成

nginxをHTTPサーバに採用しているケースは増えていると思います。しかし機能も多数ある中で、ちゃんと全体を把握した上で設定できているでしょうか。バージョンアップなどに伴って、これまでなかった機能が追加されている可能性もあります。設定の取りこぼしもあるかも知れません。そんな悩めるサーバ管理者に送りたいのがnginxc...

List

  • 2018/12/14

Go wasm - Goで作ったWebAssembly版JavaScript実行環境

WebAssemblyを使うことでWebアプリケーションを高速に実行できるようになります。RustはDOMやネットワークを扱うのが困難ですが、Go1.11以降では対応しています。これによってWebAssemblyを使ったWebアプリケーションの可能性が大きく飛躍しました。そんなGoでJavaScriptを実行できる環境...

List

  • 2018/12/14

de - Go製のプログラミングエディタ

プログラミングエディタは開発者にとっての仕事道具と言えます。それだけにこだわりをもって選定しなければなりません。秀丸でもAtomでもVS Code、Vim、Emacsなどどんなエディタであっても手に馴染んで開発生産性があがるものを選ばなければいけません。今回紹介するdeは新しく登場したエディタで、Goで作られています。...

List

  • 2018/12/13

夜空ノ贈リ物 - CSS3を駆使して作られたアニメーション教本

CSS3が計算処理やアニメーション処理をサポートしたことによって、CSS3を駆使した作品が増えています。こんなことまでCSSでできるのかと驚かされるものも多いです。そんな作品を作ってみたいと思う方もいるのではないでしょうか。そんな方にぜひチェックして欲しいのが夜空ノ贈リ物です。CSS3を駆使して作られた作品であり、CS...

None

  • 2018/12/13

js-green-licenses - JavaScriptプロジェクトのライセンスをチェック

オープンソースの基本であり、肝なのがライセンスです。さらにライブラリを使っていたりすると、そのライセンスも関わってきます。ライセンスの誤った利用はビジネス上のリスクになり得ますが、それでもオープンソースを一切用いないという選択は困難になってきています。もしNode.jsをプロジェクトに採用しているならば使ってみたいのが...

List

  • 2018/12/12

Magic-Grid - ウィンドウ幅に応じてグリッドを自在に並び替え

Webページをレスポンシブに対応させようと思うとグリッドベースのデザインを採用することが多いでしょう。デバイスの幅に応じて並べるグリッドの数を増減させることで表示をカスタマイズできます。多くのUIフレームワークがグリッドに沿ったUIを提供しています。今回紹介するMagic-Gridはグリッドだけを提供するライブラリです...

List

  • 2018/12/12

エディ太郎 - 下書き専用エディタ

SlackやGitHubのIssueに投稿する際に、長文はあらかじめ別なテキストファイルに書いたりしないでしょうか。いきなり本番のサービス上で書くのは躊躇してしまうので、一旦下書きに書くという人は多いはずです。確かに下書きであれば間違って公開されることもありません。そこで使ってみたいのがエディ太郎です。下書き専用のエデ...

List

  • 2018/12/11

Current Device - デバイス判定をスタイルシートに反映

Webページにアクセスするデバイスが多様化している中、JavaScriptで各デバイスを判別して表示分けしているWebサイトも多いのではないでしょうか。こういった実装を都度行うのはとても面倒ですし、条件分岐も増えがちです。そこで使いたいのがCurrent Deviceです。デバイスに応じてスタイルシートにクラスを追加し...

List

  • 2018/12/11

WatchingU - インターネットオタクのためのRSSリーダー

オンライン上の情報を効率よく集めるのにRSS(フィード)リーダーは最適です。しかしビジネス的には難しいようで、多くの会社がフィードリーダーから撤退しています(それこそGoogleリーダーさえも)。そんな中生き残るのはむしろオープンソースなのかも知れません。今回紹介するWatchingUはWebベースのRSSリーダーで、...

List

  • 2018/12/10

Ervy - CUIで棒/円/折れ線/ゲージグラフを表示

コンソール用のアプリケーションが増えています。UIをあまり作り込まずに済み、さらに結果の出力も簡単にできます。その反面、グラフのような可視化は苦手です。テキストで出力して、別なライブラリで可視化するのではないでしょうか。そこで使ってみたいのがErvyです。ターミナル上で簡易的な可視化を実現できます。## Ervyの使い...

List

  • 2018/12/10

spacetime - JavaScriptの高機能時間ライブラリ

JavaScriptで悩ましいのが時間の扱いではないでしょうか。Webブラウザごとによって異なるタイムゾーン、年月日を表示するのにもばらばらのメソッドを実行するなど面倒な操作が多いと感じます。そこで使ってみたいのがspacetimeです。JavaScriptにおける日時関連の処理を手軽にしてくれるライブラリです。## ...

List

  • 2018/12/09

tiptap - Vue.js向けのリッチなWYSIWYGエディタ

WYSIWYGなエディタは開発者ではない人たちにコンテンツを作ってもらいたい時に活躍します。HTMLを手書きするのは困難ですし、編集している内容と結果が異なるので、結果を想像しながら作るのは慣れない人にとっては難しいでしょう。もしVue.jsを使っているならば導入したいWYSIWYGエディタがtiptapになります。多...