当前位置: 首页 > news >正文

借助 Cloudflare D1 和 Drizzle 在 Astro 上实现全栈

使用 Cloudflare D1 和 Drizzle ORM 将后端添加到 Astro 项目的分步指南

文章目录

  • 安装 Astro
  • 添加 Cloudflare 适配器
  • 部署到 Pages
  • 安装 wrangler 并登录
  • 创建 D1 数据库
  • 创建 wrangler.toml 文件
  • 将 .wrangler 添加到 .gitignore
  • 更新 astro.config.ts
  • 安装 Drizzle 依赖项
  • 创建 drizzle.config.ts
  • 创建您的架构
  • 将脚本添加到 package.json
  • 生成 migrations
  • 在本地应用迁移
  • 使用 Drizzle Studio 与本地数据库交互
  • 将数据库添加到本地
  • 渲染链接
  • 在 Pages 项目中添加绑定
  • 运行预览版和生产版的迁移
  • 将数据添加到预览和生产环境
  • 就这样!

安装 Astro

这非常简单——运行以下命令:

npm create astro@latest
  • 选择 Empty 作为模板
  • 选择使用最严格的 TypeScript
  • 默认值对其他一切都很好

然后您可以 cd 进入您的项目并运行 npm run dev

添加 Cloudflare 适配器

在您的项目中,您现在可以运行:

npx astro add cloudflare

对所有事情说“是”,然后提交所有内容并将其推送到 Github。

部署到 Pages

前往创建 Pages应用程序,然后单击“连接到 git”以创建页面

使用 Github 存储库的应用程序。

请务必选择 Astro Framework 预设!

安装 wrangler 并登录

如果您尚未执行此操作,请安装 wrangler 并通过运行以下命令登录:

npm i -g wrangler
wrangler login

创建 D1 数据库

我们将创建两个数据库,一个用于生产,一个用于预览版本。

为此,请运行以下命令:

wrangler d1 create d1-demo-prod-db
wrangler d1 create d1-demo-preview-db

创建 wrangler.toml 文件

我们需要一个 wrangler.toml 文件,其中包含我们刚刚创建每个数据库中的 database_id

# wrangler.toml
node_compat = true[[d1_databases]]
binding = "DB"
database_name = "d1-demo-prod-db"
database_id = "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
preview_database_id = "DB"[env.preview]
name = "preview"
[[env.preview.d1_databases]]
binding = "DB"
database_name = "d1-demo-preview-db"
database_id = "yyyyyyyy-yyyy-yyyy-yyyy-yyyyyyyyyyyy"

将 .wrangler 添加到 .gitignore

echo .wrangler >> .gitignore

更新 astro.config.ts

我们需要像这样添加 D1 绑定:

// astro.config.ts
import { defineConfig } from "astro/config";import cloudflare from "@astrojs/cloudflare";// https://astro.build/config
export default defineConfig({output: "server",adapter: cloudflare({runtime: {mode: "local",type: "pages",bindings: {DB: {type: "d1",},},},}),
});

安装 Drizzle 依赖项

运行以下命令:

npm i drizzle-orm
npm i -D better-sqlite3 drizzle-kit cross-env @types/node

创建 drizzle.config.ts

这就是我们的 drizzle.config.ts 文件的样子:

// drizzle.config.ts
import type { Config } from "drizzle-kit";const {
http://www.lryc.cn/news/382798.html

相关文章:

  • SUSE linux 15的网络管理
  • 海康威视-下载的录像视频浏览器播放问题
  • 养殖自动化管理系统:开启智慧养殖新篇章
  • SmartEDA革新来袭:融合Multisim与Proteus精髓,引领电子设计新纪元!
  • 【FFmpeg】AVFormatContext结构体
  • 【SpringSecurity】认证与鉴权框架SpringSecurity——授权
  • 深入解析FTP:原理、架构与搭建方式
  • Springboot与RestTemplate
  • 端口发布与暴露
  • Unity:使用Texture2D动态创建的图像无法正常显示 / 修改图像后未生效
  • 【LinuxC语言】详解TCP/IP
  • 数字化转型下的企业人力资源信息系统研究
  • docker camunda 8.5 部署步骤
  • 学懂C#编程:常用高级技术——委托(Delegate)应用场景——委托与Lambda表达式的结合使用详解
  • 05-java基础——循环习题
  • 网络安全等级保护测评
  • 真有被这套零售数据分析方案惊艳到
  • 亚马逊卖家为何需要自养账号?揭秘背后的原因
  • 牛了,LSTM+Transformer王炸结合创新,荣登Nature,精度高达95.65%
  • Java面试题:通过实例说明工厂模式和抽象工厂模式的用法,以及它们在解耦中的作用
  • 成都欣丰洪泰文化传媒有限公司电商服务的创新者
  • 学习笔记——动态路由——RIP(距离矢量协议)
  • 【python】OpenCV—Segmentation
  • python-题库篇-Python语言特性
  • WEB界面上使用ChatGPT
  • 【Matlab】CNN-LSTM分类 卷积神经网络-长短期记忆神经网络组合模型(附代码)
  • 性能工具之 MySQL OLTP Sysbench BenchMark 测试示例
  • 【QT】QCustomPlot库中iSelectPlottables的使用
  • 字节跳动联手博通:5nm AI芯片诞生了?
  • 【数据结构与算法】动态查找表(二叉排序树,二叉平衡树)详解