本项目将使用Sanic + Vue2 + Webpack2 配合最简单CRUD的逻辑来诠释基于Python的全新一代高性能全栈开发实践的Demo。
这份小礼物,将献给所有刚走出校园、献给和我一样即将步入不惑之年、献给所有热爱开源的伙伴们,也纪念我入行6周年,Our Freedom~!
对于为何不是Flask、Tornado、Django等著名框架,或许可能很多人会产生疑惑,Sanic本身和Flask非常的相似,而它的出现,不仅是大大改进过去WSGI时代性能低下通病,外加配合uvloop作为核心引擎,使Sanic在很多情况下单机并发甚至不亚于Golang,而且它更意味着Python在Web领域走进了全新的未来。
那么uvloop又是什么?简单的说,Python3.4之后作为最高效简单的协程并发库莫过于asyncio,而asyncio的出现仅仅只是为了提供更方便的异步编程及互操作的接口,其底层用的还是比较传统的event loop,而uvloop是在重新定制asyncio基础上引入了libuv, 其性能不仅超过了以往如gevent、tornado等Python异步框架,也同样以超过2倍多的性能领先于node.js。
那么在我继续之前,我也想和大家回顾一下Web开发的发展简史:
第一阶段: 网页三剑客,生猛的通过原生javascript直接操作Dom树;
第二阶段: JQuery诞生,配合前端MVC为代表的Backbone.js, 让我们可以优雅而简单的操作Dom树;
第三阶段: 后端架构升级为MVC,前后端分工更清晰,前端工程化、ECMAScript规范开始崭露头角;
第四阶段: 后端架构进入了微服务时代,前端架构不仅升级为MVVM,ES6更是成为目前事实上的标准;
在这里,我不想过于神化MVVM有多么的先进,JQuery为代表的MVC有多么的落后,但确实MVVM有着很多先进的特性:
低开销
易维护
可重用
Vue.js是MVVM设计模式中目前最火热的一个前端框架之一,除了性能表现优异之外,与类似React相比,更轻量级、更容易上手。
通过Vue中的“单文件组件”特性,更灵活的定义组件,不仅使代码结构更清晰,而且能与任何其他组件进行随意组合,更具复用性。
Webpack提供了一整套前端工程自动化的解决方案
有了高性能的Sanic作为基石,或许还不够,最能成为后端性能瓶颈的更多的是在于数据库,因此挑选一个合适的ORM变的极为重要,目前python比较主流的ORM是Django-ORM、SQLAlchemy等,但为了配合Sanic这种性能卓越的框架,我更倾向于peewee,更轻量级、方便二次封装,更友好的支持异步。
一个简单的上海人员信息查询系统作为例子
| |—— tests // 单元测试 | |—— sanic_crudvue // 主项目 | | | |—— config // 后端基本配置 | | | |—— crud // 后端APP | | | |—— frontend | | |__ build // webpack配置文件 | | |__ dist // 编译后的目标目录 | | |__ src // 前端源代码 | | | | | | | |__ components // 本项目各种各样的核心组件 | | | | | | | |__ App.vue // 主页 | | | | | | | |__ eventBus.js // 中央消息处理器,用于‘非父子组件’通信,下一个版本将会使用vuex | | | | | | | |__ main.js // webpack入口
python 3
sqlite (not recommend, only convenience example)
vueJS 2.x
webpack 2.x
element ui
axios
请必须安装 Python 3.5, 3.6 或以后更高的版本
安装 nodejs / npm
克隆仓库
git clone https://github.com/boylegu/SanicCRUD-vue.git cd SanicCRUD-vue
构建后端环境
cd SanicCRUD-vue make install
构建前端环境
cd sanic_crudvue/frontend npm install
运行后端服务
make dev
运行前端服务
cd sanic_crudvue/frontend npm run dev
运行单元测试
cd SanicCRUD-vue make test
你也可以在生产环境中运行
cd sanic_crudvue/frontend;npm run build
进行编译并配合Nginx
本项目可以作为工作参考、学习或者教学演示,之后将陆续以版本的形式,即每个版本都会新增不同的功能演示项,不定期进行发布更新,有以下功能已经在计划之中:
用户认证
引入更高级的vuex组件通信机制
演示vue-route的使用
加入docker部署环境
新增针对yarn的支持 ... ...
▄▄▄▄▄ ▀▀▀██████▄▄▄ _______________ ▄▄▄▄▄ █████████▄ / \ ▀▀▀▀█████▌ ▀▐▄ ▀▐█ | Gotta go fast! | ▀▀█████▄▄ ▀██████▄██ | _________________/ ▀▄▄▄▄▄ ▀▀█▄▀█════█▀ |/ ▀▀▀▄ ▀▀███ ▀ ▄▄ ▄███▀▀██▄████████▄ ▄▀▀▀▀▀▀█▌ ______________________________ ██▀▄▄▄██▀▄███▀ ▀▀████ ▄██ █ \\ ▄▀▀▀▄██▄▀▀▌████▒▒▒▒▒▒███ ▌▄▄▀▀▀▀█_____________________________ // ▌ ▐▀████▐███▒▒▒▒▒▐██▌ ▀▄▄▄▄▀ ▀▀████▒▒▒▒▄██▀ ▀▀█████████▀ ▄▄██▀██████▀█ ▄██▀ ▀▀▀ █ ▄█ ▐▌ ▄▄▄▄█▌ ▀█▄▄▄▄▀▀▄ ▌ ▐ ▀▀▄▄▄▀ ▀▀▄▄▀ ██ \ ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀ \- ▌ SanicCRUD-vue ▀ ▀ - ▌ (o) ▀ /- ▌ Go Go Go ! ▀ ▀ / ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ▀ ██
来源:http://www.techug.com/full-stack-python 前段时间,ThoughtWorks 在深圳举办一次社区活动上,有一个演讲主题叫做“Fullstack JavaScript”,是关于用 JavaScript 进行前端、服务器端,甚至数据库(MongoDB)开发,一个 Web 应用开发人员,只需要学会一门语言,就可以实现整个应用。 受此启发,我发现 Python
本文向大家介绍基于NodeJS的前后端分离的思考与实践(一)全栈式开发,包括了基于NodeJS的前后端分离的思考与实践(一)全栈式开发的使用技巧和注意事项,需要的朋友参考一下 前言 为了解决传统Web开发模式带来的各种问题,我们进行了许多尝试,但由于前/后端的物理鸿沟,尝试的方案都大同小异。痛定思痛,今天我们重新思考了“前后端”的定义,引入前端同学都熟悉的NodeJS,试图探索一条全新的前后端分离
前端开发的技术栈 对于任何类型的前端开发人员, HTML, CSS, DOM, JavaScript, HTTP/URL 和浏览器利用是基本的技术要求. 对于HTML, CSS, DOM, JavaScript, HTTP/URL 和浏览器开发之外的, 一个前端开发者还应该掌握下面技术列表中的一个或多个: Content Management System (内容管理系统, 又称 CMS) Nod
根据现有资源整理的一个Python学习路径,包含入门知识、Python基础、Web框架、基础项目、网络编程、数据与计算、网络爬虫等。
5.1. Node.js相关工具 grunt/gulp/fis/webpack bower/spm/npm tdd/bdd cucumber/mocha standard babel/typescript/coffee 5.2. 前端开发4阶段 html/css/js(基础) jQuery、jQuery-ui,Extjs(曾经流行) Backbone(mvc),Angularjs、Vuejs(当前
准备工作和工具 在开始写代码之前你需要保证你有一些Python基础,如果没有的话,请参阅其他相关书籍来一起学习。 并且你还需要在你的计算机上安装: Python环境及其包管理工具pip。 Firefox浏览器——用于运行功能测试。 Git版本控制器——用于代码版本控制。 一个开发工具。(PS: 在这里笔者使用的是PyCharm的社区版)