LEFログ:学習記録ノート

leflog: 学習の記録をどんどんアップしていきます

Next.jsとSupabaseでTODOアプリを作ってみました

リポジトリ

Shin-sibainu様のこちらの動画、およびリポジトリを参考に学習致しました。

自分のリポジトリは以下のものとなります。

github.com

https://github.com/lef237/supabase-tutorial-yt

ブラウザやローカルサーバーを再起動するとうまく動く

アプリから操作してもなぜかPostできない(行を挿入できない)ときは、ローカルサーバーを再起動するとうまく動く

CSSが反映されないときもローカルサーバーを再起動するとうまく動く

Supabase UIでrowをDeleteできないとき(Deleteボタンが表示されない時)はブラウザのタブを再読込すると表示されるようになる

SupabaseとPrismaを使うとき

もしPrismaを使う前提でセットアップすると、Supabase独自の記法を考えずに、Prismaを操作していると自動的にSupabaseにデータが投入されるイメージ

JavaScriptでは関数を使う時、必ず末尾に()をつける

getAllTodos()という関数を使う場面で、getAllTodosと括弧を忘れていたせいで、なかなかエラーが解決しませんでした。

地味に怖かったです……😅 こうした基本的なところほど意外と見落としやすいので、気をつけようと思います💪

まとめ

初めてBaaS(Supabase)を使ってアプリを作ってみました

とても便利と思う反面、まだまだ使い方で分からないことがあるので、後日更に深掘りしようと思います。

ただ、BaaSについてはそのサービスが使えなくなった場合にロックイン(乗り換えが困難になる)の恐怖があるので、自分でサーバーを立ててバックエンドを動かす技術はこれからも重要だな~と改めて思いました。

(この前のDiscord Botの件もあるので……)