Vue-book----一个简单的全栈项目

tanglijun 发布于2019-06-27 16:26 / 2443人阅读

摘要：地址觉得不错就给个吧说明前端后端本项目实现了一些简单的功能，后台可以对图书进行录入录出扫码或手动，前台显示录入的图书。

Vue-book

</>复制代码 
A simple full stack project about book~

GitHub 地址（觉得不错就给个 star 吧 ^_^）

说明

前端: Vue.js + Vuex + Webpack2

后端: php + MySQL

本项目实现了一些简单的功能，后台可以对图书进行录入录出（扫码或手动），前台显示录入的图书。具体请看下面的实现逻辑图。

我在自己的服务器上把这个项目搭建好了，但是，目前不便给出登录后台的链接，只给出前台的链接，本项目只针对移动端，所以最好在手机上查看链接 ^_^

前台链接

Build Setup

</>复制代码 
# install dependencies
npm install
# serve with hot reload at localhost:8080
npm run dev
# build for production with minification
npm run build

</>复制代码 
我在本地测试用的服务器是 WAMP Server。

为了方便大家阅读源码，我列出了前后端数据交互时比较重要一些的接口，方便大家进行参考！（点我查看）

项目目录说明

</>复制代码 
Vue-book directory
├── backend                     # 存放后台或后端文件
|  ├── css                          # 存放后台样式文件
|     ├── login.css                     # 登录后台页面的样式
|     ├── manage.css                    # 后台操作页面的一部分样式
|     ├── manual.css                    # 后台手动操作的样式
|     └── scan.css                      # 后台扫码操作的样式
|  ├── database_details.sql         # 生成指定数据库和表
|  ├── getdata.php                  # 前端获取数据时的后端脚本           
|  ├── js                           # 存放后台脚本文件
|     ├── manage.js                     # 进入管理界面的效果脚本
|     ├── manual.js                     # 后台手动操作的脚本
|     └── scan.js                       # 后台扫码操作的脚本
|  ├── login.html                   # 后台登录页面
|  ├── manage.php                   # 登录后台成功后返回的管理页面
|  └── operate.php                  # 定义后台操作与数据库交互的逻辑
├── src                         # 存放前端源码
|  ├── app.vue                      # 根组件
|  ├── common                       # 存放通用脚本或样式
|     └── getdata.js                    # 向后端获取数据的前端脚本
|  ├── components                   # 存放各种组件
|     ├── book-card.vue                 # 书籍详细信息
|     ├── book-item.vue                 # 书籍简要信息
|     ├── container.vue                 # 大包含块
|     ├── content.vue                   # 内容块
|     ├── header.vue                    # 页面头
|     ├── loading.vue                   # 加载中
|     ├── menu.vue                      # 左侧菜单栏
|     └── overlay.vue                   # 覆盖层
|  ├── fonts                        # 存放字体相关文件
|     ├── font.css                      # CSS 引入字体
|     ├── icomoon.eot
|     ├── icomoon.svg
|     ├── icomoon.ttf
|     ├── icomoon.woff
|     └── title.ttf
![图片上传中...]
|  ├── main.js                      # 程序入口文件
|  ├── router                       # 路由
|     └── routes.js                     # 定义路由文件
|  └── vuex                         # Vuex 状态管理
|     └── store.js                      # 状态脚本
├── index.html                      
├── package.json                    # 配置项目相关信息
├── webpack.config.js               # Webpack 配置相关信息
├── README.md

待解决问题

切换内容页面时，默认滚动到内容最顶部（content.vue）

移动端，向下滑动显示全屏，向上滑动退出全屏

安全问题，防止 SQL 注入（operate.php）

CSS、js 文件合并压缩（后台页面 manage.php）

Licence

MIT Licence

GPU云服务器云服务器简单的asp项目简单编写一个html 您编一个简单点的 java第一个小项目

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/22919.html

Vue-book----一个简单的全栈项目

摘要：地址觉得不错就给个吧说明前端后端本项目实现了一些简单的功能，后台可以对图书进行录入录出扫码或手动，前台显示录入的图书。 Vue-book A simple full stack project about book~ GitHub 地址（觉得不错就给个 star 吧 ^_^）说明前端: Vue.js + Vuex + Webpack2 后端: php + MySQL 本项目实现...

宠来也 2019-08-20 16:22 评论0 收藏0
Vue-book 2.0 一个移动端简单的全栈 web APP

摘要：本项目是一个简单的全栈项目，前端新手可以拿来练练手。项目实现了一些简单的功能，后台可以对图书进行录入录出扫码或手动，前台显示录入的图书，并且前台注册登录后可以将书的订单发给服务器，并存到服务器。 Vue-book 2.0 Github 地址：https://github.com/percy507/v... 【觉得不错就来个 star 吧 ^_^】说明（菜鸟请进，大神绕道 ~）前端...

wh469012917 2019-06-27 16:37 评论0 收藏0
Vue-book 2.0 一个移动端简单的全栈 web APP

摘要：本项目是一个简单的全栈项目，前端新手可以拿来练练手。项目实现了一些简单的功能，后台可以对图书进行录入录出扫码或手动，前台显示录入的图书，并且前台注册登录后可以将书的订单发给服务器，并存到服务器。 Vue-book 2.0 Github 地址：https://github.com/percy507/v... 【觉得不错就来个 star 吧 ^_^】说明（菜鸟请进，大神绕道 ~）前端...

NotFound 2019-08-20 16:53 评论0 收藏0
Node中间层实践（一）——基于NodeJS的全栈式开发

摘要：总结我觉得，以后基于的全栈式开发的模式将会越来越流行，这也会引领前端步入工程化时代。欢迎继续关注本博的更新中间层实践一基于的全栈式开发中间层实践二搭建项目框架中间层实践三配置中间层实践四模板引擎中间层实践五中间层的逻辑处理版权声明：更多文章请访问我的个人站Keyon Y，转载请注明出处。前言近期公司有个新项目，由于后端人手不足，我果断的提议用node中间层的方案，得到了老大的支持...

warkiz 2019-08-22 13:59 评论0 收藏0