应用实战｜从头开始开发记账本2：基于模板快速开始

上期视频我们创建好了BaaS服务的后端应用。从这期视频开始，我们将从头开发一个互联网记账本应用。本期视频我们介绍一下如何使用模板快速开启我们的应用开发之旅。

相关代码

本期视频我们介绍了如何通过模板快速开始MemFire Cloud项目，简单了解了模板代码内置的功能，同时演示了一下如何配置并运行我们的模板代码。

新建应用

注册登录MemFire Cloud平台，创建一个应用;
在这里插入图片描述

React

npx create-react-app --template memfire-react-template <your_project_name>

Vue

vue create --preset memfire-cloud/memfire-vue-tempalte <your_project_name>

SQL创建

-- 创建用户信息表
CREATE TABLE "public"."profile" ( "id" uuid default uuid_generate_v4() primary key,"created_at" timestamp default now() ,"email" TEXT,"user_name" TEXT,"avatar" VARCHAR,"introduction" VARCHAR
);
-- 创建todo表
CREATE TABLE "public"."todo_list" ( "id" SERIAL,"created_at" timestamp default now() ,"user_id" uuid references public.profile not null,"todo" VARCHAR NOT NULL"completed" BOOLEAN NOT NULL,
);
-- 创建实时聊天记录表
CREATE TABLE "public"."messages" ( "id" SERIAL,"user_id" uuid references public.profile not null,"created_at" timestamp default now() ,"message" TEXT NOT NULL,"user_name" TEXT NOT NULL,"avatar" VARCHAR NOT NULL
);
-- Set up Row Level Security (RLS)
alter table todo_list enable row level security;-- 用户只能删改查自己的todo
create policy "Users can select their own todo_list."on todo_list for selectusing ( auth.uid() = user_id );create policy "Users can insert their own todo_list."on todo_list for insertwith check ( auth.uid() = user_id );create policy "Users can update own todo_list."on todo_list for updateusing ( auth.uid() = user_id );create policy "Users can delete own todo_list."on todo_list for deleteusing ( auth.uid() = user_id );-- 人员信息列表每个人都可以访问
alter table accountenable row level security;create policy "Public account are viewable by everyone." on accountfor select using (true);create policy "Users can insert their own account." on accountfor insert with check (true);create policy "Users can select their own account." on accountfor update using (true);create policy "Users can delete their own account." on accountfor delete using (true);-- 聊天信息表每个人都可以查询数据；只有用户自己才能发送消息。alter table messagesenable row level security;create policy "Public messages are viewable by everyone." on messagesfor select using (true);create policy "Users can insert their own messages." on messagesfor insert with check (auth.uid() = user_id);/*** REALTIME SUBSCRIPTIONS* 只允许在公共表进行实时监听。*/begin;-- remove the realtime publicationdrop publication if exists supabase_realtime;-- re-create the publication but don't enable it for any tablescreate publication supabase_realtime;
commit;-- add tables to the publication
alter publication supabase_realtime add table public.messages;-- 创建存储桶
insert into storage.buckets (id, name)values ('avatars', 'avatars');insert into storage.buckets (id, name)
values ('files', 'files');-- Set up access controls for storage.
create policy "files images are publicly accessible." on storage.objectsfor select using ( true );create policy "Own can upload an files." on storage.objectsfor insert with check (true);create policy "Own can update their own files." on storage.objectsfor update using ( true );create policy "Own can delete their own files." on storage.objectsfor delete using ( true);