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

ライセンス - MIT Licenseの記事一覧

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

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

もっと見る

List

  • 2020/06/13

Github card - GitHubリポジトリ情報を表示するカスタムエレメント

HTML5ではカスタムエレメントという機能で、独自のHTMLタグを追加できます。あまり使われている例は見ませんが、特定のUIや機能をサンドボックス化できるので便利です。今回紹介するGithub cardはGitHubリポジトリの紹介をカスタムエレメント化したソフトウェアになります。## Github cardの使い方こ...

List

  • 2020/06/12

Talking Head Anime - 1枚のイラストから動くアニメーションを作るデモ

Live2Dではイラストなどの画像を動かして、まるでアニメーションのように見せることができます。そして現在、類似の技術が様々に登場しています。それらは機械学習を用いたり、Webカメラの顔と一致させたりと周辺技術と組み合わせて展開されています。今回紹介するTalking Head Animeは一枚の画像を動かすデモで、機...

List

  • 2020/06/11

AudioPlayers - Flutter製の音楽アプリ

Flutterを使うことで、AndroidとiOS、さらにWebアプリケーションを同時に開発できるようになっています。現在、様々なアプリがFlutterで実装されはじめており、今後の盛り上がりが期待できます。今回はFlutterで音楽アプリを実装したAudioPlayersを紹介します。様々な音の奏で方に対応しています...

List

  • 2020/06/11

G-Desktop-Suite - Google Driveデスクトップアプリ

Google Driveを使って、ドキュメントや表計算、スライドなどの資料を作っている人は多いのではないでしょうか。Webブラウザから使うのが基本だと思いますが、毎度Google Driveを開くのは面倒だったりします。そこで使ってみたいのがG-Desktop-Suiteです。普段使っているWebブラウザから切り離すこ...

List

  • 2020/06/10

GitHub Theme - GitHub Codespaces用のカラーテーマ

GitHubで新しいサービス、GitHub Codespacesが発表されました。GitHubのリポジトリから、Web上でVisual Studio Codeを立ち上げて、ファイルを編集できる機能です。そんなGitHub Codespacesで使われているテーマがGitHub Themeになります。Web上で合わせるこ...

List

  • 2020/06/10

nicoSlack - Slackの新着メッセージをニコニコ動画のコメント風に表示

ニコニコ動画のコメント表示は当時としては画期的なものでした。横に流れていくコメントは、動画共有だけでなく、様々なサービスやソフトウェアでも取り入れられています。今回紹介するnicoSlackは名前の通り、Slackの新着通知をニコニコ動画のコメント風に表示するソフトウェアです。## nicoSlackの使い方新しいコメ...

List

  • 2020/06/09

XP.css - Windows XPを彷彿とさせるCSS

Windows XPは非常によくできたOSだったように思います。2000もよかったですが、XPの完成度は高く、安定していました。その後のVistaなどになってからは微妙で、今なおXPを使い続ける企業があるのも致し方ない気さえします。そんなXPらしいUIをWebブラウザでも再現したければXP.cssを使ってみましょう。#...

None

  • 2020/06/08

Deno - nodeの課題を解決する新しいJavaScriptランタイム

nodeを開発したRyan Dahl氏は、その開発過程において様々な課題点が含まれてしまったとしています。パッケージ管理やasync/await、セキュリティ面などで改善すべき点が多いと語っています。そうした課題を解決すべく開発されているのがDenoになります。"node".split

List

  • 2020/06/06

Kwizz Guru - サーバレスで作られているクイズアプリ

クイズは内容のレベル次第で小さい子から大人までみんなが楽しめるゲームになります。ジャンルを歴史から数学、化学など様々なものを取りそろえれば、遊びだけでなく、学習にも効果があるでしょう。今回はそんなクイズゲームをサーバレスで興じられるKwizz Guruを紹介します。## Kwizz Guruの使い方ダッシュボードです。...

List

  • 2020/06/05

Beekeeper Studio - 多彩なデータベースに対応したデータベース管理アプリ

データベースはずっとシステムの根底に存在しています。フロント部分の技術スタックは時代に合わせて変化していますが、データベースは殆ど変化せず、不要になることもありません。それだけに、管理するUIはどんどん便利になって欲しいと思うことでしょう。今回紹介するBeekeeper Studioはデータベース管理のUIとして最新の...

List

  • 2020/06/04

lazynpm - npmのターミナル用UI

npmはJavaScriptライブラリ管理としてデファクトになっています。Bowerもありますが、多くの場合npmで代用されているように感じます。そんなnpmではpackage.jsonが使われますが、情報が多すぎて見づらいと感じることもあります。そこで使ってみたいのがlazynpmです。ターミナル上ではありますが、p...

List

  • 2020/06/01

React Flow - Reactでノード型インタフェースを実装する

ノード同士を連結するインタフェースは色々な場面で使えます。ビジュアルプログラミングであったり、マインドマップのような思考整理、ノーコーディングプラットフォームでも使えるでしょう。そうしたノードベースのビジュアルインタフェースを作る際に使えるのがReact Flowです。Reactで開発する際に便利でしょう。## Rea...

List

  • 2020/05/30

japan-map-js - 日本のクリッカブルな地図を表示

集まったデータをただ一覧にしているだけではインパクトは薄くなってしまいます。どう可視化するかが問題です。時系列で比較する場合は棒グラフや折れ線グラフ、グループの場合は円グラフなど、データによって選ばれるグラフは異なります。もしデータが地域に合わせて作られるなら、地図上にマッピングするのがいいでしょう。日本地図にマッピン...

List

  • 2020/05/30

simpleParallax.js - 画像を使ったシンプルなパララックスエフェクト

パララックスエフェクトは見ている人にちょっとした違和感を与え、注目を集めるのに使えます。しかしスクロール時の処理を実装するのは大変で、後々のメンテナンスも面倒です。そこで専用ライブラリの利用をお勧めします。今回紹介するのはsimpleParallax.jsです。## simpleParallax.jsの使い方デモです。...

List

  • 2020/05/29

Gallery - 軽量、レスポンシブなWeb写真ギャラリー

写真をWebサイト上で並べて閲覧できるようにすることはよくあります。その際問題になるのが、各種Webブラウザ(スマートフォンなど含む)への対応や、サイズの異なる写真を綺麗に並べることです。そこで使ってみたいのがGalleryです。JavaScript製の軽量なギャラリーソフトウェアです。## Galleryの使い方一覧...

List

  • 2020/05/28

QR角印 - 現代風。QRコードを含んだ角印

コロナウィルスによって社会に大きな影響が出ています。その一つとして、ハンコ文化の見直しが行われています。ハンコを押すためだけに出社するといった愚策がなくなるかも知れません。しかし承認という問題に対するニーズに対する代案は必要です。そこで注目したいのがQR角印になります。## QR角印の使い方キーワード(発注番号など)を...

List

  • 2020/05/28

notes-cli - 毎日のメモを管理するコマンド

普段メモはどこに保存しているでしょうか。決まった場所に蓄積していればいいですが、思いつくままに適当に保存していたりしないでしょうか。そうするとどこに書いたかも忘れてしまい、毎回探すことになります。そうした経験のある方はnotes-cliを使ってみましょう。日ごとのメモを決まったディレクトリに蓄積してくれます。## no...

List

  • 2020/05/27

Cloudia - 簡単に日本語に対応したワードクラウドを生成

単語をたくさん並べて作成するワードクラウドという表現があります。頻繁に出てくるワードを大きくすることで、重要なワードとそうでないものとをフィルタリングすることもできます。自分のサービスでもワードクラウドを表示したい、そう思った方はCloudiaを使ってみましょう。## Cloudiaの使い方例です。日本語の場合、形態素...

None

  • 2020/05/26

kmdr - コマンドの実行内容を教えてくれるCLI

開発者であれば、ターミナルを使って各種コマンドを入力するかと思います。コマンドを探す際に、Webで検索する人も多いでしょう。そんな時、各種オプションがすでに付いており、それぞれの説明がないために何となく実行してしまったりしていないでしょうか。きちんと把握していないコマンドを打つ際に使ってみて欲しいのがkmdrです。実行...

List

  • 2020/05/26

Marpit - MarkdownからHTML/PDFのスライドを作成

プレゼンテーション用のスライドを作る際には何を使っているでしょうか。PowerPointやKeynote、Googleスライドを使っている人が多いと思いますが、開発者であれば見た目の装飾よりも内容にこだわりたいはずです。そんな方に使ってみて欲しいのがMarpitです。Markdownからスライド、そしてPDFを生成する...