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

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

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

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

もっと見る

List

  • 2017/08/26

RichText - シンプルなWYSIWYGエディタ

自分の見たままに編集する、いわゆるWYSIWYGな環境を提供するソフトウェアは開発者以外の方には必須のソフトウェアです。Markdownがいかに分かりやすい記法とは言え、開発者以外の方には使いづらいはずです。今回はjQueryプラグインのRichTextを紹介します。シンプルなデザインのWYSIWYGエディタとなってい...

List

  • 2017/08/24

image-compressor - Webブラウザ上で画像圧縮

スマートフォンのカメラの性能が大幅に向上し、1ファイルのサイズが肥大化する傾向にあります。JPEGなのである程度圧縮がかかっているものの、それでも数MBあったりします。ブログなどで使うのであれば、正直そこまでの品質や画像の大きさは不要でしょう。そこで使ってみたいのがimage-compressorです。Webブラウザベ...

List

  • 2017/08/23

Kantu Browser Automation - Google Chromeの操作を記録して自動再生

Webブラウザを自動操作したいというニーズはよくあります。同じような操作を繰り返す場合や、Webブラウザを使ったテストなども同様です。そのため、Seleniumやヘッドレスブラウザ系のソフトウェアが幾つも存在します。今回はGoogle Chrome機能拡張として提供されるKantu Browser Automation...

List

  • 2017/08/23

Authenticator - Google Chrome機能拡張として動作する二段階認証アプリ

二段階認証は使っているでしょうか。方法は幾つかありますが、一番多いのはスマートフォンを使ったものではないかと思います。しかし毎回スマートフォンで表示された数字を入力するのは面倒です。そこで使ってみたいのがAuthenticatorです。Google Chrome機能拡張として動作する二段階認証アプリです。## Auth...

List

  • 2017/08/22

Electron Code Editor - Electron製のごく基本的なプログラミングエディタ

AtomはElectronというWeb技術でデスクトップアプリケーションが開発できるフレームワークを基盤としています。HTML/JavaScript/CSSであっても、十分にプログラミングできるレベルの性能が発揮できるようになっているのです。自分でもそんなエディタを作ってみたいと考えるならばElectron Code ...

List

  • 2017/08/21

VUESTIC - Vue.jsを使ったシステム管理画面テンプレート

Webサービスを作っていて、必要になるのが管理画面です。多くは開発工程の最後に回されて、予算もないために簡易的な画面で作られます。しかしより良い管理を行うためには管理画面もこだわりたいものです。今回はVue.jsを使った管理画面、VUESTICを紹介します。## VUESTICの使い方トップページです。アイコンが大きめ...

List

  • 2017/08/21

jQuery Skeduler Plugin - カレンダーの週表示を行うjQueryプラグイン

仕事は大抵時間に即して行われているのでカレンダー風に表示したりすると分かりやすく可視化できます。スケジュールアプリでは総じて提供されていますが、自前で実装しようと思うと大変な表示です。そこで使ってみたいのがjQuery Skeduler Pluginです。週表示のカレンダービューを提供するjQueryプラグインです。#...

List

  • 2017/08/20

chalk-animation - ターミナル上でカラフルなテキストアニメーション

時にソフトウェアの中には、役には立たなくとも見ていて面白いものが存在します。また、開発者としてはそれを見て、実際にはどんなところに使えそうか考えてみるのも面白いでしょう。今回はchalk-animation、ターミナル上でテキストアニメーションを流せるソフトウェアを紹介します。## chalk-animationの使い...

List

  • 2017/08/18

Ring UI - JetBrains製のUIコンポーネント集

Webアプリケーションを作る際に大事なのがUIです。Bootstrapのようなテーマもありますが、まだまだ足りない部品があることも多いでしょう。そうしたときに工夫すれば実装できるのか、または最初から用意されているのかで大きな違いがあります。今回紹介するRing UIはJetBrains社製のUIフレームワークになります...

List

  • 2017/08/18

Raneto - node製/Markdownのナレッジベース

企業のWebサイトなどでよく見られるのがナレッジベースです。FAQ的なものですが、検索がついていたりカテゴライズもされていて、より洗練されたものとなっています。今回はそんなナレッジベースを作成するためのソフトウェア、Ranetoを紹介します。## Ranetoの使い方インデックスです。カテゴリ毎にタイトルが並んでいます...

List

  • 2017/08/17

Uppy - クラウドストレージも使える高機能なファイルアップローダー

HTML5は素のままではあまりUXは向上していません。APIを使って開発者自身で拡張しなければなりません。しかしその開発もそう簡単ではありません。そこですでに他の方が開発したものを積極的に使っていくのが良いでしょう。今回は多機能なファイルアップロード機能が手に入れられるUppyを紹介します。## Uppyの使い方利用し...

List

  • 2017/08/16

Particle - YouTubeをもっと便利にするブックマークレット

YouTubeをよく使う人ほど、あのUIに不満もあるでしょう。一昔前であれば与えられたもの以上のことは何もできなかったですが、今はユーザ自身の手でカスタマイズできるのです。今回紹介するParticleはそんなYouTubeのUIをより使いやすくしてくれるソフトウェアです。## Particleの使い方設定画面です。イン...

List

  • 2017/08/16

wordcloud2.js - JavaScriptでタグクラウドを生成

たくさんの文字が良い感じに詰め込んだ状態で並んだ状態がタグクラウドやワードルと呼ばれます。それを手作業で作成するという選択はまず考えられないでしょう。また、画像で作ってしまうと後からの更新が面倒です。そこで使ってみたいのがwordcloud2.jsです。与えられた文字列を良い感じに配置してくれます。## wordclo...

List

  • 2017/08/15

Terminal recorder - ターミナル操作を記録してHTML出力

自分のターミナル操作を記録したい時はないでしょうか。手順書を作る場合でも、ブログ記事を書くときにも考えられます。すべてテキストで書いていくのもいいですが、入力した内容がそのまま記録されるなら、これほど楽なことはないでしょう。Terminal recorderはそんな希望を叶えてくれるソフトウェアです。さらに結果はHTM...

None

  • 2017/08/14

mailit - メール送信をWeb APIで

メールをシステムに組み込むのは意外と面倒で、SMTP用のライブラリをついつい頼ってしまいます。さらに日本語問題やHTMLメール、添付ファイルなど様々な用途があります。それをシンプルに解決してくれそうなのがmailitです。メール送信をシンプルなREST APIで提供してくれます。## mailitの使い方mailitは...

List

  • 2017/08/13

BorderColorAnimate - 枠線をアニメーションさせるjQueryプラグイン

ユーザのアクションに対して反応することで、相手のストレスを軽減できます。特にAjaxを使うSPAなどでは通信状態を適切に表示しておくのが大事です。何の反応もなかったら、ユーザは何度もボタンを押してしまうでしょう。一例として紹介したいのがBorderColorAnimateです。枠をアニメーションさせるという面白い方法で...

List

  • 2017/08/13

Space Invaders - プログラミング学習に使えるHTML5ゲーム

プログラミングを学習する上で良い題材があるとスムーズです。特に自分が作りたいものに合っていると、そのカスタマイズができたり、より学習意欲が高まるはずです。今回はWebブラウザ上でゲームを作る際の学習教材になるSpace Invadersを紹介します。## Space Invadersの使い方スペースキーを押すと開始しま...

List

  • 2017/08/12

JS-XLSX - Web上でExcelファイルを読み書き

なんだかんだ言ってもシステム開発においてExcelファイルはよく使われます。しかしサーバサイドでExcelファイルを生成したり、読み取ったりするライブラリをインストールするのは嫌なものでしょう。そこで使ってみたいのがJS-XLSXです。WebブラウザベースでExcelファイルの読み書きができます。## JS-XLSXの...

List

  • 2017/08/10

Alchemy - 画像をPDFに変換する常駐アプリ

画像をPDFに変換したいと考える時があるかも知れません。そんな時、画像を開いて印刷機能の一部で提供されるPDF変換を使ったり、PDFにしてくれるプリンタドライバを利用します。しかしこれは手間です。そこで使ってみたいのがAlchemyです。メニューバーに常駐するPDFコンバータです。## Alchemyの使い方常駐してい...

List

  • 2017/08/09

Google Pacman - 今でも遊べるGoogle製パックマン

かつてGoogleが作成し、世界中の生産性を低下させたのがWebベースのパックマンです。パックマンの○周年を記念して作られたものですが、みんながこぞってチャレンジし続けました。そんなパックマンを今でも遊びたい方がいるならばGoogle Pacmanにトライしてみましょう。## Google Pacmanの使い方メイン画...