一、商店技术架构

1.主题

  • 购物车设计
  • 结帐订单
  • 第三方整合
  • 代码重构

2.涉及技术点:

  • Model 设计原则
  • 自定 before_action
  • 自定义 Routing
  • validation
  • session 操作
  • find_by 操作
  • where / order
  • 巢状表单
  • State Machine
  • ActiveJob
  • Mailer
  • Partial / Helper

3.核心业务功能

  • 购买机制 - 消费者购买商品,放入购物车
  • 结帐机制 - 消费者将购物车中的商品,结帐生成订单
  • 上架机制 - 商家上架物品,设定开卖
  • 配送机制 - 商家针对订单配送

4.角色

  • 消费者
  • 商家

5.用户故事

身为管理者,我要能够登入后台

  • 整个商店网站分为两种权限:admin (商家) / user (消费者)
  • 商家可以登入 /admin 后台
  • 能够登入后台上架商品
  • 后台上架网址必须要是 /admin/products
  • 商品的内容分为物品标题、描述、价格、库存
  • 商品要能够设定是否能上架贩售
  • 商品必须要有商品图片

二、实现步骤

专案基础设施

Bootstrap

gem 'bootstrap-sass'
mv app/assets/stylesheets/application.css app/assets/stylesheets/application.scss
@import "bootstrap-sprockets";
@import "bootstrap";
//= require bootstrap/alert
//= require bootstrap/dropdown

common/_navbar.html.erb
common/_footer.html.erb
weclome#index
flash提示

app/views/common/_flashes.html.erb
<% if flash.any? %>
<% user_facing_flashes.each do |key, value| %>
<div class="alert alert-dismissable alert-<%= flash_class(key) %>">
<button class="close" data-dismiss="alert">×</button>
<%= value %>
</div>
<% end %>
<% end %> app/helpers/flashes_helper.rb
module FlashesHelper
FLASH_CLASSES = { alert: "danger", notice: "success", warning: "warning"}.freeze def flash_class(key)
FLASH_CLASSES.fetch key.to_sym, key
end def user_facing_flashes
flash.to_hash.slice "alert", "notice","warning"
end
end

Devise

rails g devise:install
rails g devise user
rake db:migrate

SimpleForm rails generate simple_form:install --bootstrap
font-awesome-rails

上传图片模块

gem 'carrierwave'
gem 'mini_magick'
rails g uploader image

购物车

订单

支付&寄信

专案源码

三、第三方服务应用

支付

  • 微信、支付宝支付(需要企业身份进行申请)
  • 有偿代收服务接口:ping++等

存储

  • 阿里云、七牛云、AWS S3

配置ASW S3 保存图片

gem 'fog'

config.fog_provider = 'fog'
config.fog_credentials = {
provider: 'AWS',
aws_access_key_id: ENV["AWS_ACCESS_KEY_ID"], aws_secret_access_key: ENV["AWS_SECRET_ACCESS_KEY"], region: ENV["AWS_REGION"] }
config.fog_directory = ENV["AWS_BUCKET_NAME"]

七牛云

gem 'carrierwave-qiniu'
gem 'qiniu-rs' config/initializers/carrierwave.rb
CarrierWave.configure do |config|
config.storage = :qiniu
config.qiniu_access_key = ENV["qiniu_access_key"]
config.qiniu_secret_key = ENV["qiniu_secret_key"]
config.qiniu_bucket = ENV["qiniu_bucket"]
config.qiniu_bucket_domain = ENV["qiniu_bucket_domain"]
config.qiniu_block_size = 4*1024*1024
config.qiniu_protocol = "http"
config.qiniu_up_host = "http://up.qiniug.com" #选择不同的区域时,"up.qiniug.com" 不同 end

figaro 机密信息管理

gem 'figaro'
bundle install
figaro install
会自动生成 config/application.yml 文件并自动添加到 .gitignore 档案里
cp config/application.yml config/application.yml.example production:
XXXXX_KEY_ID: ""
development:
XXXXX_KEY_ID: ""
#排版缩进 非常重要,否则报错

一键部署机密信息到heroku
figaro heroku:set -e production
heroku config可以列出目前所有的设定

SendCloud服务发送邮件

http://sendcloud.net/

config/environments/production.rb
Rails.application.configure do
...(略)
# config.action_mailer.delivery_method = :letter_opener #dev环境本地预览邮件
config.action_mailer.default_url_options = { :host => '你的herokuapp地址'} config.action_mailer.delivery_method = :smtp
ActionMailer::Base.smtp_settings = {
address: "smtpcloud.sohu.com",
port: 25,
domain: "heroku.com",
authentication: "login",
enable_starttls_auto: true,
user_name: ENV["SEND_CLOUD_USER_NAME"],
password: ENV["SEND_CLOUD_USER_KEY"]
}
end

在线Bug报错 airbrake

https://airbrake.io 三十天免费

gem 'airbrake', '~> 5.4'
bundle install
rails g airbrake PROJECT_ID PROJECT_KEY 配置
config/initializers/airbrake.rb
c.project_id = ENV['PROJECT_ID']
c.project_key = ENV['PROJECT_KEY']
测试
rake airbrake:test

JD-Store购物网站复盘——20170312的更多相关文章

  1. css3购物网站商品文字提示实例

    css3购物网站商品文字提示实例先来看效果图:<ignore_js_op> 当鼠标划过图片时,有着泰迪熊黑色长方形的背景就会出现.来看HTML5+CSS3代码: <!DOCTYPE ...

  2. springMVC+angular+bootstrap+mysql的简易购物网站搭建

    springMVC+angular+bootstrap+mysql的简易购物网站搭建 介绍 前端的css框架用了bootstrap, 以及bootstrap的JS组件, 以及很好用的angular(a ...

  3. 购物网站首页(学习ING)

    这几天在学着做购物网站,初步的完成了首页的框架吧,记录下.慢慢加强.主要难点,是样式的设置问题,如果自己想,自己摸索,可能会需要很长的调试.也是一个孰能生巧的过程吧,有些部分没有按照学习资料的方法也做 ...

  4. PHP操作实现一个多功能购物网站

    PHP操作实现一个多功能购物网站 一.需要实现的页面: Index.aspx:浏览商品页面,显示商品列表,用户可以点击“加入购物车“. ViewCart.aspx:查看购物车页面,显示已购买的商品信息 ...

  5. php实现一个简单的购物网站

    实现一个简单的购物网站 一.考试时间:8小时 二.开发工具:DW 三.数据库:见附件 四.需要实现的页面: Index:浏览商品页面,显示商品列表,用户可以点击“购买“. ViewCart:查看购物车 ...

  6. Redis构建处理海量数据的大型购物网站

    本系列教程内容提要 Java工程师之Redis实战系列教程教程是一个学习教程,是关于Java工程师的Redis知识的实战系列教程,本系列教程均以解决特定问题为目标,使用Redis快速解决在实际生产中的 ...

  7. 基于Spring+Spring MVC+Mybatis的B2C购物网站

    代码地址如下:http://www.demodashi.com/demo/12935.html 准备工作 当前项目运行的系统环境是MacOS,已经测试可以正常运行,并且之前开发的时候也在Windows ...

  8. JQuery仿购物网站放大镜特效所遇问题及思考

    JQuery仿购物网站放大镜特效所遇问题及思考 先贴下效果图,然后描述起来也就不会不知道我在说什么了. 我碰到的问题一: 一开始我自己总结了是因为两个小原因导致的①使用了mouseover,mouse ...

  9. PHP购物网站

    我使用的phpsteam经常用着用着就闪退,所以做起来挺麻烦的.里面的代码有抄袭借鉴网上的代码,就是那个php做购物网站点击量最高的那个. 但是我很多代码也是自己写的不和其相同. PHP是一门选修课, ...

随机推荐

  1. Thymeleaf的内置属性(转)

    原文链接: http://somefuture.iteye.com/blog/2253761 Thymeleaf是另一个Java视图模板引擎,使用上和FreeMarker各有千秋,不了解的可以从其他博 ...

  2. 事件类型-UI事件、焦点事件

    DOM3级事件包括以下几类事件: UI事件:当用户与页面上的元素交互时触发 焦点事件:当元素获得或失去焦点时触发 鼠标事件:当用户通过鼠标在页面上执行操作时触发 滚轮事件:当使用鼠标滚轮时触发 文本事 ...

  3. TortoiseGit+msysgit保存用户名和密码

    本文以windows系统为例 保存用户名和密码 在C盘的c:\Users**qing** (或可能是C:\Users\Administrator) (替换自己的用户名)找到.gitconfig, 如果 ...

  4. 利用kali自带的msfvenom工具生成远程控制软件(木马)

    2.生成一个简单的木马 3. 4. 5. 6.接下来生成的winx64muma.exe实际演示 7.将生成的winx64muma.exe在受害者机器上运行 8.在kali下输入msfconsole 9 ...

  5. Python学习笔记之面向对象

    下面是初步总结的Python的面向对象的参数定义,后面会逐渐完善面向对象的相关知识.

  6. python基本输入输出函数与变量类型

    7.python具有三个重要的输出输入函数:print(输出)/eval(转换)/input(输入): 8.对于输出函数print函数的具体使用规则如下:(1)输出字符串:print("字符 ...

  7. 【剑指Offer面试编程题】题目1384:二维数组中的查找--九度OJ

    题目描述: 在一个二维数组中,每一行都按照从左到右递增的顺序排序,每一列都按照从上到下递增的顺序排序.请完成一个函数,输入这样的一个二维数组和一个整数,判断数组中是否含有该整数. 输入: 输入可能包含 ...

  8. JS之如何将Promise.then的值直接return出来

    不可能直接将Promise.then的值直接return出来,只能return出Promise对象,然后继续.then去操作异步请求得到的值.

  9. 前端Cannot read property 'disabled' of null 问题解决

    就是在项目中,控制台一直在报这个错,一直没找到是什么问题, 后来经过一番排查,发现是 因为在页面中使用了el-dropdown,但是在这个标签里面没有设置它的子元素,所以会报错,解决的方法就是在el- ...

  10. Day1-Luogu-1631

    题目描述 有两个长度都是N的序列A和B,在A和B中各取一个数相加可以得到N^2N2个和,求这N^2N2个和中最小的N个. 输入输出格式 输入格式: 第一行一个正整数N: 第二行N个整数A_iAi​, ...