coffee world

おはようございます、こんにちは、こんばんは、コーヒー好き見習いプログラマーのアキラです。今日は、「vercel」でデプロイするとCRUD操作しても更新されない問題で、デプロイ先を変更するとお伝えしてた件についてお話しようと思います。

デプロイ先は『Netlify』に決まり、CRUD操作などの動作確認も済みアップロードに成功いたしました。
で、『Netlify』にデプロイした時に発生していた”強制遷移によるループエラー”問題も無事解決し、晴れてアップロードしたというわけです。
初めて、ここに訪れた方は分けがわからないと思うので、さっと今までの経緯についてお話をします。

僕は、ここ1年間近く、初めてのアプリ開発してました、
デザインや機能などを自分で決めてようやくアプリ完成目前かと息巻いていた時に、エラーが発生しました。
それは、僕が、当初からデプロイ先にしていた「vercel」にて起きたことです。
その起きたエラーとは、CRUD操作をアプリ内でしても、アプリ上のフロント画面では、更新されない問題でした。その問題は、アプリのフロント画面上でのみ起きる問題で、データベース側の保存先ではちゃんと更新されているということで、ずっと対処に困っていました。
で、今回僕が対処したことは、デプロイ先を変更するということです。

で、

そのデプロイ先が『Netlify』に決まったということなんですね。


たかだか、デプロイ先が決まっただけで大げさかもしれませんね。

デプロイ変更するにあたり「vercel」の次の候補は『firebase』でした。

なので、『firebase』を使用するにあたり、必要なfirebaseツールをアプリフォルダー内にインポートしようとおもっていたのですが、

なぜか、そのfirebaseツールをインポートしようとしても、インポートエラーを起こして先に進めませんでした。
これでは、デプロイじたいができないと思い、色々と対処したのですが、結局諦め次の候補へと移りました。
で、次の候補にと、『Netlify』が候補に上げていたのですが、

実は、『Netlify』にデプロイしても、『Netlify』したときにだけ起きていたエラーがありました。
デプロイ候補にと『firebase』を候補に上げる以前に、一度、試しに『Netlify』にデプロイしたときにこのエラー”強制遷移によるループエラー”が判明していたので、
上記二つ（「vercel」と『firebase』）が無理そうだったら”強制遷移によるループエラー”を対処してデプロイを成功させようと思っていました。

それがあったので『firebase』が、２番目の候補としてあげていたのですが、

こうなったら、そのエラーを対処するしかないというわけで、発生していた”強制遷移によるループエラー”の原因を究明し対処したというわけです。

上記の説明じゃ分かりずらいので、各デプロイ候補で起きていたエラーをまとめてみました。

1. vercel：CRUD操作をしても、アプリ内では更新がされていない。
2. firebase：ツールのインポートエラーが起きてデプロイできない。
3. Netlify：CRUD操作は問題がないが、一部のページで”強制遷移によるループエラー”が発生していた。

みたいな感じで、各デプロイ候補で、エラーが発生しており、今週中に上記3つのエラーが対処できなければ他のデプロイ先に変更予定だったのですが、対処出来て良かったです。

対処が出来たことは嬉しいのですが、「vercel」で発生していたエラーと「firebase」で起きたインポートエラーは、解決しておらずそのままです。こういった問題は、いつか再びぶつかる可能性があるので、今のうちに対処したかったのですが、いまは、アプリ完成が先ですかね

完璧とまではいきませんが、ここで、アプリをお披露目？しますね、と言っても以前にも一度紹介したアプリですので、真新しいところは、ほとんどありませんけどもね。

このアプリで、SNSなどを用いた認証システムを設けるため、ログインとサインアップページに各SNSのボタンがあると思いますが、そちらは使用できません。
ので、メール等とパスワードによる認証になります。
ですから、お試しように、こちらのメールアドレスとパスワードをお使いください。

『Tasting Note』

• ユーザー名：サンプル
• メールアドレス：sample@gmail.com
• パスワード：1111

ログインやサインアップページなどは、変わっているかもしれませんが、他はほとんどかわってません。
大きく変わった点は、このアプリを最初開発してた当時は、Next.jsのPagesRouterという機能を同じNext.jsのAppRouterという機能に変更した点になります。
同じNext.jsではあるのですが、フォルダーやファイルの名称、階層構造や使えていたコードなどが使えなくなったりと大きく変わっており、見た目の変更はほとんどありません。

一応、僕がnotionというアプリでつけた１月での予定スケジュールでは、来月から次のアプリなどに、取り掛かる予定ではあり、この期間中の予定は、予備日として設けていました。この予備日は、エラー対処などで、ずれ込むようなことがあった時のために設けており、スケジュール内では間に合ったといいたいのですが、自分が頭の中で、考えていたスケジュールと比較するとずいぶんとずれ込んだ結果になりました。
僕が頭の中で考えていたスケジュールでは、SNSの認証も設けて、ソート機能や一覧ページの見易さ改善などを終わっている予定ではありましたが、なかなかうまくいきませんね。

けど、アプリのデプロイなどの公開も済んだので、及第点といったとところになります。

及第点とはいえ、自分が理想としていた部分までは、終わらせられなかったので引き続き残りの課題である。

• 各ページの見易さ改善
• ログインユーザーのみのデータを出力させる
• SNS認証システムの付与
• ソート機能の付与
• ページネーションorインフィニティスクロール機能の付与

などなど、自分が、考えていた最低限の付与する予定の機能になります。
本当は、おいおい印刷機能だったりエクセルなどのデータ化だったりと追加したい機能は、結構あるのですが、それは、上記の機能が付与できてから考えようと思います。
あまり、語りすぎてしまうと長くなりそうなので、今日のところはここら辺にします。
とりあえず、「TastingNote」アプリバージョン2のアップロードしたので、試しにお使いください。
最後に、「TastingNote」アプリは、メールアドレスとパスワードなどの登録があります。上記のsampleのメールアドレスとパスワードをご使用ください。登録されているメールアドレスになりますので、ログインページにて、入力するとお使いいただけます。
ぜひ、よろしくお願いします。では、またね。