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