## はじめに
- 最近流行りのフレームワークを使用し、メモアプリを作成した。
- シンプルな構造で、初学者でも学びやすい。
- 認証機能を追加し、ログイン・ログアウトまで実装した。
- 本記事ではSvelteとSupabaseでアプリ作成・データベース接続までを記事にした。
環境
- Mac 11.5.2（2020）
- node v17.2.0
問題点
- 編集機能がないため、メモを登録した後削除することしかできない。
開発
mkdir アプリ名
npm init svelte@next アプリ名
- Which Svelte app template?: demo app
- Use TypeScript?: No
- Add ESLint for code linting?: No
- Add prettier for code formatting?: No
cd アプリ名
npm i
npm run dev
Supabase
Supabaseとは
- Webの管理画面からDBを作成・管理できるプラットフォーム。
- https://app.supabase.com/
使い方
- 登録後orサインイン後、'New project'ボタンをクリック
- Name:○○
- Database Password: ○○
- Region: Nprtheast Asia(Tokyo)
- Princing Plan: Free - $0/month
- 問題なければ'Create new project'ボタンをクリック
接続
touch .env
<* .env *>
VITE_PUBLIC_SUPABASE_URL=supabase_url
VITE_PUBLIC_SUPABASE_KEY=public_anon_key
Supabase 管理画面
- Setting → APIへ
- supabase_url: Config → URLをコピー
- public_anon_key: Project API keys → 'anon' 'public'をコピー
- .envに貼付
参考記事
https://github.com/Kamekure-Maisuke/sva-sample
[Kamekure-Maisuke/sva-sample]
さいごに
Supabase 作成したprojectを削除する方法
- 【歯車マーク】Settingsへ
- Delete Projectを選択。
- Are you absolutely sure?：(Type the project name in here):Project Nameを入力。
- I understand, delete this projectを選択。