JSのライブラリやフレームワークをいろいろ試してみるシリーズをここにまとめます。随時更新中です!
JSの基本書式についてはこちら
※参考:【HTML、CSS、JSの書式】これを読めばコードが読める!書ける!まとめ!
ReactでWebアプリ作る人に、俺はなる!(2019/3/19追加)
※参考:ReactでWebアプリを作るシリーズまとめ
ライブラリ
jQuery
私がWebデザイナーになったとき大変お世話になったライブラリ!プログラミングの入り口。これがなければWebサイトを作れていなかった。
卒jQueryのためのソース読み解き
ライブラリ、フレームワークとは何か?jQueryのコードも生JS(ネイティブJS)と同じ書式で書かれていることを理解する。これは脱jQueryなんかじゃない「卒jQuery」だよと言いたい!
※参考:【卒jQueryへの道】生JSとライブラリとフレームワークの理解
jquery.inview.jsでスクロールアニメ
jQueryプラグイン「jquery.inview.js」とCSSアニメを組み合わせてスクロールするとフワッと動くアニメーションを作る。
※参考:スクロールするとフワッと現れたり動いたりするアニメーション【jquery.inview.js & transition】
チャートライブラリ
データをビジュアル化するチャートライブラリたち。
Chart.js(Canvas要素のチャートライブラリ)
JSでチャートを作るライブラリのうち、Canvas要素ベースのライブラリChart.jsをこと始める。
※参考:Chart.jsをGettingしてStartedする
C3.js(SVGのチャートライブラリ)
JSでチャートを作るライブラリのうち、SVGベースのライブラリC3.jsをこと始める。
※参考:SVGの方のチャートライブラリ「C3.js」をGettingしてStartedする
Google Charts(ググドラから読み込めるチャートライブラリ)
C3.jsと同様SVGベースだが、Googleドライブからデータを読み込めるチャートライブラリ。Google製。
※参考:Google ChartsをQuickにStartする
Three.js(ブラウザで3D)
WebGL(ブラウザ3DCG)に憧れて、ライブラリThree.jsに取り組む。(※2019/12/31他の記事に独立させました!)
※参考:【WebGL】Three.jsを習得するためにやったことまとめ(随時更新)
p5.js(ビジュアルコーディング)
Javaのライブラリ「Processing」をルーツとする。ユーザーの操作に反応するインタラクティブなコンテンツが作れる。(ボリュームがあるため、他の記事でまとめます!)
※参考:【ビジュアルコーディング】p5.jsを習得するためにやった事 まとめ(随時更新)
Tone.js(ブラウザサウンド)
Web Audio APIを使ってブラウザで音楽を作れるライブラリ。(ボリュームがあるので別の記事でまとめます!)
※参考:【Web Audio】Tone.jsを習得するためにやったことまとめ(随時更新)
フレームワーク
フレームワーク比較
フレームワークって何?ライブラリと何が違うの?3大フレームワークって何?3つのうちどれがいいの?調べたり触ったりしてみた(Vue.jsを最初にやってみることに決めた)
※参考:三大フレームワークとかSPAとか仮想DOMとかわかりにくかったのでHellow Vue.jsしてみた!
Vue.js
JS3大フレームワークの一つ!(ボリュームがあるため、他の記事でまとめます!)
※参考:Vue.jsを習得するためにやった事 まとめ(随時更新)
React
三大フレームワークの二つ目!(ボリュームがあるため、他の記事でまとめます!)(2019/12/31追加)
※参考:Reactを習得するためにやったことまとめ(随時更新)
Webアプリ作る人に、俺はなる!(2019/3/10追加)