2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【React × firebase hosting × supabse】学習記録アプリを作ってgithub actionsでCI/CDを構築

Posted at

はじめに

私は現在、プログラミングコミュニティ「JISOU」に参加させていただいており、Reactの勉強を基礎から行っています。
supabaseの利用、Reactの自動テストやgithub actionsを使ったCI/CDの構築などを初めて行いました。そこでの気づきの共有となります。

行ったこと

前回のJISOUの課題は、学習記録アプリの作成(データが永続的ではないもの)でした。

今回は前回の学習記録アプリへの追加改修で
・supabaseのデータベースを利用して、記録を永続化する
・firebase hostingを利用して、ページをネット上に公開する
・github actionsを利用し、CI/CDを構築する
・jestとreact-testing-libraryを利用し、自動テストを行う
というものでした。

気づき

  • supabaseについて
    supabseは初めて利用しました。数行のコードで簡単にDBに接続できとても便利だと感じました。
    私はfirestoreやawsのdynamoDBを利用したことがありましたが、supabseはNoSQLではなく、リレーショナルDBとなっており普段MySQLなどを使う人にとっては、データベースの構成が作りやすいと思いました。AuthenticationやStorageなどのサービスもあるようなので、使ってみたいです。
  • github actionsについて
    初めてgithub actionsを利用してCI/CDを組むことになったんですが、ベースイメージを選択して(今回はubuntu)、stepごとにコマンドを実行し、reactのビルド・テスト・デプロイなどを行うものでした。普段Dockerを使っていたからかもしれないですが、とてもイメージしやすく使いやすかったです。
    ベースイメージにはMacOSなども入っているようだったので、iOSアプリの開発など行った際にはgithub actionsでビルドしたいなと思いました。
  • reactの自動テストについて
    こちらの気づきは別の記事として公開しました。

自動テスト時のデータベース関連処理やAPI処理がうまくイメージできず、苦戦しました。
JISOUの他のメンバーの方も苦戦されているようでした。

おわりに

JISOUのメンバー募集中

プログラミングコーチングJISOUではメンバーを募集しています。
日本一のアウトプットコミュニティでキャリアアップしませんか?

気になる方はぜひHPからライン登録お願いします👇

2
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?