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

Webの記事一覧

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

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

もっと見る

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/13

SQLite Web - さくっと使えるWebベースのSQLite管理

SQLiteはプロトタイプ開発であったり、小さなWebサービスなどを開発するのに非常に役立ちます。単一ファイルで動きますがちゃんとSQLも使えますし、本格的な作りです。そんなSQLiteを使った開発時に用意しておきたいのがSQLite Webです。Python製で簡単に使えるSQLite管理です。## SQLite W...

List

  • 2017/09/12

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

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

List

  • 2017/09/10

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

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

List

  • 2017/09/08

go-anond - Go製のはてな匿名ダイアリー風アプリ

はてなの提供する匿名ダイアリー(増田)は特定用途においてとても便利なサービスです。炎上ネタの多くは増田からはじまったりします。匿名というのはそれだけ強いポテンシャルを持っているのでしょう。そんな匿名ダイアリー風のサービスがgo-anondです。その名の通り、Goで作られています。## go-anondの使い方トップペー...

List

  • 2017/09/05

Minio - Amazon S3互換のオブジェクトストレージ

Web上で手軽に使えるストレージシステムと言えばAmazon S3ですが、AWSを組み合わせていない時には転送料金が気になるかも知れません。さらに自社独自のカスタマイズをしたいと思うこともあるでしょう。S3並の柔軟性と独自のカスタマイズを組み合わせたいと思ったら使ってみたいのがMinioです。S3互換のAPIを持ったオ...

List

  • 2017/09/04

Agorakit - 市民のためのグループウェア

グループウェアと聞くと社内で使うイメージがありますが、情報を一元管理するという意味で考えると決してビジネスだけのものではありません。グループができたら、その情報をまとめるのはグループウェアなのです。今回紹介するAgorakitはまさにそんなコンセプトのソフトウェアです。ビジネスではなく一般市民のためのグループウェアです...

List

  • 2017/09/02

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

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

List

  • 2017/09/02

CharCanvas.js - 計算処理を使ってアスキーアートを描画

アスキーアートを描くのは専用のエディタを使うほど、手間がかかる作業になります。記号を組み合わせてイラストを描きますのでペイントほど柔軟にはいきません。慣れるまでに相当な時間を要するでしょう。そこで使ってみたいのがCharCanvas.jsです。計算によってアスキーアートを作成します。## CharCanvas.jsの使...

List

  • 2017/09/01

openKB - node/MarkdownによるFAQシステム

Webは疑問を解消するのに使えますが、そのためには疑問(とその回答)をまずどこかに載せておく必要があります。最近ではQ&Aが人気ですが、それでもよくある質問についてはFAQのが役立つ場合があります。そこで使ってみたいのがopenKBです。自社のFAQシステムを構築するのに使えるでしょう。## openKBの使い方トップ...

List

  • 2017/08/31

CodeSandbox - Reactのオンラインプレイグラウンド

Reactの勉強をしたいと思ったとしても、環境の準備に色々と手間がかかっていたらやる気がなくなってしまうでしょう。その途中でエラーが出たり、nodeのバージョンが古いなどと警告が出たりしても萎えてしまいます。そこで使ってみたいのがCodeSandboxです。オンラインでReactの記述と実行ができるプレイグラウンドです...

List

  • 2017/08/29

CSS SANS - 時代を表現するCSS製フォント

CSS3によって多くのデザインがCSSだけで実現できるようになっています。しかしまだまだできないことも存在します。その一つがフォントです。複雑でバランスが大事なフォントはWeb Fontを使って表現するのが基本です。そんな中作られたのがCSS SANSです。CSSだけで作られた、「時代によって変わる」がコンセプトのフォ...

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/24

File Manager - Webベースのファイルマネージャ

ファイルサーバのファイルを操作しようと思うとサーバにログインしたり、RDPを使って操作したりします。社内であればサーバのあるところまで歩いていって操作するかも知れません。それは非常に面倒です。そこで使ってみたいのがFile Managerです。Webブラウザベースのファイルマネージャです。## File Manager...

List

  • 2017/08/22

o-grid - グリッドだけ提供するCSSライブラリ

最近のレスポンシブWebデザインを支えるのはグリッドデザインです。画面幅を幾つかに分割し(大抵12個が多いですが)、画面幅によってその内幾つのブロックを横に並べて表示するかを決定します。多彩なUIフレームワークと共に提供されることが多いですが、今回はごく基本的なグリッド機能だけ提供するo-gridを紹介します。## o...

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/19

Publii - 静的Webサイトを構築するGUIアプリ

静的なWebサイトを構築するフレームワークは多数あります。その多くはコマンドラインのもので、サイトをプレビューしながら開発していくものではないでしょうか。開発者にとっては使いやすいですが、普通の方にはちょっと使いづらいと感じるかも知れません。そこで使ってみたいのがPubliiです。GUIアプリケーションな静的サイト構築...