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

Webの記事一覧

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

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

もっと見る

List

  • 2019/08/03

Resilience - プロキシ型のアドブロッカー

インターネットには広告が付きものです。それを避けるための手段としてアドブロッカーがありますが、Webブラウザによって性能が異なったり、機能拡張が提供されていない場合もあります。そこで使ってみたいのがプロキシベースのアドブロッカー、Resilienceです。## Resilienceの使い方はてなブックマークのトップペー...

List

  • 2019/08/02

listmonk - 自分で立てるニュースレター/メーリングリストシステム

メールマガジンを備えたWebサービスは多数あります。ソーシャルサービスがこれだけ流行りつつも、ビジネスで効果が大きいのはメールマーケティングだったりします。その管理するSaaSは多いですが、セキュリティ上の理由で自社管理しているところも多いでしょう。外部サービスから移行したい、これからメーリングリスト、ニュースレターシ...

List

  • 2019/08/02

copy-code-block - プログラミングコードをクリップボードにコピー

ブログなどでコードを記載しているサイトは多いです。その表示方法も様々で、行番号があるもの、ハイライトが付いているものなどがあります。そのコードをコピーしても余計な行番号が付いてきたりして、ストレスと感じたりします。そこで使ってみたいのがcopy-code-blockです。自由度の高くコードのコピーが可能です。## co...

List

  • 2019/08/01

host yo self - ファイルをアップロードしないWebベースのファイル共有システム

他の人とファイルを共有する機会は多いですが、時々とても面倒に感じることがあります。それこそ目の前にいる相手に対してファイルを送るの手段がなく、USBにコピーすることもあります。チャットやSlack、メールなどは相手と繋がっていたり、メールアドレスが分からないといけません。そこで使ってみたいのがhost yo selfで...

List

  • 2019/07/31

Moveable - マウスでドラッグ/リサイズ/回転を実現

Webアプリケーションとしてドローアプリを作りたい、または一部の機能としてDOMを移動したりサイズ変更するような機能を設けたいと思うことがあります。しかし、DOMをインタラクティブに操作するのは困難です。そこで使ってみたいのがMoveableです。マウスでDOMを簡単に操作できるようになります。## Moveableの...

List

  • 2019/07/31

webssh2 - Webブラウザで動くターミナル

サーバの操作をターミナルで行うのは基本ですが、クラウドサービスなどではWebブラウザ上で使えるターミナルを提供することがあります。ソフトウェアをもっていない人であったり、スマートフォンやタブレットからでもサーバ操作できるのが便利です。そんなWebブラウザ向けのターミナルとしてwebssh2を紹介します。SSH2を使った...

List

  • 2019/07/30

Simple HTML Invoice Template - シンプルな請求書のテンプレート

Webが苦手なものとしては、帳票があります。定型で体裁の整った帳票を生成するのは難しく、ついPDFなどに頼ってしまいます。かといって日本語で綺麗なPDFを出すのも難しかったりします。今回紹介するSimple HTML Invoice Templateはまさにその名の通り、シンプルな請求書のテンプレートとなっています。#...

List

  • 2019/07/28

GraphQL Editor - Webブラウザ上でGraphQLを設計

GraphQLではAPIをスキーマとして表現します。データベースのテーブルと対になることも多いですが、それ以外のデータも扱えます。また、すべてのカラムを公開すれば良いわけではないので、入力制御も必要でしょう。そんなGraphQLのスキーマをWeb上で設計できるのがGraphQL Editorです。## GraphQL ...

List

  • 2019/07/28

ProtoGraphQL - GraphQLをビジュアル的に設計

GraphQLはRESTful APIの代替になりえる仕組みです。データ取得に対して自由度が高く、入力と出力両方に対して型指定できるのも良いです。多くはフレームワークと組み合わせて使えますが、自分で一から設計する場合もあるでしょう。そんな時に使ってみたいのがProtoGraphQLです。GraphQLのスキーマをビジュ...

List

  • 2019/07/25

vue.py - Pythonで作るVue.jsアプリ

JavaScriptはWebブラウザ上での動作が保証されている唯一のプログラミング言語です。しかし、別な言語を使いたいと考える人も数多くいます。サーバサイドと言語を合わせたいという要望もあります。もしあなたがPythonを使っているならば、vue.pyを使ってWebブラウザ画もPythonで書いてみるのはいかがでしょう...

List

  • 2019/07/24

Pinker - 文字で定義して図に変換

Webが不得意としているものの一つが図(ダイアグラム)でしょう。Canvasを駆使すればできなくもないですが、画像編集ソフトウェアを使って画像として埋め込んでしまう人の方が多そうです。今回紹介するPinkerはJavaScriptのコードからダイアグラムを生成するソフトウェアです。## Pinkerの使い方レイアウトと...

List

  • 2019/07/23

Black Candy - 自分で立てる音楽ストリーミングサーバ

音楽ファイルは意外と大きく、大量の音楽ファイルをローカルに入れているとストレージを逼迫してしまいます。また、複数人で音楽を共有したい時には別途メディアサーバを立てたりするでしょう。そこで使ってみたいのがBlack Candyです。自分で立てる音楽ストリーミングサーバです。## Black Candyの使い方アクセスした...

List

  • 2019/07/18

imgpush - オープンソースの画像共有サーバ

ImgurやGyazoなど画像アップロードサイトは多数あります。そうしたサイトを使うことで友人やコミュニティサイトなどで画像共有を簡単に行えますが、コンテンツの公開制限をはじめ、自分で制御できないことに不安を感じる人もいるでしょう。そこで使ってみたいのがimgpushです。画像を簡単にアップロードできるサーバを手軽に設...

List

  • 2019/07/17

urlpages - サーバレスのWebプレイグラウンド

CodePenやJSFiddleなどWeb上でHTML/CSS/JavaScriptを試せるプレイグラウンドサービスが多様に存在します。これらはコードをサーバ側に保存するので、自前で同じような環境を用意するのが面倒です。今回紹介するurlpagesは静的サイトでも使えるのが魅力です。もちろん作成したコードを他の人に見せ...

List

  • 2019/07/17

photoEditor - Web上で簡易的な画像編集

ユーザに画像をアップロードしてもらう機能はよくありますが、そのままでは使いづらいことが良くあります。例えばサイズが大きすぎたり、回転してしまっていたりといった具合です。そんな時に簡易編集機能を提供できるのがphotoEditorです。## photoEditorの使い方写真を開いたところ。この状態では、まだサーバに送信...

List

  • 2019/07/16

paintDraw - Web上のペイントアプリ

Web上で絵を描いたり、画像に装飾を施したいと思うことが多々あります。画像をCanvasに読み込んで、後は線を引いたりすれば良いのですが、その実装は意外と複雑です。さらに間違った時のために消しゴム機能などもいるでしょう。そうしたペイント機能の基盤に使えそうなのがpaintDrawです。## paintDrawの使い方線...

List

  • 2019/07/16

maps-journey-replay - 進んだ道を地図上でリプレイ

旅行前に地図を眺めてあれこれ計画を立てたり、現地を想像したりするのが好きです。逆に旅行に行ってしまった後に同じ地図を見返すことは殆どないのですが、旅路を振り返るのが好きな人も多そうです。そんな方にお勧めしたいのがmaps-journey-replayです。あの時通ったあの道を辿れるWebアプリケーションです。## ma...

List

  • 2019/07/15

DigitalJS - Webで動くデジタル回路シミュレータ

デジタル回路を設計する際には、その回路を実際に組む前にシミュレータで確認するのが基本です。ハードウェアにするのはハードルが高いので、まずトライ&エラーがしやすい環境でどんどん試していきます。今回紹介するDigitalJSはそんなデジタル回路のシミュレータです。Web上で試せるのが特に便利です。## DigitalJSの...

List

  • 2019/07/14

Darkmode.js - Webサイトにダークモードを手軽に導入

macOSでダークモードが導入されて以降、一気にその波が広がっています。アプリなどもダークモードをサポートしたり、Webサイトでも行われるようになっています。プログラマやエンジニアでは背景を黒くするのが当たり前だったので、時代が追いついたと言えなくもなさそうです。そんなダークモードをWebサイトでも使えるようにするのが...

List

  • 2019/07/13

statbox2 - 完成度の高い宮崎県向けデータ可視化システムのプロトタイプ

行政で使われるシステムは決して安価ではありません。利用者像が様々であり、ユニバーサルデザインにも気を配らないといけないため、開発工数が増しがちです。しかし、その結果として使い勝手の悪いシステムができるのではな意味がありません。今回紹介するstatbox2は、新みやざき統計BOXで使われる機能のプロトタイプです。このシス...