Vue Sample Shop(Vue 样品店)

演示如何使用 Vue、Stripe 和无服务器 Functions 管理支付的示例商店。(A sample shop that shows how to manage payments with Vue, Stripe, and Serverless Functions.)

Github星跟踪图

Vue Sample Shop(Vue 样品店)

这个小演示展示了如何使用 Vue.js 的 Azure Functions (一个事件驱动型无服务器计算平台,还可以解决复杂的业务流程问题)接受 stripe 支付。其实设置起来并没有那么糟糕! 该商店还展示了许多概念在 Vue 中的运作方式。 使用 Nuxt.js 完成服务器端渲染和路由。 使用 Vuex 集中管理产品详细信息。 值得注意的是,使用计算属性,.sync,CSS Grid 和 transition-group。

https://shoppity.azurewebsites.net/ 进行现场演示

有关解释演示的文章将很快在 https://css-tricks.com/ 上提供

无服务器功能也是开源的,可在此 repo https://github.com/sdras/sample-stripe-handler 上找到。

构建设置

# 安装依赖
$ npm install # 或者 yarn

# 带有热加载的服务运行在 localhost:3000
$ npm run dev

# 生成静态项目,准备在 app 服务上启动
$ npm run generate

主要指标

概览
名称与所有者sdras/sample-vue-shop
主编程语言Vue
编程语言JavaScript (语言数: 4)
平台Linux, Mac, Microsoft Azure, Windows
许可证MIT License
所有者活动
创建于2017-11-24 03:37:11
推送于2022-12-07 17:20:07
最后一次提交2019-08-28 09:17:23
发布数0
用户参与
星数1.2k
关注者数47
派生数246
提交数68
已启用问题?
问题数8
打开的问题数5
拉请求数9
打开的拉请求数18
关闭的拉请求数12
项目设置
已启用Wiki?
已存档?
是复刻?
已锁定?
是镜像?
是私有?

Note: This repo is no longer being maintained in favor of a newer, improved version: https://github.com/sdras/ecommerce-netlify

Vue Sample Shop

This small demo shows how to accept payments with stripe with Vue.js using a
serverless function. It's actually not that bad to set up! The shop also shows
how a number of concepts work in Vue. Server side rendering and routing is done
with Nuxt.js. Centralized state management with Vuex for product details. Of
note, using computed properties, .sync, CSS Grid, and transition-group.

Live demo at
https://shoppity.azurewebsites.net/

Articles explaining the demo will be available soon at
https://css-tricks.com/

The serverless function is open source as well, available at this repo
https://github.com/sdras/sample-stripe-handler

Vue stripe sample shop

Build Setup

# install dependencies
$ npm install # Or yarn

# serve with hot reload at localhost:3000
$ npm run dev

# generate static project, get ready for launch on app services
$ npm run generate