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

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

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

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

もっと見る

List

  • 2020/12/27

EStimator.dev - モダンなJavaScriptにすればどれくらいパフォーマンスが向上するか

JavaScriptの書き方は年々変わってきています。モダンになるにつれて省略した書き方もできるようになり、よりコード量を減らせるようになっています。サイズが小さくなればダウンロードサイズも減り、よりパフォーマンスが高くなるでしょう。今回紹介するEStimator.devは旧来のJavaScriptをモダンな書き方にす...

List

  • 2020/12/26

DOMRec - DOM操作を記録&再生

操作をキャプチャして動画にする場合、何らかのソフトウェアを使うのが基本です。そして動画であったり、アニメーションGIFとして出力するのではないでしょうか。ソフトウェアをインストールするのが面倒だったり、探すのすら手間ですよね。Webページの操作であれば、DOMRecを使ってみるのが一つの手です。JavaScriptベー...

List

  • 2020/12/25

lofii - アスキーアートを使った簡単なチャット

リモートワークが続く中、動画チャットが流行っています。大抵Webカメラで顔を出して行いますが、化粧や格好、背景に余計なものが映り込むのが気になります。かといって声だけで行うのは情報が少なくなり、適切に伝わらない可能性が上がります。今回紹介するlofiiはもっとシンプルな動画チャットになります。これならば音声だけよりは多...

List

  • 2020/12/25

Lunar Lander - 月を舞台にしたシューティングゲーム

航空系、海洋系、宇宙系のゲームは苦手です。動きが予想もつかない方向に進んだりして、あっという間に失敗してしまいます。SpaceXではISSとのドッキングシミュレータ

List

  • 2020/12/23

daily.dev - 多忙な開発者向けニュースサイト

ITの進歩は日進月歩であり、数日キャッチアップが遅れただけで新技術が台頭しているなんてこともあります。いつ何時世界が変わるか分かりませんが、忙しいエンジニアは情報収集している暇もないことでしょう。そこで使ってみたいのがdaily.devです。Google Chrome機能拡張ベースの変わったニュースアプリです。## d...

List

  • 2020/12/23

Timespace - 時間に紐付いたイベントを表示するjQueryライブラリ

世の中の多くのことは時間軸に沿って進んでいます。1日のスケジュールもそうですし、歴史も時間によって進んでいきます。そうした時間ごとに発生するイベントを表示するのに、単なる一覧ではなく、時間軸を使うと分かりやすくなります。今回紹介するTimespaceは時間ごとに発生するイベントを表示するライブラリです。## Times...

List

  • 2020/12/21

Yoshify - いつでもヨッシー!

今年はヨッシー30周年だそうです。マリオやルイージの乗る恐竜として登場したヨッシーですが、ヨッシーが主役のゲームが作られたり、さまざまなマリオのゲームで登場するなど、欠かせないキャラクターとなっています。そんなヨッシーといえば、乗る時のSEが欠かせません。それをいつでも楽しめるのがYoshifyです。## Yoshif...

List

  • 2020/12/21

Owlet Editor - BBC BASICエディタ&実行環境

コンピュータは長い歴史がありますが、ここ数十年で一気に進化したものでもあります。そのため、30年くらい前のものであっても、もっとずっと昔のものであるかのように感じられてしまいます。今回紹介するOwlet Editorは1980年ごろに作られたBBC Micro Botにインスパイアされた、BBC BASICエディタです...

List

  • 2020/12/20

quiver - Web上で可換図式を描く

数学にはさまざまな表現が存在します。たとえば式を表現する際に、既存のWeb表現だけでは困難です。そのため、MathJaxのような拡張表現が使われます。他にも表現したいものはたくさんあるでしょう。今回紹介するquiverは数学で用いる可換図式を作成するのに特化したエディタです。## quiverの使い方エディタ画面です。...

List

  • 2020/12/19

Lavalamp.app - Webでラバランプの動きを再現

ラバランプはご存じでしょうか。着色したワックスと水が入ったランプで、下を温めることでワックスの密度が変化して上に上がっていきます。上に上がると冷えて落ちてきます。ラバ(溶岩)のような粘性を持った動きが面白いランプです。今回紹介するLavalamp.appは、そんなラバランプの動きを再現するWebアプリケーションです。#...

List

  • 2020/12/18

*scratch*.js - Web版のScratch

EmacsにはScratchという機能があります。そこではCommon Lispを書いて、その場で実行できます。開発者ツールのコンソールに使いかも知れません。またはJupyter Notebookで実行するような感じです。そんなScratch風にJavaScriptを実行できるのが \*scratch\*.jsです。#...

List

  • 2020/12/16

mediaplayer - Web上で多彩な動画フォーマット再生

動画には様々なフォーマットがあります。さらに音楽ファイルについてもフォーマットが多いです。Web向けであればMP3やMP4であれば大抵再生できますが、さらにWebMやFLACのようなフォーマットもあります。今回紹介するmediaplayerはWeb上でも多彩なフォーマットに対応した動画再生ができるソフトウェアです。##...

List

  • 2020/12/16

YouTube Clone - 機能豊富なYouTubeクローン

YouTubeは巨大な動画配信プラットフォームですが、広告が激しくなっていたり、スパムまがいの動画も増えるなど、ノイズが増えてきています。使いづらい訳ではありませんが、特定の分野に限ったプラットフォームがあってもよさそうです。今回紹介したYouTube Cloneは名前の通り、YouTubeクローンなサービスです。機能...

List

  • 2020/12/15

gh-pages-url-shortener - GitHub Pagesを使った短縮URL

短縮URLサービスは色々な場面で利用できます。長いURLだと複雑になりがちなQRコードを簡単なものにしたり、カスタムドメインを使うことでブランディングにも貢献できます。自分でサーバを立ててもいいですが、gh-pages-url-shortenerを使えばサーバレスで構築できます。## gh-pages-url-shor...

List

  • 2020/12/15

Openwhyd - 好きな音楽をプレイリストにしてシェアしよう

音楽をきっかけに知り合いになったり、友達と一緒に聞いたりと、音楽にはソーシャルな一面があります。センスの良い人が選んだセレクションを聞くと集中して仕事ができたり、気分がリラックスできたりします。今回はそんな音楽を軸にしたソーシャルサービス、Openwhydを紹介します。## Openwhydの使い方トップページです。!

List

  • 2020/12/13

Notion Clone - Notionのようにノート編集できるWebアプリ

最近急激に知れ渡ってきたNotion。Wikiやプロジェクト管理、タスク管理などが一つに収まっているWebアプリケーションです。UIは使いやすく、様々なオブジェクト(テーブルデータ、画像など)を自由に管理できます。そんなNotionのページ入力UIをまねたのがNotion Cloneになります。## Notion Cl...

List

  • 2020/12/12

spicetify-cli - Spotifyクライアントアプリのデザインを自由にカスタマイズ

Spotifyは音楽ストリーミングサービスとして、世界最大規模となっています。多くの人たちが聞いていることでしょう。Webやスマートフォンでも聞けますが、PC用のGUI版を使っている人も多いはずです。常時立ち上げておくような音楽プレイヤーだから、自分好みにカスタマイズしたいという声は多いでしょう。そこで使ってみたいのが...

List

  • 2020/12/11

jspaint.exe - JS Paintをバイナリ化してローカルアプリケーションに

Windows付属のペイントソフトウェアであるMS Paintは誰もが一度は使ったことがあるでしょう。機能はとても少ないですが、最初にお絵かきを試してみる程度であれば十分な機能があります。世の中にはMS Paintで本格的な絵を描く人もいるというのだから驚きです。今回紹介するjspaint.exeはMS PaintをW...

None

  • 2020/12/07

Git-User-Switch - Gitユーザを切り替えるコマンド

Gitを企業と個人とでアカウントを分けて運用している人は多いかと思います。企業によっては個人のアカウント利用を許さず、退職時に消してしまうなんてところもあるようです。個人の活動が失われないよう、アカウントを適切に運用する方がいいでしょう。しかし、アカウントの切り替えが面倒です。そこで使ってみたいのがGit-User-S...

List

  • 2020/12/07

vitamin-meeeeet - Google Meetをちょっとカスタマイズする機能拡張

Google Meetは他のビデオ会議ツール、たとえばZoomなどと比べて若干機能が見劣りします。仮想背景もありませんし、機能はとてもシンプルです。ようやく背景をぼかす機能はできましたが、他と比べると見劣りするのが現状です。しかしWebブラウザだけで使えるという利点を活かすと、vitamin-meeeeetのような面白...