はじめに gulpとBrowserifyを組み合わせてフロントエンドJSをビルドする機会があったので、一通りやってみたことをまとめてみた。 gulpについて Node.jsのstreamを活用したビルドシステム、ということらしい。 Streamのおかげでビルドフローをとても直感的に記述できると感じた。 他のWebフロントエンドのビルドシステムは使ったことがないので比較はできないけど…。 Browserifyについて node.jsと同じように (npm、requireなどを使って) モジュール化されたフロントエンドJSが書けるツール。便利。 JSのモジュール化というと、最近はwebpackというのもあるらしい。 基本 gulp = require 'gulp' source = require 'vinyl-source-stream' browserify = require 'brow

TOEICのリスニング問題集をやっていて「ムキーッ！」となることありませんか？ 私は２つほどあります。１つは「ひとつの問題を繰り返して聞きたいのにファイルが分かれていない」こと、もう１つは「何を言ってるのかさっぱり分からない」ことです。そこで今回、１つめの問題を解決すべく、CD音源を複数の問題別に分割するWebアプリを作りました。 Wave Cutter for TOEIC®（Source） Chrome、Firefox、Edgeで動作確認済みですので、ぜひ遊んでみてください。 使い方 MP3ファイルを読ませると自動的に空白を判断して分割します 自動分割で上手くいかなかったところを手動で調整します 完了ボタンを押すとZIPファイルが手に入ります 2に関しては、出力予定のファイル名（左側）と波形データの内容（右側）を一致させるゲームだと思うと手っ取り早いです。 主な機能 波形の削除、分割、結