SuperAPI AI 工具集

shopify-remix-template

编程与开发

查看项目

更新于 10-16 05:42

技能介绍

用途:本技能为使用 Shopify 官方 Remix App Template 开发 Shopify 内嵌应用提供指南,该模板是多数新 Shopify 内嵌应用的推荐起点。

项目结构:app/routes 为基于文件系统路由,含 app._index.tsx 主看板、app.tsx 已认证应用根布局、webhooks.tsx Webhook 处理;shopify.server.ts 初始化 API 客户端、认证与会话存储(Redis);db.server.ts 为数据库连接(Mongoose);models 存放 Mongoose 模型;shopify.app.toml 为主配置文件。

认证与会话:通过 @shopify/shopify-app-remix 自动处理认证,shopify.server.ts 导出 authenticate 对象,在 loader 与 action 中使用,可获取 admin 与 session;模板配置使用 Redis 存储会话。API 调用通过 authenticate.admin(request) 返回的 admin 对象执行 GraphQL 请求。

Webhook:在 shopify.server.ts 中配置,在 app/routes/webhooks.tsx 的 action 中处理对应主题。

数据库:使用 Mongoose 持久化存储,在 loader 中先调用 connectDb 连接 MongoDB 再使用模型。

界面:预配置 Polaris 设计系统与 App Bridge,页面使用 Page 等组件。

常用操作:添加导航项需更新 app/routes/app.tsx 中的 ui-nav-menu。

部署:可托管于 Vercel、Fly.io、Heroku 或 Cloudflare,生产环境需持久化数据库,并设置 SHOPIFY_API_KEY、SHOPIFY_API_SECRET、SCOPES、SHOPIFY_APP_URL 等环境变量。资料未提供收费、价格与具体效果信息。