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

ライセンス - MIT Licenseの記事一覧

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

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

もっと見る

List

  • 2019/08/31

svg2pdf.js - Webブラウザ上でSVGをPDF化

Webブラウザで表示している内容をPDFにしたいというニーズはよくあります。サーバ側でレンダリングして出力するのも良いですが、何かと面倒です。文字だけであればまだしも、画像をドローイングされた内容をPDF化するのはさらに大変です。そこで使ってみたいのがsvg2pdf.jsです。WebブラウザだけでSVGをPDF化します...

List

  • 2019/08/30

kthoom - Webベースのコミックビューワー

オンライン上にはたくさんのコンテンツがあります。しかし、それらを閲覧するためには専用のビューワーが必要です。ローカルアプリケーション型の場合、コンテンツをいちいちダウンロードするのが面倒です。そこで必要なのがWebベースのリーダーです。今回はコミックビューワーのkthoomを紹介します。## kthoomの使い方メイン...

List

  • 2019/08/30

Regex Colorizer - JavaScriptの正規表現をハイライト

正規表現はプログラマにとっても面倒なもので、間違えることがしばしばあります。プログラミングがエラーになるならまだしも、不具合につながったりすると目も当てられません。そこで使ってみたいのがRegex Colorizerです。正規表現をハイライト表示し、分かりやすく可視化してくれます。## Regex Colorizerの...

None

  • 2019/08/29

gitomatic - Gitリポジトリを監視して自動コミット&プッシュ

Gitでバージョン管理する場合、ちゃんと差分をチェックしてコミット&プッシュした方が良いのは分かります。しかし、個人のリポジトリでバックアップ代わりに運用するならば自動でプッシュしてくれる方が便利です。そこで使ってみたいのがgitomaticです。指定したディレクトリを監視して自動でファイルの追加、プッシュを行ってくれ...

List

  • 2019/08/28

Artichoke - WebAssemblyで実装されたRuby

Webブラウザ上でJavaScript以外のプログラミング言語を実行したいと言うニーズはとても強くあります。一つはJavaScriptで実行エンジンを開発する方法、またはコンパイルしてJavaScriptを生成する方法などがあります。最近有力なのがWebAssemblyで実行エンジンを実装する方法です。今回紹介するAr...

None

  • 2019/08/28

psyche - コンパイルしてWebAssemblyを生成する専用言語

WebAssemblyはプログラミング言語ではなく、様々な言語から生成されるWebブラウザ上で動作するバイナリフォーマットです。CやC++、Rustで書くのが基本ですが、GoやJava、C#など多彩な言語からWebAssemblyを生成できます。今回紹介するのはpsycheという専用言語で、OCamlで実装されています...

List

  • 2019/08/27

CJSS - CSSベースのWebビューフレームワーク

最近はReact、Vue.jsなど仮想DOMを使ったビューライブラリが人気です。しかし、JavaScript内にHTML情報を埋め込むのでデザイナーの方にとってはちょっと辛いところがありそうです。そこで使ってみたいのがCJSSです。上記ライブラリとは逆で、CSSにHTMLなどの情報を埋め込んでしまうという、すごいライブ...

List

  • 2019/08/27

Filterizr - CSS3を使ったデータのフィルタリング、ソートライブラリ

Web上で情報を並べて表示する機会はとても多いです。そんな時、常に発生するのが並び替えや絞り込みのニーズです。データを消したり、並び替えて表示したりするのは意外と大変です。そこで使ってみたいのがFilterizrです。データのソート、フィルタリングに特化したライブラリです。## Filterizrの使い方利用例です。カ...

List

  • 2019/08/24

Silicon - ソースコードを綺麗な画像に

スライドの中でソースコードを取り扱いたいと思うことはよくあります。コードハイライトに対応していないと、見づらいものになってしまうでしょう。そのため、プログラミングエディタのコードをスクリーンショットで画像化したりしているかも知れません。そんな面倒はせずにSiliconを使えばコードを綺麗に画像化できます。## Sili...

List

  • 2019/08/23

pure JS WiFi QR Code Generator - 無線LAN情報を記載したQRコード生成

勉強会などでWiFi情報を載せたり、コワーキングスペースなどでWiFi情報を提示することがあります。あまり複雑なものにすると入力をミスしたり覚えるのが大変なため、安易なものを設定してしまいがちです。そこで使ってみたいのがpure JS WiFi QR Code Generatorです。QRコードから簡単にWiFi情報を...

List

  • 2019/08/22

Batsh - Bash/Batchのスクリプトを生成するプログラミング言語

システムの自動化を行う際によく使われるのがBashスクリプトになるでしょう。また、WindowsであればBatchファイルが使われます。macOSとLinuxは同じBashスクリプトでも良さそうですが、Windows向けに別な言語で作るのは面倒です。そこで使ってみたいのがBatshです。共通のスクリプトでBashスクリ...

List

  • 2019/08/22

SuperTinyIcons - 1KB以下の軽量アイコン集

アイコン集はいくら知っていてもいいものです。多彩なパターンに対応したものもあれば、特定の用途に使えるものもあります。様々なものを知っていれば、役立つ機会が多いにあります。今回紹介するSuperTinyIconsは1KB以下という小さなサイズが特徴なアイコン集となっています。## SuperTinyIconsの使い方ソー...

List

  • 2019/08/20

Udeler - Udemyの動画ダウンローダー

オンラインで学べるコンテンツが多彩に用意されているUdemy。Udemyを使って学んでいるという人も多いのではないでしょうか。コースは購入しますが、学習はオフラインでじっくり行いたいと言う人もいるのではないでしょうか。そんな方にお勧めなのがUdelerです。Udemy専用のダウンロードソフトウェアです。## Udele...

List

  • 2019/08/19

Celody - 音楽をフォーク、マージするマッシュアッププラットフォーム

Web APIを組み合わせて新しい作品を作る、マッシュアップという言葉は元々は音楽用語です。つまりクラブなどでかかる音楽のようなアレンジ、マッシュアップは音楽業界が本流でさえあります。今回紹介するCelodyは音楽をWebブラウザ上でフォークし、カスタマイズできるサービスです。## Celodyの使い方様々な楽曲を再生...

List

  • 2019/08/18

pinpog - アセンブリ製のピンポン風ゲーム

コンソールで行うピンポンゲームはコンピュータの初期の頃から存在したのではないでしょうか。跳ね返ってくるボールを跳ね返すだけの簡単なゲームですが、意外と熱中してしまいます。そんなピンポン風ゲームをアセンブラで作ったのがpinpogです。様々なOSで実行できます。## pinpogの使い方AキーとDキーで左右に動かします。...

List

  • 2019/08/17

console.chat - 開発者ツール上のチャット

開発者ツールは開発者以外の方には用のないツールでしょう。逆に開発者はデバッグ以外の目的でも利用しており、APIについて調べたり、予定なDOMを消したり、ユーザスクリプト的に使っていたりします。そんな開発者ツールを使った密かな遊びとしてconsole.chatを紹介します。名前の通り、開発者ツール上でチャットをします。#...

List

  • 2019/08/17

News Vue.js - Vue.jsのニュースポータル

フレームワークの使い方を学ぶのに、そのフレームワークを使っている事例を参考にするのは良い方法です。何ができるのか、何ができなさそうかが判断できます。そのフレームワークらしい書き方を学ぶこともできるでしょう。今回紹介するNews Vue.jsはVue.jsを学ぶのにぴったりなWebサイトです。Vue.jsに関するニュース...

List

  • 2019/08/15

Random World Map Generator - WebAssemblyで高速に3D/2D地図を生成

ゲームなどで地図データを使いたい時は良くあります。シムシティなどのシミュレーションゲームであったり、ローグライクなRPGでも使えます。そういった時の地図はある程度のランダム性があるとより面白いです。今回紹介するRandom World Map GeneratorはWeb上でランダムな地図データを生成してくれるサービスで...

List

  • 2019/08/14

graphql-cli - GraphQLを使った開発時に便利なCLIツール

GraphQLは注目度が高い技術であり、周辺ツールが充実してきています。それらのツールを組み合わせることで、GraphQLを使った開発がさくさくと進められるようになるでしょう。今回紹介するgraphql-cliは名前の通り、ターミナル上で便利なGraphQLツールになります。## graphql-cliの使い方初期設定...

None

  • 2019/08/13

ncc - nodeプロジェクトを一つのファイルにまとめる

nodeではnpmを使ってライブラリをインストールしてプログラミングを行います。そして配布する際にはnode_modulesを除き、各自がインストールします。しかしネットワークが必要だったり、場合によってはライブラリのインストールに失敗するかも知れません。そこで使ってみたいのがnccです。コードを一つにまとめてポータブ...