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

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

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

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

もっと見る

None

  • 2020/05/26

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

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

List

  • 2020/05/25

LightProxy - ネットワークをキャプチャ。Web開発用プロキシ

Webアプリケーションやスマートフォンアプリの開発時に、ネットワークのやり取りを確認したいことがあります。その手のソフトウェアとしてCharlesが知られていますが、有償であるために避けている人もいるかも知れません。そんな方に使ってみて欲しいのはLightProxyになります。Charles同様、ネットワークをキャプチ...

List

  • 2020/05/18

PWA install - PWAインストール体験を向上させる

PWA(Progressive Web Apps)ではWebアプリケーションをローカルアプリのようにインストールできます。しかし、ユーザとしてはインストールするメリットが見えないとインストールしてくれないでしょう。そこで使ってみたいのがPWA installです。ユーザがインストールしたくなるように促せるウィザードライ...

List

  • 2020/05/17

midori - 背景画像を格好よくアニメーション

画像をただ表示して終わりでは印象に残りづらいです。しかし、JavaScriptやCSSでちょっとアニメーションさせるだけでもインパクトが大きく違います。さらにエフェクトまで行われれば、さらに印象深くなります。今回紹介するmidoriはまさにそのためのライブラリになります。画像の切り替え時にアニメーションやエフェクトを行...

List

  • 2020/05/17

PDF-LIB - JavaScriptでPDFを作成、更新

Web上で扱うことも多いPDF。ただドキュメントとして表示するだけで、あえてJavaScriptから操作することは殆どないでしょう。しかし、JavaScriptとPDFが連携できるようになれば、もっと可能性が広がりそうです。今回紹介するPDF-LIBはWebブラウザ、nodeのどちらからでも操作できるPDFライブラリで...

List

  • 2020/05/11

Fishbowl - みんなで遊べるジェスチャーゲーム

Fishbowlというのは一種のジェスチャーゲームのようなものです。ルールは簡単にいえば、一人3つずつ単語やフレーズを書き出します(アイスクリームなど)。それを一カ所に集め(ここが金魚鉢)、2つのチームに分かれます。各チーム代表者が紙を引いて、その単語を口に出さずにチームメイトに説明します(暑い日に食べる冷たいもの、な...

List

  • 2020/05/08

Audio DSL - AudioWorkletを手軽に扱えるDSL

Web AudioはWebブラウザ上で音楽を扱えるAPIですが、処理をメインスレッドで行う必要があります。それに対してAudioWorkletはオーディオ処理に特化したWorkerで、バックグラウンドで音声処理が可能になります。しかしオーディオ自体の処理は複雑なイメージがあります。そうした処理をDSLでシンプルにしてく...

List

  • 2020/05/03

Nautilus - Docker Composeの設定を可視化

開発時にDockerを利用している開発現場は多いでしょう。そして、複数のコンテナを組み合わせる場合、Docker Composeを使って管理しているのではないでしょうか。Docker Composeの設定を細かくこだわると、徐々に複雑なものになっていきます。そこで使ってみたいのがNautilusです。Docker Co...

List

  • 2020/05/03

markmap-lib - Markdownをマインドマップに展開

Markdownでメモを書くのに慣れると、なんでもMarkdownで書き残しておきたくなります。後はMarkdownから別なフォーマットに展開できればいいわけです。グラフィカルな部分が少ないので、コンテンツに集中できるのが大きなメリットでしょう。今回紹介するmarkmap-libはMarkdownファイルをマインドマッ...

List

  • 2020/05/01

Crossnote - VS CodeをMarkdownエディタに

Markdownエディタに求める機能は何でしょうか。例えばファイルが一覧表示になっているのは大切です。さらにタグ付けできたり、タスク管理ができたりするのも便利です。他にも添付ファイルやプレビューなど様々な機能が挙げられます。プログラミングエディタとしてVS Codeを使っている方に試して欲しいのがCrossnoteです...

List

  • 2020/05/01

Theia - Eclipse製のVS Code対抗馬

プログラミングエディタの歴史はAtomの登場で一気に変わったといえます。AtomをベースにVS Codeが登場し、一気に人気を獲得しています。VS CodeはMicrosoft製のソフトウェアですが、これだけ多くの開発者に受け入れられているのは、彼らの変革を象徴する存在ともいえるでしょう。そんなVS Code対抗馬とし...

List

  • 2020/04/30

COVID-19 Japan Web API - コロナウィルスのデータをオープンなWeb APIで公開

コロナウィルス(COVID-19)が世界的に猛威を振るう中、オープンデータ活用も多数行われています。データを可視化したり、予測に使ったりといったことも、元データが出てくればこそです。しかし、そうしたデータが見やすい形になっているかは別です。ExcelやPDFで公表している場合もあるかも知れません。そこで使ってみたいのが...

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

Ocula - PWA製のお天気アプリ

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

List

  • 2020/04/25

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

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

List

  • 2020/04/22

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

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

List

  • 2020/04/19

Type Puzzles - TypeScriptの基礎、型について学ぶ

TypeScriptをこれから学習したいと考えていますか。TypeScriptはJavaScriptのスーパーセットなので、基本的にJavaScriptでできることはすべてできます。そして追加される中で最も便利で知っておかないといけないのが型の使い方です。今回紹介するType PuzzlesはTypeScriptの型を...

List

  • 2020/04/18

Fluent UI - Microsoft社製のReact向けUIコンポーネント

HTML5で高度なWebアプリケーションの開発が行えるようになっています。そういったサービスを開発する場合、大事なのはUIです。従来のWebっぽさを残すと、ユーザビリティが低くなりがちです。なるべくネイティブ風なUI/UXを意識しましょう。もしWindows向けのサービスを開発しているならばFluent UIを使ってみ...

List

  • 2020/04/15

Backstage - 社内用開発者ポータル

開発者用のサービスが広まるのにつれて、チェックすべき情報が増えています。コンテナやネットワークの状態、使い方のドキュメント、各種システムのステータスも監視しなければなりません。そこで使ってみたいのがBackstageです。Spotifyが開発している開発者ポータルシステムです。## Backstageの使い方トップペー...