エンジニア転職！模擬案件 ～JavaScript～
未経験からエンジニア転職を目指し奮闘中です。
ITスクールでの模擬案件（アパレルのショッピングサイト制作)を通じての成長や奮闘を振り返るシリーズ！今回は2ヶ月苦労したJavaScriptをどう乗り越えてきたかを伝えます♪
JavaScriptとは、苦労したこと、どうマスターしてきたかをそれぞれ書きます！最終的に思うのは、エラーに当たっては、原因を探り、試す！結局のところ、思考と試行の回数がポイントでした。
これから、未経験でエンジニアを目指す方、今ITスクールで学んでいる方に、僕の経験が参考になればと思います。
前回の記事はこちらをご覧ください
1. 使用したJavaScriptのフレームワーク Vue.js
今回の開発で使用したVue.jsはJavaScriptの代表的なフレームワークです。他にも、Angular、Reactなどが有名です。
GoogleやApple、任天堂、noteが採用していた実績もあり、初心者でも扱いやすいのが特徴です。他にも、コンポーネントと呼ばれる、ブロックを組み合わせて開発ができるのが特徴です。
詳しくは公式HPに説明を譲ります（日本語もあります）
ちなみに、初心者でも扱いやすいとありますが、慣れるまでは相当苦労しました。つづいて、開発で苦労したことです。
2. Vue.jsで苦労したこと
模擬案件に入って、本格的にJavaScriptを多用することになり、覚えること、調べることは山ほどある中で、開発も進めていくのが相当ハードでした。
・Vue３ compositionAPI慣れるまでひと苦労
同じVue.jsの中でも２つの記述方式があり、今回はComsition APIという方式を採用しました。もう一方は、事前に触り部分を知っていたこともあり、記述方式の違いを理解するのが第一の関門でした。 例えて言うなら、日常的に日本で車の運転をする人が、海外で右側通行、左ハンドルになった瞬間に、慣れるまで何度か間違える感覚です。
・関数の定義の仕方
基本的な部分では、関数の定義の記述方法もいくつかあり、それらの違いすら理解していない状態でした。結果的に、いろいろな方式で記述してしまい、読みにくいコードになってしまい… PMの先輩が一から教えてくれて、ようやく理解できました。意味は同じなので、動くのは動きますが、違和感のある内容でした。
関数の定義の仕方の例
const foo = () ⇒ { }
function foo () { }
※両方が混在すると見にくい。例えば、英語とカタカナが混ざっている文章のような感覚。
このprogramをストップさせるには、プログラムの強制stopが必要です。
・カートボタン、お気に入りボタンを押してデータべースに反映させる
ここが最大の肝だったかもしれません。普段ショッピングサイトで何気なくやっている、カート、お気に入り機能の実装。
商品ID、ユーザーIDをデータベースに記録していくのが本当に苦労しました。エラーが出て登録されない。ログインしているユーザー情報を、状態管理して情報を渡しておくのも混迷を極めました。ツールの使い方を調べて、試しての繰り返しで、気づいたら夜になっている休日もよくありました。
カフェにこもってPCと向き合う日々
3. 初めての開発を試行錯誤の回数で乗り越えた
Vue.jsでコードを書いて動かすと、大抵エラーが返ってくる!エラーは無くても、画面が表示されない!こんなことは、日常茶飯事でした。
これを乗り越えるには、シンプルに試行錯誤の回数を増やすことです。
エラーが出る→AIやGoogleで検索→修正→試す
本を読むことも大事ですが、時間が限られているのと、最速で結果を出したかったので、とにかく使って慣れろの精神で乗り切りました。
この時に生きたのは、前職の研究開発で実験をしていた経験。半導体の開発でも、テストチップを埋め込んで、あとで検証用に用意していました。
Webページ開発でもエラーの要因を知るために、コードの要所要所にconsole.logを埋め込んでおきました。この情報とエラー内容を組み合わせて、どこまでは処理が進み、どこで不具合があるのかを切り分けられました。
どこで経験が生きるかわからないですね。
5. さいごに
未経験のことに挑戦するには近道はない！！！初心者なら愚直に量をこなすのが最も身につくと個人的には考えています。Vue.jsに慣れる、エラーの内容から要因を理解する。どれも、何度もやった結果、今ではある程度感覚がつかめています。
これから、ITエンジニアの道に進む方も、ぜひ試行錯誤の回数を楽しんでいけると良いなって感じます。
実はこれだけでは終わらない！！！Vue.jsに引き続き、次回はさらに悩まされた状態管理Piniaとデータベースのやり取りaxiosの話です。
まだまだ、挑戦は続きます！
今日はこの辺で、
ありがとうございます。
これまでのシリーズもぜひご覧ください↓