使用python开发前端

《使用python开发前端》由会员分享，可在线阅读，更多相关《使用python开发前端（61页珍藏版）》请在装配图网上搜索。

1、Python让前端更轻松基于Python的前端 方案实践潘俊勇 易度云办公前端开发的困惑桌面桌面C/S时代：曾经的美好时代：曾经的美好成熟工具链支撑简单快速开发组件编程，图形化IDEDelphi/C+Builder Visual StudioPowerBuilder：图形化，脚本化数据库应用开发神器效果 更低的成本 对开发人员要求低 不分前后端 更高的开发效率WEB前端前端 B/S时代时代桌面安装复杂，浏览器打开即用，世界进入B/S时代B/S模型：Thin Client服务器浏览器输出Html、Css、js等渲染展示发起http请求用户操作输入输出终端问题：更多语言需要学习 HTML CSS

2、Javascript减少语言 Nodejs：后端也用js来开发 曾经的 KSS：用类似css的语法写JS PythonJS：浏览器上Python开发 翻译为JS 玩具性质问题：事件 变成 http请求 route：url地址和代码的映射 安全性 无状态：cookie/session用约定来简化 Rails Django问题：不成熟的浏览器 Html/js/css都在不断在发展 Javascript自身的缺陷 各种浏览器兼容问题 第三方组件兼容性问题还好有前端框架 Twitter Bootstrap Semantic UI JQuery UI 国内的 淘宝BUI 百度BlendUI WEB前端前

3、端 应用时代应用时代移动端和体验要求，系统要求更开放，进入单页面应用时代单页面应用模型：Fat Client服务器SPA（浏览器）输出json数据渲染展示发起http请求API用户操作单页面应用服务接口SPA：Single Page Application，单页面web应用特点 大量逻辑前移到浏览器 服务端只提供API 对搜索引擎支持不好 前端特别重OpenERP：前端有多重？OpenERP 6.1版，对web端了SPA重构OpenERP 6.0OpenERP 6.1前端MVC框架，蜂拥而至 BackBone AngularJS Knockout ReactJS 前端开发工具链 Coffees

4、cript Less/Sass RequireJS/SeaJS Bower Yeoman Grunt前端的迷失 前端开发变得异常复杂 各种框架轮番上阵 各自存在问题 互不兼容 仍未终结 前端程序员很渺小另外的声音：前端去框架才是趋势去框架：让开发者开发所谓的微框架或者小框架，然后呢让它们之间能够彼此相容，然后你竞争去采用比较好的东西我们怀念桌面时代的美好前端欠发展 前端太难 优秀的web前端很贵.技术一定往简化发展 前端可能是碗青春饭怎么破？怎么破？修修补补，还是根源解决？如何省时、省人、省力，技术上可持续发展？微软的尝试：微软的尝试：ASP.NET修修补补：如何恢复桌面时代的美好组件：ASP

5、.NET Helpers在网页中内嵌帮助器，简化控件的创建WebForm服务器控件：失败内嵌在html中，弱化http协议，转为事件驱动GOOGLE的方案的方案GWT、dartlang、PolymerGWT 用java开发web前端：编译为js RIA：全端 回到桌面时代 Google Adwards,Google Wallet 问题：搜索引擎不友好 位置逐渐被Dart取代Dart:替代JS 语言更干净 自带开发工具 支持polymer组件化开发 一种语言，支持前后端 可编译为高效的js，支持各种浏览器 快速进入语言排行前20Polymer:Web Component实现 W3C web组件技

6、术规范 Custom Element Template Shadow DOM HTML import 实现：Polymer 代表web未来 是终点吗？号外：Pyjamas Python版本的GWT 自带UI陈旧 用户不多易易度前端的演进度前端的演进一个小(DiaoSi)团队如何不被技术浪潮摧毁作为一个小公司 技术主管不大懂javascript 招不起昂贵专业的前端 害怕技术选型错上贼船 历史负担：自制前端框架 技术更新，成本非常高 如何平滑支持移动端作为一个开发平台 解放开发者 专注业务需求 少折腾技术 技术延续性 目标：力求最简 三脚猫功夫，也能开发 快速开发 屏蔽实现细节尝试过backbo

7、ne 当年Zope时代的感觉 泥潭里挣扎 3个月，完成前端框架 革命成本太高 放弃只能演进，而非革命 尽量少的人 最少的技能 快速开发 实用、少折腾LIFE IS SHORTUSE PYTHON易度前端:Fit Client易度Web Player浏览器版易度Mobile Player移动版易度应用Python渲染UI组件接受View指令易度Player：不胖不瘦，刚好事件处理事件处理Web适配移动适配完全用Python写应用分层：前端引擎和应用易度易度Player（前端引擎）：（前端引擎）：20%javascript 基础 整体外观风格 栏目导航 加载进度 出错处理 动态 组件渲染展示 交互

8、事件触发 界面行为控制易度易度应用：应用：80%python 输出UI界面 交互事件处理 控制界面行为前端引擎和应用前端框架UIVIEW各种业务应用(Python)应用层WebPlayer 引擎层招一个NB的前端维护引擎即可前端技术革新，只需升级引擎层使用UI组件ui.panel().add(ui.button(Click me).add(ui.text(Hello,world)+ui.button(新增).icon(add).loading(正在提交.).on(click,zopen.test:test)UI组件示例UI组件库使用Python表单类似Bootstrap的组件系统所有功能组件化

9、View指令集 view.message(出错了,type=error,)view.modal(form,width=600)view.layout.main().set_content(form)view.layout.right().set_content(form)可视化制作表单form=root.packages.get_form_obj(zopen.test:form)ui.form(title,description,action).fields(form).button(submit,提交).on(submit,zopen.test:submit_form)组件选择(DOM)和操

10、作#向Web Component致敬view.closest(tabs).active_panel().set_content(ui.h1(hello,world)view.find(tree#leftnav).expand()用户触发事件处理 ui.link(click me).on(click,zopen.test:test)所有脚本提交到服务端脚本 用Python处理自定义事件：界面联动 触发删除事件：view.trigger(dataitem-removed,uid:12312,title:123123)多处处理事件：ui.script().on(dataitem-removed,zo

11、pen.test:refresh)示例：珠三角沙龙活动页面示例：投票应用Python就是一种DSL Python的表达能力，不比html差 Bootstrap 版本升级，重写html工程浩大 Python写界面，与具体实现隔离回归桌面开发模式 一切皆python 学习更简单 几乎不用懂web 全端开发 更容易code review 组件化开发：为web未来同步 事件驱动：屏蔽网络 部分的图形化开发：可以更多Web Player可定制皮肤引擎分离的额外收获 前端需求变得简单 WebPlayer引擎实现并不复杂 不再需要MVC框架 对前端新技术，不再焦虑 现有前端积累得以延续 未来升级更加平滑开源了吗？未开源 一种思想，很容易实现 目前只实现的web版本 UI html VIEW 转换JS 想过基于QML的QT版本DEMOS谢谢大家 欢迎提问 在线互动