Repository files navigation

• Remix Docs
• Xata.io
• Tailwind Docs

npm run install

npm run dev

1. 点击Add database

2. 创建两张表user和resolution ,定义字段以及把user表和resolution关联上

数据结构如下

{"id":"rec_abcdefg","year":2023,"resolution":"hi","isCompleted":false,}

1. 安装xata.io/clinpm install -g @xata.io/cli
2. 启动xata auth login
3. 选择Create a new API key in browser
4. 输入new-resolutions 作为名称
5. 点击Create API key
6. 输入xata init
7. 选择new-resolutions 作为数据库
8. 选择Generate TypeScript code 作为code generation
9. 输入utils/xata.ts 作为xata输出路径output file
10. 选择<None>

xata init命令生成独立的utils/xata.ts文件。这包含xata cli和所有数据模型的类型。如果将来对数据库模式进行了更改，请运行xata codegen命令来生成一个新的xata.ts文件。

1. 安装npm install remix-auth remix-auth-form
2. 添加SESSION_SECRET 到.env 文件
3. 使用以下内容创建app/utils/session.server.ts

import{createCookieSessionStorage}from"@remix-run/node"constsessionStorage=createCookieSessionStorage({cookie:{name:"_session",sameSite:"lax",path:"/",httpOnly:true,secrets:[process.env.SESSION_SECRET],secure:process.env.NODE_ENV==="production",},})export{sessionStorage}

1. 登录在app/routes/login.tsx
2. 登出在app/routes/resolutions.tsx

构建静态页面

npm run build

启动生产环境

npm start

然后选择一个vps进行前端部署