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

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

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

2017/12/14
できることを全力でやる
2017/11/25
恥ずかしさを感じないためにできること
2017/11/11
プロジェクトを遅延させないコミュニケーションパス管理

もっと見る

List

  • 2020/04/29

HTML DOM - 素のJavaScriptでどうDOMを操作するのか学ぼう

jQueryやVue、Reactなどを触っていると、実際のDOM操作をどう行うのか忘れてしまったりします。DOMを作ったり、追加する、変更するといった操作は意外と面倒ですが、直接行う分、高速であるはずです。HTML DOMはそんなDOM操作を素のJavaScriptで行う方法を学べるWebサイトになります。## HTM...

List

  • 2020/04/29

Storybook - フロントエンド開発者向けUIコンポーネント学習サイト

フロントエンドで利用できる技術が多様化しており、それらの使い方を効率的に学ぶ手段が欲しくなっているはずです。大事なのはその場で実行したりして確認できることで、それによって敷居が大幅に下がるはずです。今回紹介するStorybookは各種フロントエンドフレームワークに対応した、UIコンポーネントエクスプローラーです。## ...

List

  • 2020/04/28

Micro Sniff - 使われているマイクデバイスを画面に表示

自宅での仕事が多いと、リモートでミーティングする機会も増えていきます。そんな時にはWebカメラやマイクを使うと思いますが、切るのを忘れていると思わぬ姿や音声を晒してしまうことになるかも知れません。そうならないためにもMicro Sniffをインストールしておくといいでしょう。利用中のマイクがあれば画面上に表示してくれる...

List

  • 2020/04/28

Ocula - PWA製のお天気アプリ

天気はごくごく基本的な情報になります。スマートフォン、スマートウォッチなどにおいても天気アプリは必ず入っているものです。今日の天気、明日の天気は誰しもが気になるものでしょう。OculaはPWA(Progressive Web Apps)で作られた天気アプリになります。PWAを学ぶ上でも役立ちそうです。## Oculaの...

List

  • 2020/04/27

COVID-19-Map - コロナウイルスに関する現状を可視化するアプリ

コロナウイルスが猛威を振るっています。日々、世界中で感染者が増加しており、さらに多くの人たちが亡くなっています。こうした状況下において大事なのは、正しい情報を正しく判断することでしょう。今回紹介するCOVID-19-MapはデータのソースとしてEsri ArcGISが公開しているものを利用し、マップに展開しているアプリ...

List

  • 2020/04/27

Smooth Scrolling Image Effects - スクロールを使って画像にアニメーションを起こす

Webブラウザでは様々なユーザアクションを使ってイベントを実行できます。クリックや文字入力はもちろん、ウィンドウのリサイズやマウスオーバーなど細かく指定して、よりユーザビリティの高い仕組みを提供できます。Smooth Scrolling Image Effectsは名前の通り、スクロールを使って画像エフェクトを実行しま...

List

  • 2020/04/26

timecop - オフラインで使える時間管理スマホアプリ

時間は有限です。誰にとっても共通のリソースで、忙しくしても暇に過ごしても1日24時間は変わりません。それだけに濃密に過ごさなければなりません。自分がどう一日を過ごしているか、それはまず測定して学ばなければならないでしょう。そのためのアプリとしてtimecopを紹介します。プライバシーに配慮されており、完全にオフラインで...

List

  • 2020/04/26

LibreSpeed - Webブラウザだけでインターネット速度測定

コロナウイルスの影響で自宅勤務を余儀なくされている、遠出できずに自宅にこもっている人が増えています。その結果、動画サイトをはじめとしたインターネット利用は上がる一方だそうです。そうなると気になるのがネットワーク速度ではないでしょうか。LibreSpeedはWebブラウザだけでインターネットの速度を計測できます。## L...

List

  • 2020/04/25

gifcap - デスクトップの操作をキャプチャ&アニメーションGIF化するWebアプリ

HTML5 APIが拡充されることで、これまでデスクトップアプリケーションでしかできなかったことが、どんどんWebブラウザ上で実現できるようになっています。開発環境だってAtomやVS CodeのようにHTML5で作られたものが主流になってきています。今回紹介するgifcapはWebベースでアニメーションGIFを作成す...

List

  • 2020/04/25

colors.lol - 思わず使いたくなくなるカラーパレット紹介

Web上で表現できる色は1670万色あります。これだけあったら何を選んでいいのか分からないかも知れません。主立った色には名前が付いており、その中から選ぶのもいいでしょう。そうしたカラーパレットもたくさんあります。今回紹介するcolors.lolは一風変わったカラーパレットを紹介しています。なんというか…毒舌です。## ...

List

  • 2020/04/24

Hatena::Group Static Site Generator - はてなグループのデータから静的サイトを生成

はてなグループは2004年くらいにはじまったサービスで、複数人で日記を書いたり、カレンダーを使ったりとコミュニティ内のグループウェア的な存在でした。しかし時代の変化に取り残されたのか、2019年に終了が発表されました。Hatena::Group Static Site Generatorはそんなはてなグループのデータを...

List

  • 2020/04/24

Trollo - Vue/Vuex製のカンバンシステム

Trelloのようなカンバン機能はプロジェクト管理に限らず利用できそうです。自分たちで開発しているWebサービスの中に組み込みたいと思った方も少なくないでしょう。しかし実際に開発してみると意外と機能が多いと感じるかも知れません。そこで使ってみたいのがTrolloです。Vueで作られていますので、Vueアプリケーションの...

None

  • 2020/04/23

download - JavaScriptで簡単にファイルダウンロード実行

Webアプリケーションなどでファイルをダウンロードさせたいと思ったことはないでしょうか。別なタブで開いて自分で保存してくださいというのは格好悪いです。ZipなどであればWebブラウザ任せですが、画像などはそうはいきません。そこで使いたいのがdownloadです。とても簡単で使いやすいダウンロードライブラリです。## d...

List

  • 2020/04/23

wow.js - スクロールで開始するCSSアニメーションライブラリ

Web上でアニメーションを実現させるのはとても大変です。それだけに閲覧者にとっては大きなインパクトがあります。少しでも楽に実現させるために、ライブラリを使うのがいいでしょう。様々なライブラリを知っておけば、ぴったりの場面がありそうです。今回紹介するwow.jsはスクロールによって出現するアニメーションライブラリになりま...

List

  • 2020/04/22

CodeJar - Web上で使える小さなコードエディタ

Web上でコードを表示したい場面はよくあります。そのためのコードハイライトライブラリも多数ありますが、それは単に装飾だけ行うものです。ユーザに編集を許可するものではありません。もしWebブラウザ上で使える手軽なコードエディタを探しているならば、CodeJarを使ってみましょう。## CodeJarの使い方表示例です。!

List

  • 2020/04/22

Raycast - HTML5でレイキャスティングを楽しむコンポーネント

3Dゲームでよくあるのがレイキャスティングによる表示です。壁などが垂直に表示されて、前後左右に動いたり、視点を変えると見える映像が変わるというものです。DOOMなどでよく知られている表示形式です。そんなレイキャスティングをReactで再現したのがRaycastになります。HTML5でも十分に3Dゲームが楽しめそうです。...

None

  • 2020/04/21

hostctl - hostsファイル管理用コマンド

開発者であればhostsファイルを編集して接続先を変更してみるといった操作を行うことがよくあるかと思います。hostsファイルは単なるテキストファイルなので管理が煩雑になりがちで、後で見返した時に分かりづらいものになってしまいやすいです。そこで使ってみたいのがhostctlです。hostsの設定をグルーピングして分かり...

None

  • 2020/04/21

CoroVent - スイス発の人工呼吸器

これはさすがに試せないのですが、ぜひ知って欲しいのでご紹介。コロナウィルスの猛威によって、世界的に医療リソース不足が問題になっています。マスクや手袋、防護服など様々な物資が足りていません。そんな中、患者向けには人工呼吸器の不足が叫ばれています。企業も増産は行っていますが、それでも新興国などでは不足しています。そんな中、...

List

  • 2020/04/20

PokeTraveler - ポケモンの街を歩こう

ポケモンでは街があり、そこでは情報を収集したり、他のキャラクターやジムリーダーとバトルすることができます。しかし、これはあくまでもあなたもポケモントレーナーである前提です。あなたがポケモントレーナーではない状態で彼らの街を訪れると、きっとPokeTravelerのような感じになるはずです。## PokeTraveler...

List

  • 2020/04/20

Mathup - MathMLを簡単に書ける記法&レンダー

Web上で数式を表示する際に使われる記法は幾つかあります。最も有名なのはMathMLではないでしょうか。他にASCIIMathMLもあります。高度な表現が可能な分、その記法がかなり難しいという難点があります。そこで作られたのがMathupです。既存の記法に比べてずいぶん分かりやすく、MathML互換の表現が可能となって...