2020/9/28 リリースいたしました！
2020年4月から作ろう作ろうと思いつつ、
タイミングがあわず保留していた『Vue.js』講座。
2020年お盆を過ぎた頃、ようやく着手しました。
#php #laravel で追加要望聞いたら #vuejs のリクエストが返ってくるという不思議な体験。
それだけ需要あるということですな。
明日から収録予定の #excelVBA 終わり次第、次は #vuejs やりますのでもうちょいお待ちを。。 (今日はwindowsでノイズ削除のあれこれテストしてました)— 世界のアオキ🥑プログラミング×生涯学習×熊本 (@aoki_monpro) June 17, 2020
#laravel で追加要望聞いたら #vuejs のリクエストが返ってくるという不思議な体験。それだけ需要あるということですな。明日から収録予定の #excelVBA 終わり次第、次は #vuejs やりますのでもうちょいお待ちを。。 (今日はwindowsでノイズ削除のあれこれテストしてました)
インプットしすぎて消化しきれなくなってきたので、 Vuejs 収録少しずつ始める事に。 少し迷ったのですが Vue3 の情報がまだまだ少ないという事で、前半はVue2 から始める構成にしました。淡々とがんばるどー。
— 世界のアオキ🥑プログラミング×生涯学習×熊本 (@aoki_monpro) August 13, 2020
インプットしすぎて消化しきれなくなってきたので、 Vuejs 収録少しずつ始める事に。 少し迷ったのですが Vue3 の情報がまだまだ少ないという事で、前半はVue2 から始める構成にしました。淡々とがんばるどー。
2020年9月7日時点で動画約50本、約5時間分収録していて、
ようやくぼんやり方向性見えてきました。
Vue.js初心者向け講座の前提
『Vue.js』は『.js』とつく通り、『JavaScript』で作成されています。
『Vue.js』のマニュアルにも書いてありますが、
『中程度のJavaScriptの知識が必要』になります。
公式ガイドは、HTML、CSS そして JavaScript の中レベルのフロントエンドの知識を前提にしています。フロントエンドの開発が初めてであるならば、最初のステップとして、フレームワークに直接入門するのは良いアイデアではないかもしれません。基礎を学んで戻ってきましょう！他のフレームワークでの以前の経験は役に立ちますが、必須ではありません。
参照元： Vue.jsマニュアル
前提として『JavaScript』の、
変数/定数/関数/オブジェクト/イベント/非同期処理(Promise/async/await)/非同期通信(fetch)/クラス/モジュール/環境構築(Node.js/babel/webpack)
あたりの知識が必要になってきます。
もしその辺の知識が曖昧という場合には、
別の講座で『JavaScript』を扱っているので、こちらもご活用いただければと思います。
Vue.js初心者向け講座の特徴その1 まとめて詰め込みすぎない
『Vue.js』はプログレッシブ(段階的)フレームワークと呼ばれ、
はじめは小規模から、
機能を追加することで大規模まで対応できるというつくりになっているのですが、
いきなり小規模〜大規模を覚えようとすると、
覚えることが多すぎる割に使い所がわからないとなりがちで、
『結局なにをやればいいのさ』となってしまいがちです。
そんな実体験もありこの講座では、
はじめはちょっとずつ、
jQueryでもできることから、
時間をかけて進めるような構成にしています。
(今日時点で収録済みの約5時間分は、jQueryとそこまで変わらない内容だろうと思います。)
Vue.js初心者向け講座の特徴その2 できるだけ情報量を減らす
1つめと重複しますが、
『Vue.js』には専用の機能が豊富にあって、
中にはあまり使わない方法もあります。
また、『Vue.js』のバージョンが変わるたびに、
新機能が増えたり、使えた機能が非推奨になったりと変化もあるので、
非推奨、不要な箇所、ややこしい機能などはできるだけ説明をカットして、
少なく濃く、を目指して構成しています。
Vue.js初心者向け講座の特徴その3 できるだけ実践重視
機能だけ吸収しようとしても、
自由度が高い分使い所がわからないとなりがちなのが
『プログラミング』だと思っているので、
どんなものをつくれるのか、というのを
できるだけ多く取り入れています。
現時点で、
- タブウィンドウ
- モーダルウィンドウ
- カルーセル(スライドショー)
- フォーム
- フォーム(Ajax + API)
といったサンプルの作成方法を盛り込んでいて、
多少説明が重複しつつも、
『Vue.js』を使ってどんなことができるか、ということを
できるだけ多く盛り込むように意識しています。
Vue.js初心者向け講座 今後の予定
引き続き1日1本〜2本ペースになると思いますが収録を続けつつ、
10月中旬までにはリリースできるように頑張ります。
講座内容としては、
- Vue.js基礎
- フォーム・Ajax <- ここまで収録済み
- コンポーネント
- 部品化 (v-slotなど)
- Vuetify (CDN)
- SFC (Vue-CLI)
- SFA (Vue-router)
- Vuetify (npm)
- おまけ
- Vue3 (後ほど追加予定)
といった内容を予定していて、
『Vuex』や『Nuxt.js』はさらに覚えることが増えるということで、
別講座に切り分けることにしました。
できるだけ簡単でもいいので実践的なアプリをつくりつつ、
知識だけでなく実際に使えるような構成になるよう
頑張っております。
Vue.js初心者向け講座 参考にした資料
いつもの通り、
数多の本・ブログ記事を参考にさせていただきました。
その中でも手持ちの本を紹介しておきます。
安心の山田さんクオリティ。全般的にベースとしています。
jQueryに近く手軽に使える難易度。
内容盛りだくさん、ちょい難しめ。
ちょっとでも盛り込みたい。
Vuex側に移るかもです。
他にもVue.jsマニュアルはもちろん、
VueMasteryの内容も改良して持ち込み、
いろんな情報・経験をキュレーションしてもりもり構成しております。
Vue.js初心者向け講座 を収録してみて
まだまだ途中な状況ではありますが、
収録しながら『ん？』っと思ったことをググりまくり、再構成し、
ちょっとずつ組み合わせながら構成するというスタイルではありますが、
初心者の視点から、できるだけわかりやすく構成しています。
完成までもうちょいお時間かかりますが、
自信を持ってだせるクオリティにしますので、
ぜひご活用いただければと思います。
この記事へのコメントはありません。