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

Webの記事一覧

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

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

もっと見る

List

  • 2019/10/11

VOIDCALL - 13KBという制限の中で作られたJavaScript製ゲーム

かつてのファミコンゲームがごくわずかなリソースを活用して作られていたりして話題になります。リソースが潤沢な現在ではなかなか思いつかないようなアイディアに溢れています。今回紹介するVOIDCALLはJavaScriptのゲームを13KB以下で作成する、そんなコンテストで作られた作品です。## VOIDCALLの使い方ゲー...

None

  • 2019/10/10

jsonbox.io - ユーザ登録不要で使えるJSONストレージサーバ

ただちょっとしたデータを保存したいだけなのに面倒なユーザ登録であったり、設定が必要となると気持ちが萎えてしまいます。せっかくの作ろうという熱量を維持するためには、とにかく簡単に使える仕組みが必要です。今回紹介するjsonbox.ioはまさにそのためのソフトウェアです。ユーザ登録も不要でJSONデータの送受信ができます。...

List

  • 2019/10/09

Web Radio Visualizer - Webラジオを音源としたビジュアライザー

オーディオのビジュアライザーをずっと見ていても飽きないという人は多いでしょう。ただ音楽を流すだけでなく、可視化することで別な楽しさが生まれます。そのため、幾つものパターンが作られています。今回紹介するWeb Radio VisualizerはWebラジオを音源としたビジュアライザーです。## Web Radio Vis...

List

  • 2019/10/06

Goodwork - ストレスないプロジェクト管理

システム開発に限りませんが、プロジェクト管理の有無が成否を分けるのは間違いありません。ステータスや新しい要望を適切に管理することで、スムーズな開発を実現できます。今回紹介するのはLaravel製のシンプルなプロジェクト管理、Goodworkです。## Goodworkの使い方ホーム画面です。並んでいるのはタスクです。!

List

  • 2019/10/05

Ackee - プライバシーへ配慮したアクセス解析

Webサイトのアクセス解析と言えばGoogleアナリティクスを使っているケースが多いですが、社内のセキュリティ上利用できないという場合もあるでしょう。そうした時には代替になるソフトウェアが必要です。今回紹介するのはnodeで作られたAckeeです。## Ackeeの使い方基本的にはページビューとリファラーが取れます。!

List

  • 2019/10/04

Sshwifty - Webブラウザ向けのSSH/Telnetクライアント

従来はローカルアプリケーションだったものが、どんどんWebアプリケーション化しています。開発環境においてもクラウドIDEが使われるようになっています。殆どの操作がWebブラウザ上でできるようになるでしょう。今回紹介するSshwiftyはSSHクライアントをWebブラウザベースで提供します。## Sshwiftyの使い方...

List

  • 2019/10/04

MarioHTML - Web製のマリオブラザーズ

マリオブラザーズは登場以来、世界中の人たちに愛されるキャラクターになっています。そして、開発者にとってはマリオブラザーズ風のゲームを作るのが楽しみの一つにさえなっています。今回紹介するMarioHTMLはWebブラウザ上で遊べるマリオになっています。## MarioHTMLの使い方ゲーム画面です。土管には入れませんが、...

List

  • 2019/10/03

Featmap - Webでユーザストーリーマッピング

ユーザーストーリーマッピングという考え方があります。左右にユーザ体験の価値を時系列とし、上下に優先順位を指定してストーリーを並べていきます。類似したストーリーは優先順位に沿って上下に並べます。そんなユーザーストーリーマッピングによってストーリーの漏れを防ぐことができます。Featmapはまさにそのためのソフトウェアにな...

List

  • 2019/10/03

hashids.js - 数字からYouTube風のID文字列を生成

WebサービスでユニークなURLを提供する際に、IDを数字のまま出してしまうとデータ件数が何件あるのかバレてしまいます。そこでランダムな文字列を作ってIDの代わりにしたりします。しかし、数字のIDとランダムな文字列、二つ管理するのは面倒です。そこで使ってみたいのがhashids.jsです。数字からYouTube風なID...

List

  • 2019/10/02

Universal Résumé Template - 多彩なデバイスに対応したレジュメテンプレート

日本であれば履歴書のフォーマットが一つの形に決まっていますが、多くの国ではそういったものはありません。特定の紙のフォーマットではなく、見やすく自分の経歴や経験を記述するのが肝要になります。今回紹介するUniversal Résumé Templateはとある開発者の履歴書(レジュメ)であり、テンプレートとして再利用でき...

List

  • 2019/10/02

The Most Dangerous Writing App - 書き続けることが強制されるテキストエディタ

集中して文章を書くためにはどうしたら良いでしょうか。自然と筆が進んでゾーンに入れる人もいますが、それは特別な人たちです。凡人たる我々は何かきっかけが必要です。人によってはご褒美だったり、逆にペナルティだったりするでしょう。今回紹介するThe Most Dangerous Writing Appはその名の通り、ペナルティ...

List

  • 2019/10/01

Firefly III - 機能豊富なWeb家計簿

お金の管理は大事です。残高も気にせずお金を使っていれば、貯金などできようもありません。お金に関して言えばマイクロマネジメントしても良いでしょう。特に何か目的のある貯金であれば尚更です。今回はWebベースの家計簿、Firefly IIIを紹介します。多機能、レポートの多さが魅力です。## Firefly IIIの使い方ダ...

List

  • 2019/09/30

laptop CSS - ラップトップ風の枠を表示するCSS

同じ映像であっても、その見せ方によって受ける印象は大きく異なります。レトロな映像を、同じくレトロなテレビの枠に当てはめて再生すると雰囲気が出ます。人は単純に映像だけでなく、その周辺環境の影響も受けて楽しむことができます。今回紹介するlaptop CSSはそんな映像を表示する枠のようなものです。何がマッチするのか考えさせ...

List

  • 2019/09/28

SOUNDSCAPE - WebAudioを使って音楽を自動生成

BGMを必要とした時、その著作権は注意が必要です。下手に使うと後で某団体から請求が来るかも知れません。フリーな音楽を使えばそういった心配はありませんが、探すのが大変です。そこで使ってみたいのがSOUNDSCAPEです。Webブラウザ上で動的に音楽を生成します。## SOUNDSCAPEの使い方音が出ないのが残念ですが、...

List

  • 2019/09/27

Leon Sans - アニメーションもできるJavaScript製のフォント

フォントを変えると、文面の印象ががらっと変わることがあります。フォントによって受ける印象はそれぞれで、最適なものを選ばないといけません。同じフォントであっても太さが変わるとまた違うでしょう。今回紹介するLeon SansはSans Serif風のフォントですが、プログラマブルな特徴があります。## Leon Sansの...

List

  • 2019/09/26

Statusfy - ステータスページをオープンソースで

クラウドサービスを使ってビジネスを構築するのが当たり前になっている現在、サービスのステータスページは重要になっています。サービスが停止するのは問題ですが、その状態すら分からないのは大きな問題です。そこで使ってみたいのがStatusfyです。オープンソースでステータスページを立ち上げられます。## Statusfyの使い...

List

  • 2019/09/25

dir-tree - Web上でtreeコマンド風ディレクトリ構造を作成

ドキュメントでディレクトリ構成を書くことがありますが、その際にはよくtreeコマンドを使います。しかし、余計なディレクトリが含まれないようにするなど、加工も必要で面倒だったりします。そこで使ってみたいのがdir-treeです。Web上でディレクトリのツリー構造を作成します。## dir-treeの使い方+ボタンでディレ...

List

  • 2019/09/25

fullstack.ai - 自転車での経路時間を機械学習で推測

機械学習を使って何ができるのか。あまりにも汎用性が高いため、何でも使えるイコール何に使ったら良いか分からないといった状態になっていそうです。そこで必要なのが実例です。多くは画像や動画など、試すのが難しそうなものが多いですが、今回紹介するfullstack.aiはもっと手軽に試せそうです。## fullstack.aiの...

List

  • 2019/09/24

IT勉強会用 名刺ジェネレーター - 開発者のための名刺ジェネレータ

勉強会には個人として参加しており、会社の名刺は出したくないと考えている人は大勢います。メールなどの面倒なやり取りではなく、Twitterなどでコミュニケーションを取りたいと思うことでしょう。そこで使ってみたいのがIT勉強会用 名刺ジェネレーターです。開発者にぴったりな名刺を作成できます。## IT勉強会用 名刺ジェネレ...

List

  • 2019/09/24

Recharts - React用のグラフ/チャートコンポーネント

Webの表現力を高めてくれるのがグラフ、チャートライブラリです。ある時は円グラフ、ある時は棒グラフとニーズは様々です。そのため、多くのグラフに対応していれば、それだけ価値が高まります。今回はRechartsを紹介します。React用のチャートコンポーネントです。## Rechartsの使い方グラフのサンプルをスクリーン...