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

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

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

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

もっと見る

List

  • 2017/09/20

Ordinance format jp - Markdownで日本の公文書を記述

Markdownは広く使われるようになっていますが、シンプルな記法だけに簡易的なHTMLへの変換以外のニーズ向けとなると使い勝手が悪いことがあります。そのためグラフを入れられるようにしたり、チャートを描けるようにするソフトウェアが作られます。今回紹介するOrdinance format jpもその一つです。日本の公文書...

List

  • 2017/09/20

Chrome Calendar Groups - Googleカレンダーをグルーピングして簡単に切り替え

Googleカレンダーを使っている方は多いでしょう。基本のカレンダーは一つですが、プライベートとビジネスで使い分けたり、さらに共有で他の人やプロジェクトごとにカレンダーを分けたりします。そうしているとカレンダーが予定だらけになってしまい、必要に応じて表示/非表示を使い分けるようになります。そうなったら入れておきたいのが...

None

  • 2017/09/19

psi-local - ローカルサイトにPageSpeed Insightsを適用する

Webページの表示速度が遅くて良い理由はありません。ユーザ体験はもちろん、Eコマースサイトなどでは売り上げに直結するほどです。Googleも表示速度を検索順位の指標に組み込んでおり、その指摘を行ってくれるサービスとしてPageSpeed Insightsを提供しています。しかしこのPageSpeed Insightsは...

List

  • 2017/09/18

Plyr - YouTube/VimeoをサポートしたWebメディアプレーヤ

動画コンテンツをWeb上で再生するのに使えるのがvideoタグです。しかし素のままではとても使い勝手が悪いです。使いやすくするためには専用のプレーヤライブラリが欲しいでしょう。今回紹介するPlyrはHTML5のメディアプレイヤーですが、YouTube/Vimeoにも対応しているのがポイントです。## Plyrの使い方こ...

List

  • 2017/09/17

Fruumo - Google Chromeで綺麗なタブページを

Google Chromeで新しいタブを開くとGoogleの検索窓とよく使うサイトが表示されます。最低限で良いのですが、毎回同じ画面では面白みがなく、飽きてしまうでしょう。そこで使ってみたいのがFruumoです。綺麗な写真を使って格好良いページを表示してくれるChrome機能拡張です。## Fruumoの使い方新しいタ...

List

  • 2017/09/17

MMRA - Mediumの可読性を上げるChrome機能拡張

日本では撤退してしまいましたがMediumはブログプラットフォームとして非常に大きなサービスです。カスタムドメインを使ってMedium上でブログを提供しているサービスも多数あります。しかし上下にバナーが出て、デザイン上非常に煩わしいです。そこで使ってみたいのがMMRAです。Mediumを見やすくしてくれるChrome機...

List

  • 2017/09/16

CrossStorage - クロスドメインで使えるlocalStorage

HTML5で追加されたAPIの一つにlocalStorageがあります。特定のサイト内で使える簡易的なストレージですが、一つのサイトでしか使えないのが難点です。時に別なサイトでも使いたいと思うことがあるでしょう(特にサブドメイン)。そこで使ってみたいのがCrossStorageです。クロスドメインで使えるストレージです...

List

  • 2017/09/15

adsenseLoader.js - AdSenseをレスポンシブWebデザインに対応させる

Webサイトの収益増加のためにAdSenseを使っている方は多いでしょう。そんなAdSenseの欠点として、レスポンシブでないという点があります。モバイル用とデスクトップ用で分けなければならず、運用が面倒に感じている方も多いでしょう。そこで使ってみたいのがadsenseLoader.jsです。これだけ入れればAdSen...

List

  • 2017/09/14

Marko - eBay製。サーバ/クライアント両方に対応したビューフレームワーク

Reactが導入したVirtualDOMという概念はあっという間に他のフレームワークにも影響を及ぼしていきました。最近では Webコンポーネントにも関連して、小さなパッケージを組み合わせる方法が主流になっています。今回紹介するMarkoもそんなフレームワークの一つです。特に高速な動作がポイントになっています。## Ma...

List

  • 2017/09/12

Responsivook - 縦書き/横書きに対応したレスポンシブな電子書籍

今のWebデザインはあらゆるデバイスに合わせてレスポンシブにすることが求められています。それは何もWebブラウザだけでなく、HTMLをベースとした文書にも適用されます。今回は電子書籍をターゲットにしたResponsivookを紹介します。縦書き、横書きともにレスポンシブになります。## Responsivookの使い方...

List

  • 2017/09/12

Chrome blank tab - Google Chromeの新規タブをブランクに

Google Chromeは新しいタブを開くとGoogleの検索窓が表示されます。また、よく使うサイトも一緒に表示されます。しかし、これらをクリックした経験はあるでしょうか。検索すらアドレスバーで行えば十分です。ということで使ってみたいのがChrome blank tabです。その名の通り、新しいタブをブランクにしてく...

List

  • 2017/09/10

wcode - Webブラウザ上で動作するプログラミングエディタ

AtomやVisual Studio Codeなど、Web技術を使ってプログラミングエディタが動くのが当たり前になっています。JavaScriptエンジンの高機能化はもちろん、HTML5の高機能化によって実現されています。wcodeは同じようにWeb技術を使ったコードエディタです。Webブラウザ上で動作するのがポイント...

List

  • 2017/09/09

qbrt - Geckoエンジンを使って特定サイトだけ立ち上がるアプリを生成

ElectronはWeb標準の技術を使ってデスクトップアプリケーションが作れるとあって人気があります。とは言え、よく使われるのはWebサイトのガワアプリで、特定のサイトだけ使える点においてセキュリティ上のメリットがあります。そんなガワアプリをコマンドラインで作れるのがqbrtです。さらにレンダリングエンジンとしてWeb...

List

  • 2017/09/09

Google Image Search extention for Safari - Googleの似た画像検索を呼び出すSafari機能拡張

Googleの画像検索はとても便利で、個人的によく使っています。ライセンスフリーの画像やアニメーションGIFを探すといった時に便利です。さらに便利なのが、似たような画像を探す機能です。画像をアップロードしても良いのですが、Google Image Search extention for Safariを使えばコンテスト...

List

  • 2017/09/07

drawio-desktop - Electron製。draw.io公式のドローツール

ElectronでWebサイトをラッピングする系統のソフトウェアはとても多いです。限定されたセキュリティ範囲で使えるのは便利ですが、結局のところ単なるガワアプリでしかないという印象があります。そんな中、drawio-desktopは違います。draw.ioがそのままデスクトップアプリケーションになったようなソフトウェア...

List

  • 2017/09/06

SketchCode - オフラインで使えるJSFiddle/CodePen/JSBin代替

JSFiddleやCodePenなど、オンライン上でHTML/JavaScript/CSSを書いた結果をすぐに確認できるサービスがあります。非常に便利なサービスなのですが、インターネットに繋がっていないと使えないという欠点があります。そこで使ってみたいのがSketchCodeです。ローカルで利用でき、さらにGUIアプリ...

List

  • 2017/09/05

Docbase - Markdownから生成する開発者向けドキュメント

開発者向けのドキュメントはDX(Developer Experience。開発者体験)を語る上で欠かせない存在です。ドキュメントが間違っているのはもっての外ですが、さらに可読性が高かったり、機能面においても体験を向上できる要素があります。そんな中、メンテナンスのしやすさもまた大事な要素になります。今回はMarkdown...

List

  • 2017/09/04

Medis - Electron製のRedis管理インタフェース

キュー管理やKVSとしてRedisを使うケースが増えています。オンメモリのKVSながらデータの保存をサポートしているのも特徴で、データの永続化も可能と使い勝手良いシステムです。そんなRedisの管理インタフェースがMedisです。シンプルなUIで使い勝手が良いソフトウェアです。## Medisの使い方接続画面です。SS...

List

  • 2017/09/03

upterm - Electron製、21世紀のターミナル

ターミナルは何をお使いですか。個人的には色々試したのですが、結局macOS標準のTerminalでいいやと落ち着いてしまっています。iTerm2も有名ですが、普段使っている作業は殆どがサーバ上のことなので敢えて多機能である必要がなかったりします。しかしそんな前時代から進化しないものではなく、革新的なターミナルを試したい...

List

  • 2017/09/02

Chartkick.js - 多数のグラフに対応したラッパーライブラリ

Webシステムで一番苦労させられるのがグラフではないでしょうか。HTMLの表現力が上がったと言っても、コードを書かなければなりません。特にグラフやチャートになるとコード量も増えがちです。そこで使ってみたいのがChartkick.jsです。多くのパターンに対応したクライアントサイドのグラフライブラリです。## Chart...