无需先学 ofa.js,即可直接复用基于它开发的组件。
开源组件作者写完代码后,其他人只需照着示例复制几行,就能瞬间把功能搬进自己的项目。
无论是搭建简单页面、打造交互式应用,还是构建复杂系统,ofa.js 都能游刃有余。
无论是什么应用场景,都适合使用 ofa.js。
无需先学 ofa.js,即可直接复用基于它开发的组件。
开源组件作者写完代码后,其他人只需照着示例复制几行,就能瞬间把功能搬进自己的项目。
只需在现有项目中通过 script 标签引入 ofa.js,即可立即使用。
引入后,各式各样的组件随手可得。
ofa.js 对新人非常友好,不需要学习 Node.js、npm 等工具。
只需要一个浏览器,加上一个任意的静态服务器,就能开始开发。
如果你用Chrome浏览器,打开 OFA Studio 这个在线工具,就不需要准备静态服务器了,直接开始。
教程:创建第一个应用ofa.js 非常适合大型项目,因为它采用微前端的架构模式。
你可以将商城系统拆分成足够细的需求,逐个组件开发,放到独立的文件夹上,通过静态服务器就能直接预览组件效果。
最后逐个组装成一个庞大的系统。ofa.js 的微前端模式,正是解决巨石应用的良药。
可以参考案例 NoneOS,这是使用 ofa.js 开发的操作系统,规模非常庞大
ofa.js 的 SSR 不需要和 Node.js 绑定,只要你遵守 SCSR 规则,就能使用任意后端语言进行模板引擎开发。
详细参考 ofa.js SSR
不走编译的流程,直接让代码跑起来。
你可以在任何支持 Web Components 的平台上使用 ofa.js
使用基于 ofa.js 开发的组件,不需要考虑依赖和配置问题
不加班了
下班给我
迟点下班
周末加班
过去,你要先经历 Node.js ➡️ npm ➡️ Webpack 等一系列学习,才能迈入封装组件的第一步
现在,你只需要一个文件
既支持模板语法,又能直接操作节点,灵活高效两不误
API 设计与 jQuery 相似,但更加直观
// jQuery Code
$("#target").html("some html code"); // 设置 html
$("#target").text("set text"); // 设置 text
var ele_text = $("#target").text(); // 获取 text
var parents = $("#target").parents(); // 获取所有父层的数组
var child = $("#target").children()[0]; // 获取第一个子元素
// ofa.js Code
$("#target").html = "some html code"; // 设置 html
$("#target").text = "set text"; // 设置 text
var ele_text = $("#target").text; // 获取 text
var parents = $("#target").parents; // 获取所有父层的数组
var child = $("#target")[0]; // 获取第一个子元素