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

プログラミング言語 - JavaScriptの記事一覧

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

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

もっと見る

List

  • 2017/12/08

fullPage.js - フルスクリーンスライダー

最近のWebサイトでは一画面一コンテンツのページ構成が増えています。特にSPAやプロジェクトページなどで使われており、スクロールするとコンテンツ全体が切り替わります。Webページだけでなく、HTMLプレゼンテーションでも使えます。そうした表示に使えるのがfullPage.jsです。アイディア次第で色々な使い方ができるで...

List

  • 2017/12/08

blocks.js - 複雑なデータフローの可視化

システムには何らかの入力があって、それが処理されて出力されます。処理は一段階に限らず、複数のステップを経ることもあります。さらに入力ソースが複数名こともあります。そうした複雑なデータフローを表現するのに向いたライブラリがblocks.jsになります。## blocks.jsの使い方メイン画面です。各ノードが線でつながっ...

List

  • 2017/12/07

Multi-Step-Form-Js - フォームをマルチステップに変換

入力フォームが長かった場合、幾つかのステップに分割することがあります。そうした時、都度サーバに飛ばす方式が選ばれることが多いですが、その度にデータの送信とレンダリングが行われて面倒です。そこで使ってみたいのがMulti-Step-Form-Jsです。jQueryでフォームをマルチステップに変換してくれます。## Mul...

List

  • 2017/12/06

stacks-cli - 気になるWebサービスで何が使われているのか調査

イケてるWebサービスではどんなフレームワークやライブラリが使われているのか気になる人は多いでしょう。やはりトレンドのフレームワークを組み合わせているのか、はたまた意外と枯れた技術を使っているのか。そんな調査ができるライブラリがstacks-cliです。気になるWebサービスで実行してみましょう。## stacks-c...

List

  • 2017/12/05

Rich FileManager - Webベースのファイル管理

Webアプリケーションが増えていくと必要になるのが、OSの基本とも言えるファイル管理です。サーバ上のストレージに入ったファイルを閲覧したり、編集は別なWebアプリケーションなど利用法は様々に考えられます。そんなファイル管理としてRich FileManagerを照会します。ファイルのプレビューもできる多機能なファイルマ...

List

  • 2017/12/05

Cattaz - Markdownの中に独自アプリケーションを定義できるWiki

Markdownは便利ですが、物足りないと感じることも多々あります。そうした時に機能追加をすると、それは他のMarkdown記法には合わない、特別なものになってしまいます。そうやって特別なMarkdown記法が多数生み出されています。CattazはMarkdown記法をベースに、独自のアプリケーションが組み込めるように...

List

  • 2017/12/04

jquery-bubble-text - テキストアニメーションのjQueryプラグイン

アニメーションはただ静的に書かれているのに対して何倍も見た目のインパクトがあります。ともすると見逃されてしまいがちなテキストもアニメーションすることによってユーザに見てもらえるようになります。そんなアニメーション、特にテキストを動かしてくれるライブラリがjquery-bubble-textです。## jquery-bu...

List

  • 2017/12/02

adminMongo - WebベースのMongoDB管理

MongoDBはNoSQLのドキュメント型データベースとして最も有名な存在になっています。実際の開発でも使われるケースが増えているのではないでしょうか。そして開発している際に必要なのが管理画面です。今回紹介するadminMongoはWebベースのMongoDB管理システムです。## adminMongoの使い方ダッシュ...

List

  • 2017/12/01

Mailspring - 綺麗で使いやすいメーラー

最近ではWebメーラーが当たり前のように使われていますが、オフラインの時に使えないのが不便です。また、企業などではグループウェアなどと統合されたメーラーがまだまだ使われています。使いやすい、そして格好良いUIのメーラーを求めている方はMailspringを試してみましょう。## Mailspringの使い方まず最初のウ...

List

  • 2017/12/01

Jskomment - Ajaxの簡易的コメントシステム

ブログなどには必須のコメント機能ですが、静的なブログシステムでは実現できません。そこでよく使われるのがFacebookのコメントボックスなどですが、データを自分たちで管理したいというニーズもあるでしょう。そこで使ってみたいのがJskommentです。Ajaxを使ったコメントシステムです。## Jskommentの使い方...

List

  • 2017/11/30

Markdown Here - HTMLメールをMarkdownで記述

Markdownでドキュメントを書いたりしていると、普段からMarkdown記法で文章を書きたくなるでしょう。その筆頭としてあげられるのがメールです。HTMLメールを記述したくとも、HTMLでいちいち装飾するのは面倒です。そこで使ってみたいのがMarkdown Hereです。各種ブラウザ向けの機能拡張でMarkdown...

List

  • 2017/11/30

bitaddress.org - Web上でBitcoinウォレットを生成

Bitcoinは未来の通貨として登場し、すでに一定の地位を築きつつあります。Webブラウザベースで採掘する仮想通貨もあったりして、それで広告の代わりに収益をあげるなど新しい使い方も生まれています。今回紹介するオープンソース・ソフトウェアはbitaddress.org、Webブラウザ上でBitcoinのウォレットを生成す...

List

  • 2017/11/29

generate-license - オープンソースのライセンスファイルを生成

自作のソフトウェアをGitHubに公開する際にちゃんとライセンスを明示していますか。オープンソースに限らず、何らかのライセンスを明示しておかないと使い手としてはどういう権利で使えるかが分からずにとても困ります。そこで使ってみたいのがgenerate-licenseです。ライセンスファイルを生成してくれるコマンドです。#...

List

  • 2017/11/28

js2flowchart.js - JavaScriptのコードをフローチャート化

複雑なコードはバグを含みやすくなります。インデントは浅い方が良いですし、関数は短く機能は単機能になっている方が良いでしょう。そうした複雑性の基準はどうやって設けたら良いでしょうか。一つのアイディアとして使えそうなのがjs2flowchart.jsです。JavaScriptのコードをビジュアル化し、フローチャート化してく...

List

  • 2017/11/27

Sudachi - タイムテーブルを使ったタスク管理/スケジューラー

使いやすいカレンダーアプリケーションを探して、様々なソフトウェアを使っている方は多いでしょう。仕事であれば会社が決めたものを使わざるを得ませんが、個人用であればより使いやすいものを、と思ってしまうはずです。今回はメモやタスクとカレンダーが合体したSudachiを紹介します。## Sudachiの使い方メイン画面です。左...

List

  • 2017/11/27

billboard.js - インタラクティブ、プログラマブルなグラフライブラリ

HTML5の表現力を活かすにはJavaScriptの活用が欠かせません。SVGやCanvasを使って図を描画することはできますが、JavaScriptを組み合わせることでよりインタラクティブにしたり、マウスイベントを使ったりできます。今回紹介するのはbillboard.js、JavaScript製の再利用が容易なグラフ...

List

  • 2017/11/26

Loud Links - インタラクティブに音楽再生

Webサイトをよりインタラクティブに、訪問者に楽しんでもらいたいと思うならばユーザの行動に注目しましょう。ただボタンを押しただけでは面白くありません。そこで注目したいのが音です。Webサイトを訪問した途端に音楽が流れるのは嫌われますが、ユーザイベントに連動したものであれば嫌がられないかも知れません。使ってみたいのがLo...

List

  • 2017/11/25

tlx-editor - フォーム入力に特化したWeb components

Web componentsは多くの可能性を持っています。Web標準ではまだまだ貧弱なUIも、Web componentsを使うことでリッチであったり、複雑なUIコンポーネントが生まれていくことでしょう。今回紹介するtlx-editorはその一例です。入力系コンポーネントを一手に提供するライブラリになります。## tl...

List

  • 2017/11/24

permission.site - HTML5 APIの実装を確認する

HTML5によって多数のAPIが追加されています。それらはすべてのブラウザで使える訳ではなく、まだまだ実装に差異があります。それをチェックできるCan I use

List

  • 2017/11/23

Fengari - JavaScript製。Webブラウザ上で動くLua

JavaScriptはWebブラウザ上で動作することが保証されている唯一のプログラミング言語ですが、好きではないという人も多いようです。プログラミング言語の選択肢はもっと幅広く存在して良いはずです。Webブラウザ上であってもLuaを書きたい、という方はFengariを使ってみてはいかがでしょう。## Fengariの使...