はじめに
初めまして！
エンジニアになって数年、今まで本を読むだけでしたが、もっとプライベートで楽しみながら成長したい！自分が学んだ足跡を残していきたい！と思い記事を書きました！
最終的には自在に開発できるようになりたいと思っています。
いろいろな記事を参考にさせてもらっています。
その中でもこれってどういう意味？とかつまづいたところを念入りに書いていこうかと思います。
今回の目的
nextjsはまだですが、実際のアプリ開発からどう作られていくかを学んでいくためにクローンアプリを開発します。
とは言っても自分で考えることは特になくYoutubeを見てやっていきます。
その中で覚えておきたい部分を分類ごとに記載していきます。なので、その時々に知ったことを小出しにしていく形になります。
前回
使用したものや事前準備
・Macbook Pro
・Visual Studio Code
使用にさせていただいた動画
Next.jsの知識
更新用関数
set関数内でpropsを受け取るようにすれば現在のstate値を受け取れる（スナップされた値ではない）
setVariant((currentVariant) => currentVariant === "login" ? "register" : "login")
Prismaの知識
拡張機能
Prismaでinstall、コード補完、書式設定、定義へのジャンプなど。
設定
npm install -D prisma
インストール
npx prisma init
prismaフォルダ生成,providerは好きなものに変更
npm install @prisma/client
データベースに対するクエリを簡単かつ効率的に実行するための自動生成される型安全なクエリビルダー
gloval.d.ts
globalオブジェクトを使ってアプリケーション全体で共有される変数を保持することができる。
追加するには下記
declare global {
namespace globalThis {
var prismadb: PrismaClient
}
}
Atlas
MongoDBのデータベースをクラウドでホストするためのフルマネージドサービス
無料プランでプロジェクト（スキーマ？）を一つ作れる。
ソースコードからの接続方法は「Connect」ボタンを押してVsCodeの項目参照
URIの末尾にデータベース名を追加すること。下記のエラーが出る
schema.prisma
modelはテーブル定義が作れる
＠＠unique([provider, providerAccountId])
provider と providerAccountId の組み合わせが一意であることを保証する。
id String ＠id ＠default(auto()) ＠map("_id") ＠db.ObjectId
一意であり、デフォルトでObjectIdを自動生成。
mongoDBの実際のカラム名は_idで、idで紐付けている。
＠updatedAt
レコードの更新時に自動で値を現在日時に更新
user User ＠relation(fields: [userId], references: [id], onDelete: Cascade)
userIdとUesrモデルのidを紐づける。Userモデルの関連するレコードが消えた場合、紐づいているuserIdレコードが削除される
npx prisma db push
Databaseにmodel情報をpush
次
まだ