皆さんこんにちは！おにぎりちゃんです(*^_^*)

前回見てくださった皆さんありがとうございます！今回もよろしくお願いします！

私の記事を読んでくださっている方はもうご存知だと思いますが、現在ECサイトの作成する課題に取り組んでいます。

課題を進めていく中で、商品の情報が見れる商品詳細画面の作成にてある問題が起きたのです。

問題については後ほど明らかになりますのでお楽しみに…

ちなみに商品詳細画面ではこんな処理を行う必要がありました。

・商品情報の表示

・カートへの追加

・ほしいものリストへの追加

・レビューの表示

・レビューの投稿

今回はこの中のレビューの表示、レビューの投稿についてを取り上げたいと思います。

商品情報の表示、カートへの追加、ほしいものリストへの追加を終え、

私はまずレビューの表示から取り掛かることにしました。

もともとデータベースに登録されているレビューを無事に表示させることに成功！！

しかし、レビューはもともと登録されているものではありません。

同画面の投稿フォームより投稿されなければならないので、投稿フォームの実装へ取り掛かりました。

(ここで前回の記事内容 【備忘録：研修課題(intra-mart)】”undefined”の比較 を使用しました。)

そう、ここである問題が明らかになるのです…

あれ？画面の再読み込みをしないと今さっき投稿したレビューが見れないぞ

投稿フォームの内容は投稿ボタン押下時にデータベースに登録できています。

しかし、再読み込みをしなければ先程投稿したレビューがブラウザに表示されないという問題が起きたのです。

表示も投稿も正しくされているのになぜすぐに表示がされないのか分からない私は、またまた先輩社員に質問させていただきました。

（今回も会話形式でご覧ください）

おにぎりちゃん→　先輩社員→

「投稿済みレビューの表示もできているし、投稿フォームでのレビューの投稿もできるのですが、再読み込みしないと反映されません…」

「それはレビューの追加の処理よりも先に表示の処理をしているからじゃない？」

「はい、元々投稿されているものを表示させるためには先に表示の処理が必要だと思いました…」

「更新したものをすぐに表示させたい場合は、表示より先に更新をしてあげる必要があるよ」

なぜこんな当たり前のことに気付かなかったのかとても不思議ですが、私はずっと更新の前に表示を行ってしまっていたのです。

（当たり前ですが）順番を逆にしてみると即時反映ができるようになりました！

自分がこれで間違いないと思って進めていると、なんで気付かないと思うようなところで間違いがありますよね…

開発未経験の私は処理の作成にとても時間がかかってしまうので、

順を追って整理すれば気付ける部分には時間がかからないように注意して開発に取り組んでいきたいと思います。