【カレッジ体験記32～36日目】ECサイト開発

こんばんは。広報あーこです。

広報自ら、3ヶ月で未経験者をエンジニアに育成する自社のプログラミングスクール「プログラマカレッジ」を体験する企画の32~36日目です！

勉強を始めた経緯は、下記noteをご確認下さい。

10/26~11/4(学習31~36日目)の学習内容

3ヶ月目からは、チーム開発（もしくは個人開発）で、ECサイトを作ることになるため、2ヶ月目の最後は、「ECサイト開発」に必要な知識を4each教材を模写しながら学びます！

通常、3日くらいが期日だったのですが、私は業務の都合上、1日の学習時間（カレッジの昼間は1日8時間）を確保できなかったので、6日ほどかけて作成しました…💦

ECサイトに必要な機能って？

ECサイトには、大きく分けて、企業などが商品（１）管理者用ページと、（２）お客様ページの2つあり、それぞれに必要な機能を一通り学びました。

（１）管理者用ページ
・ログインページ
UsernameとPasswordを入れて、「Login」を押下し、管理者ページに遷移させるためのページ

・商品登録
商品名と価格を入れ、「登録」を押下すると、商品が追加できる。また削除もできるようにする。

（２）お客様ページ
・ログインページ
User nameとPasswordを入れ、「login」を押しログイン。登録済の場合は、下に「ようこそ！××さん」と出るようにする。

・カートに商品を追加
カートに商品の注文数を入力し、カートに入れるボタンを押すとカートの枠に商品が追加される。

また、注文数が０で「カートに入れる」を押下したら、アラートが表示されるように設定。

・購入履歴の確認
「履歴」ボタンを押すと過去に購入した履歴を一覧で表示する。

（３）その他
今回、STSを使って開発を進めましたが、事前にデータベースが必要なので、先にMySQLでデータベースを作成してから作業に進みました。
▼作業を行ったSTS

ECサイト開発で大変なことは？

コードを模写して作っていくので、やる前は「簡単にできるじゃん！」と思っていました。。。

しかし・・・・！いざ、ところどころで動作確認があるのですが、全然思ったように動いてくれなくてびっくりです。

管理者ページでは、「login」ページから上手く遷移を出来なかったり、、、

カートに入れるを押下しても「カート」に何も入らなかったり…

「自分の中でミスなくコードがかけた！」と思って、エラーが出た時は、なかなかしんどいですね（笑）

カレッジでのエラー解決方法

この単元は「エラーとの闘い」の連続です。では、プログラマカレッジでは、どのようにエラーを解決して、挫折しないで進められるのかを、私の実体験をもとにみていきましょう！

１）よくある質問を活用

プログラマカレッジのDiscordの「よくある質問」は、ヒントの宝庫。これまでの受講生たちが躓いたエラーが載っています。
私の場合は、自分と同じエラーや似たようなエラーを7割くらいは見つけることができました！

２）個別チャットで講師へ質問
頭がごちゃごちゃになって、解決できないときは、個別チャットで講師に質問します。

エラーが出たら、下記のようにSTSのコンソールとGoogleのディベロッパーツールでエラー内容を確認するのですが、「エラー文の意味が分からない……」と何度もなりました（笑）

その時に講師に質問すると、エラーの直し方教えてくれるのではなく、「エラー文を読む方法」や自分で見つけられるようにサポートするよう教えてくれます。

そのヒントをもとに、エラーを解決できた時は、ホッとします。
また、「次回は、質問しなくても解決できるかも！」という自信もつきます。

まとめ

エラーってただのタイプミスだったりすることが多いんですが、コードが多くなると、毎回、絶望を感じます！（言い過ぎではなく、本当にそんな感じです。）

「エラーを受け入れて、エラー文をしっかり読む力」が大切だなと思いましたし、それを実践で何度も繰り返しやっていく必要があるなと思いました。

その実践の場として、プログラマカレッジでは、3ヶ月目にチーム開発を設けています。自分のエラーだけではなく、他のメンバーのエラーも考えていくことになるので、さらにハードそうです（笑）

私は業務の兼ね合いで残念ながらチーム開発は参加できないのですが、どのようなことをやっているのか、どんな風にやっているか、レポートしていきたいと思います！