易度前端演进.pptVIP

DEMOS * 存在问题:Player不能自定义 历史原因，Player没有用bootstrap ui组件输出的是js/html 改为bootstrap或其他框架 如何扩展？ view组件输出的是javascrpt 如何扩展 * 解决方法 翻译器 Python代码 json数据 view/ui Player 服务端 直接输出json来扩展： ui.raw({ui:}) json的描述可参考：ExtJS 谢谢大家 招聘广告 Python开发工程师实习生、熟手皆可考虑 发送简历到：panjunyong@ Python一样能够表达好UI结构 GWT 用java开发web前端：编译为js RIA：全端 回到桌面时代 Google Adwards, Google Wallet 问题： 搜索引擎不友好 位置逐渐被Dart取代 Dart: 替代JS 语言更干净 自带开发工具 支持polymer组件化开发 一种语言，支持前后端 可编译为高效的js，支持各种浏览器 快速进入语言排行前20 Polymer: Web Component实现 W3C web组件技术规范 Custom Element Template Shadow DOM HTML import 实现：Polymer 代表web未来 是终点吗？ 号外：Pyjamas Python版本的GWT 自带UI陈旧 用户不多 易度前端的演进 一个小(DiaoSi)团队如何不被技术浪潮摧毁 作为一个小公司 技术主管不大懂javascript 招不起昂贵专业的前端 害怕技术选型错上贼船 历史负担：自制前端框架 技术更新，成本非常高 如何平滑支持移动端 作为一个开发平台 解放开发者 专注业务需求 少折腾技术 技术延续性 目标： 力求最简 三脚猫功夫，也能开发 快速开发 屏蔽实现细节 尝试过backbone 当年Zope时代的感觉 泥潭里挣扎 3个月，完成前端框架 革命成本太高 放弃 只能演进，而非革命 尽量少的人 最少的技能 快速开发 实用、少折腾 LIFE IS SHORTUSE PYTHON 易度前端: Fit Client 易度Web Player 浏览器版 易度Mobile Player 移动版 易度应用 Python 渲染UI组件 接受View指令 易度Player：不胖不瘦，刚好 事件处理 事件处理 Web 适配 移动 适配 完全用Python写应用 分层：前端引擎和应用 易度Player（前端引擎）：20% javascript 基础 整体外观风格 栏目导航 加载进度 出错处理 动态 组件渲染展示 交互事件触发 界面行为控制 易度应用：80% python 输出UI界面 交互事件处理 控制界面行为 前端引擎和应用 前端框架 UI VIEW 各种 业务应用(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的组件 系统所有功能组件化 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)和操作 # 向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.