「今日のスダクリエイト」タグで作ったJavaScriptのコンテンツ - QiitaTwitterで仲良くなったスダさんという方を題材に、この1年間 #今日のスダクリエイト というハッシュタグで趣味のコンテンツを作ってきました。自分が書きたいプログラムを定期的に書くことで、業務で扱う以外の技術の勘が鈍らなくなり、作ることの喜びやモチベーションが向上し続けました。 本記事では、ES2015+、TypeScript、SVG、WebGLなどを使ったインタラクションをピックアップし、その技術的な工夫点とともに紹介します。 SVG、fetch APIで泡アニメーション SVGの線や塗りなどの形状をJavaScriptでコントロールしようとするとSVGのインライン展開が必要ですが、HTMLのコード量が増えてしまいます。HTML内にSVGコードは書かず、Fetch APIを用いてリソースをダウンロードしてパースし、CSSアニメーションを加えたデモです。 XHRに代わるリソース取得API
