ど素人からのVue勉強

転職先でVue.jsを使い始めました。

しかし、過去にフロントエンド開発をしていたときには生のJavaScript(ES2015以前)を使っていました。

jQueryを使うとすげー便利!と思いながら開発していたことを思い出します。

そんな実務経験でフロントエンドの情報が止まっていたため、Vueを理解するのにとても苦しんでいます。

Vue勉強おすすめサイト

Vueの勉強を始めて役に立ったサイトです。

Vueの基礎

Vue.js公式サイト

Vue.js入門

Vue.jsコンポーネント入門

Vueの仕組み

Vue.js最初の難関、「props down, event up」を初心者にわかるように解説してみた

Vue2.xのリアクティブな動きを分かりやすく説明してみる

まずはVue.js公式サイトから

会社の人に聞いても、ネットで調べてみても、まずはVue.js公式サイトで勉強するのがいいと聞きました。

その言葉を信じて勉強を始めたのですが、まずはバインドでつまずきました。

とても便利な機能なことは分かる、けど何かよく分からないと言う状態でした。

そんな感じだったのですが、公式サイトを何回か繰り返し読んでいるとようやく理解することができました。

「1回で理解しようとせずに、分からないところは何回も繰り返すうちに理解できればいい」くらいで勉強するのが挫折しないために重要です。

propsとemitにより1週間で挫折する

ただ、実際に現場のソースを見てみると、バインドを理解しただけではダメでした。

その次に出てきたのは、propsとemitです。

Vue.jsを使うメリットとして、部品をコンポーネント化できますが、コンポーネントを使う際には、必ず親子間でのデータの受け渡しが発生します。

そのときのpropsとemitを使ってデータを渡す理由が全く理解できませんでした。

表面的には、親から子へはprops、子から親へはemitを使えばいいのは分かるのですが。

何故こんな面倒なことをしているのか?

何で普通にデータの受け渡ししないのか?

がGoogle検索の上位記事には全然書いていませんでした。

理解できないまま使うことがどうしても気持ち悪く、理解できない自分に絶望していったん挫折しました。

1週間くらい経って、ここで辞めたらエンジニアとしてキャリア築くの無理だろうなと思い、調査を再開しました。

そしたら、以下の素晴らしい記事を発見しました。

Vue.js最初の難関、「props down, event up」を初心者にわかるように解説してみた

子コンポーネントから見た親コンポーネントは絶対的な存在で逆らうことは許されていません。子コンポーネントが自らのプロパティを勝手に変えるということは、親コンポーネントでの指定と不整合が起きることを意味します

この文章読んだときに、これ!知りたかったのはこれ!となりました。

書いてくれた人に感謝しかありません。

世の中のITエンジニア凄すぎない?

TwitterやQiitaやZennを見ていると、技術的なことを理解して自分の言葉で書ける人が多すぎてびっくりします。

同僚も平然とVueを使って開発してますし。

序盤も序盤なはずなのに、理解するのにこんな苦労するのか…と、かなり焦りがあります。

ただ、ここでめげたら前に進めないですね。

理解できないのであれば手を動かして、それでもダメなら理解できる言葉で説明してくれる記事を探していこうと思います。

今はようやく、QiitaZenn などの記事を読んで、理解できる箇所が出てきました。

こうなると勉強も少し楽しくなりますね、めげずに勉強していこうと思います!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です