随笔分类 -  Web Components

1 2 3 下一页

htmx 强大的html 工具
摘要：htmx 是一个很不错的html 标签库，实现了可以写比较少的js 就可以解决大部分依赖js 处理的事件绑定以及ajax 调用。。。这种标签库提供的能力比较和现在大家都在尝试的微前端的一些玩法比较类似，是一个值得尝试的工具包 参考资料 https://github.com/bigskysoftwar 阅读全文

posted @ 2022-10-19 09:41 荣锋亮 阅读(711) 评论(0) 推荐(0) 编辑

zalando 最新关于微前端的一些实践文章
摘要：主要是一个链接，内容很不错，很值得学习下 整体参考架构 page 渲染处理 参考资料 https://engineering.zalando.com/posts/2021/03/micro-frontends-part1.htmlhttps://engineering.zalando.com/pos 阅读全文

posted @ 2021-10-17 21:17 荣锋亮 阅读(86) 评论(0) 推荐(0) 编辑

opencomponents web 集成
摘要：前边有简单运行了私服以下是web 集成说明 私服环境准备 参考https://www.cnblogs.com/rongfengliang/p/15417982.html demo 组件 参考https://opencomponents.github.io/ 创建简单的 web 集成 index.ht 阅读全文

posted @ 2021-10-17 20:33 荣锋亮 阅读(87) 评论(0) 推荐(0) 编辑

opencomponents 私服minio 模式运行
摘要：opencomponents 官方是提供了一个简单的私服核心的，我们可以自己构建部署（基于minio） 运行 环境准备 (minio s3) version: "3" services: s3: image: minio/minio environment: - "MINIO_ACCESS_KEY= 阅读全文

posted @ 2021-10-17 20:18 荣锋亮 阅读(162) 评论(0) 推荐(0) 编辑

opencomponents 快速部署前端组件的工具
摘要：opencomponents可以加速web 组件的部署以及使用（特别适合微前端），设计理念很多参考了微服务的模式 支持的模式也挺丰富（客户端渲染以及服务器端渲染），组件存储上使用了云存储（实际上也可以支持minio） 参考架构 参考使用 安装工具 npm install -g oc oc init 阅读全文

posted @ 2021-10-17 08:43 荣锋亮 阅读(277) 评论(0) 推荐(0) 编辑

一些ui 设计语言
摘要：记录一些开源的不错的ui 设计语言 ant-design 很不错，使用的企业很多，包含了通用的以及移动端的 clarity vmware 开源的，harbor以及vmware的好多产品的ui开发都是基于此的 Semantic-UI 很不错的 bootstrap 比较老牌的 bulma 更多是一个cs 阅读全文

posted @ 2020-11-04 09:11 荣锋亮 阅读(570) 评论(0) 推荐(0) 编辑

几个不错的web资源inlines npm包
摘要：资源inlines很多是否可以方便数据的分发以及管理，以下是几个不错的选择 juice 一个方便的css inlines 方案，很不错，支持的配置参数也比较多 参考https://github.com/Automattic/juice web-resource-inliner 相比上边的就更强大了， 阅读全文

posted @ 2020-06-11 13:14 荣锋亮 阅读(260) 评论(0) 推荐(0) 编辑

stimulusjs 由Ruby on Rails 作者创建的web框架
摘要：stimulusjs 由Ruby on Rails 作者创建的web框架，stimulusjs 不像其他框架包含了完整的web开发方面，stimulusjs 主要主要是作为html element与javascript 对象的自动链接，同时官方文档也是比较全的，提供的starter包含了webpac 阅读全文

posted @ 2020-05-06 21:40 荣锋亮 阅读(400) 评论(0) 推荐(0) 编辑

cjss 像编写css 一样开发web应用
摘要：cjss 提供了使用类似css 的方式编写web 应用 cjss 包含的阶段 data prepare body element 几点说明 并不是所以阶段必须使用，但是每个级别只能存在一个script json 支持存在data 阶段 html 只能用在body 阶段,可以通过字符插值处理模板数据绑 阅读全文

posted @ 2019-07-02 08:41 荣锋亮 阅读(380) 评论(0) 推荐(0) 编辑

Lightning Web Components 组件生命周期（六）
摘要：组件创建以及渲染流程 组件移除dom 处理流程 组件从dom 移除 组件中的disconnectedCallback() 方法被调用 子组件从dom 移除 每个子组件的disconnectedCallback() 说明 详细关于回调方法的流程，可以参考官方文档 参考资料 https://lwc.de 阅读全文

posted @ 2019-06-04 09:19 荣锋亮 阅读(642) 评论(0) 推荐(0) 编辑

Lightning Web Components 组合（五）
摘要：使用组合我们可以用来设计复杂的组件。 组合一些比较小的组件，可以增加组件的重新性以及可维护性。 通过以下一个简单的demo，将会展示关于owner 以及container 的概念，在实际的项目中 example-todo-item 一般是通过for:each 循环动态填充的 <!-- todoApp 阅读全文

posted @ 2019-06-04 09:04 荣锋亮 阅读(502) 评论(0) 推荐(0) 编辑

Lightning Web Components 组件样式（四）
摘要：要将样式与组件进行绑定，需要创建一个同名的样式文件，这样样式将会自动应用到组件 在组件中定义的样式的作用域是属于组件的，这样允许组件可以在不同的上下文中可以复用， 可以阻止其他组件的样式的复写 css 作用域例子 重要说明 一个组件的文件夹和文件名是骆驼的情况下，myComponent，myComp 阅读全文

posted @ 2019-06-03 12:47 荣锋亮 阅读(956) 评论(0) 推荐(0) 编辑

Lightning Web Components html_templates（三）
摘要：Lightning Web Components 强大之处在于模版系统，使用了虚拟dom 进行智能高效的组件渲染。 使用简单语法以声明方式将组件的模板绑定到组件的JavaScript类中的数据 数据绑定 我们可以使用{property} 绑定组件模版属性到一个组件js 类中的属性 一个简单的例子 组 阅读全文

posted @ 2019-06-03 10:04 荣锋亮 阅读(664) 评论(0) 推荐(0) 编辑

Lightning Web Components 开发指南（二）
摘要：Lightning Web Components 是自定义元素使用html 以及现代javascript进行构建。 Lightning Web Components UI 框架使用web components 标准，并且提供仅在。 浏览器中良好运行的内容，编写的大多数代码都是标准的js 以及html 阅读全文

posted @ 2019-06-03 09:18 荣锋亮 阅读(573) 评论(0) 推荐(0) 编辑

Lightning Web Components 安装试用（一）
摘要：Lightning Web Components 简称（lwc） 是一个快速企业级的web 组件化解决方案，同时官方文档很全，我们可以完整的 学习lwc 项目结构 使用npx 官方提供了一个create app 的脚手架 lwc-create-app 项目初始化 npx lwc-create-app 阅读全文

posted @ 2019-06-03 09:01 荣锋亮 阅读(782) 评论(0) 推荐(0) 编辑

Lightning Web Components 来自salesforce 的web 组件化解决方案
摘要：Lightning Web Components 是一个轻量，快速，企业级别的web 组件化解决方案，官方网站也提供了很全的文档 对于我们学习使用还是很方便的，同时我们也可以方便的学习了解salesforce 在web 组件化中的实践 参考资料 https://lwc.dev/guide/intro 阅读全文

posted @ 2019-06-03 08:36 荣锋亮 阅读(409) 评论(0) 推荐(0) 编辑

svelte 构建快速web 应用的工具
摘要：svelte 和angular vue reat 类似，都是方便快速的创建用户界面，最大不同的地方是svelte 转换你的app 是在构建时，而不是运行时，所以好处就是不用花费太多的操作在，框架的 抽象上 以下为一个简单的例子，代码来自官方文档： 注意使用了svelte 的template 安装de 阅读全文

posted @ 2019-02-22 14:18 荣锋亮 阅读(940) 评论(0) 推荐(0) 编辑

CSS Overrides: Friend or Foe?
摘要：转自：http://www.callumhart.com/blog/css-overrides-friend-or-foe Anyone familiar with CSS will know how fragile it can be. Changes to CSS must be made ca 阅读全文

posted @ 2019-02-13 09:41 荣锋亮 阅读(290) 评论(0) 推荐(0) 编辑

immutable-styles 新的css style 开发模式
摘要：immutable-styles 是一个开源的library，可以方便我们开发强壮以及可预测的web 界面，不用担心其他css 的影响 特性 编译时错误提示 防止css 覆盖 分离破坏点 严格继承 重复属性捕获 不可变混入 使用jsx 编写 参考资料 https://github.com/callu 阅读全文

posted @ 2019-02-12 10:12 荣锋亮 阅读(325) 评论(0) 推荐(0) 编辑

stenciljs 学习十三 @stencil/router 组件使用说明
摘要：@stencil/router 组件包含的子组件 stencil-router stencil-route-switch stencil-route stencil-route-link stencil-route-redirect stencil-route-title stencil-route 阅读全文

posted @ 2018-09-27 15:23 荣锋亮 阅读(605) 评论(0) 推荐(0) 编辑

1 2 3 下一页

导航

< 2025年3月 >
日 一 二 三 四 五 六
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5
点击右上角即可分享
微信分享提示