- 博客(13)
- 收藏
- 关注
RSS订阅原创 从零开始写一个微前端框架-数据通信篇
前言自从微前端框架micro-app开源后，很多小伙伴都非常感兴趣，问我是如何实现的，但这并不是几句话可以说明白的。为了讲清楚其中的原理，我会从零开始实现一个简易的微前端框架，它的核心功能包括：渲染、JS沙箱、样式隔离、数据通信。由于内容太多，会根据功能分成四篇文章进行讲解，这是系列文章的最终篇：数据通信篇。通过这些文章，你可以了解微前端框架的具体原理和实现方式，这在你以后使用微前端或者自己写一套微前端框架时会有很大的帮助。如果这篇文章对你有帮助，欢迎点赞留言。相关推荐micro-app仓库地址
2021-08-06 15:10:29
446
1
原创 从零开始写一个微前端框架-样式隔离篇
前言自从微前端框架micro-app开源后，很多小伙伴都非常感兴趣，问我是如何实现的，但这并不是几句话可以说明白的。为了讲清楚其中的原理，我会从零开始实现一个简易的微前端框架，它的核心功能包括：渲染、JS沙箱、样式隔离、数据通信。由于内容太多，会根据功能分成四篇文章进行讲解，这是系列文章的第三篇：样式隔离篇。通过这些文章，你可以了解微前端框架的具体原理和实现方式，这在你以后使用微前端或者自己写一套微前端框架时会有很大的帮助。如果这篇文章对你有帮助，欢迎点赞留言。相关推荐micro-app仓库地址
2021-08-05 17:38:13
1600
2
原创 从零开始写一个微前端框架-沙箱篇
前言自从微前端框架micro-app开源后，很多小伙伴都非常感兴趣，问我是如何实现的，但这并不是几句话可以说明白的。为了讲清楚其中的原理，我会从零开始实现一个简易的微前端框架，它的核心功能包括：渲染、JS沙箱、样式隔离、数据通信。由于内容太多，会根据功能分成四篇文章进行讲解，这是系列文章的第二篇：沙箱篇。通过这些文章，你可以了解微前端框架的具体原理和实现方式，这在你以后使用微前端或者自己写一套微前端框架时会有很大的帮助。如果这篇文章对你有帮助，欢迎点赞留言。相关推荐micro-app仓库地址si
2021-08-04 16:36:45
488
原创 从零开始写一个微前端框架-渲染篇
前言自从微前端框架micro-app开源后，很多小伙伴都非常感兴趣，问我是如何实现的，但这并不是几句话可以说明白的。为了讲清楚其中的原理，我会从零开始实现一个简易的微前端框架，它的核心功能包括：渲染、JS沙箱、样式隔离、数据通信。由于内容太多，会根据功能分成四篇文章进行讲解，这是系列文章的第一篇：渲染篇。通过这些文章，你可以了解微前端框架的具体原理和实现方式，这在你以后使用微前端或者自己写一套微前端框架时会有很大的帮助。如果这篇文章对你有帮助，欢迎点赞留言。相关推荐micro-app源码地址：htt
2021-08-03 11:36:28
666
原创 一行代码实现微前端
看到标题，大家首先想到的应该是iframe，诚然iframe的确可以做到，但是我们今天要讲的并不是它，而是新推出的一款微前端框架micro-app。至于为什么不用iframe，可以参考Why Not Iframe。micro-app是什么micro-app是一款基于类WebComponent进行渲染的微前端框架，它从组件化的思维实现微前端，旨在降低上手难度、提升工作效率。它是目前市面上接入微前端成本最低的框架，并且提供了JS沙箱、样式隔离、元素隔离、预加载、资源地址补全、插件系统、数据通信等一系列完善的
2021-08-01 19:28:09
209
原创 极简微前端框架-京东MicroApp开源了
前言MicroApp是一款基于类WebComponent进行渲染的微前端框架，不同于目前流行的开源框架，它从组件化的思维实现微前端，旨在降低上手难度、提升工作效率。它是目前市面上接入微前端成本最低的框架，并且提供了JS沙箱、样式隔离、元素隔离、预加载、资源地址补全、插件系统、数据通信等一系列完善的功能。MicroApp与技术栈无关，也不和业务绑定，可以用于任何前端框架和业务。本篇文章中我们会从业务背景、实现思路介绍MicroApp，也会详细介绍它的使用方式和技术原理。背景随着这些年互联网的飞速发展，
2021-07-28 15:37:24
3335
2
原创 Web 字体 font-family 浅谈
前言最近研究各大网站的font-family字体设置，发现每个网站的默认值都不相同，甚至一些大网站也犯了很明显的错误，说明字体还是有很大学问的，值的我们好好研究。不同的操作系统、不同浏览器下内嵌的默认字体是不同的，错误的字体设置会导致页面在不同环境渲染的混乱，选择一套合适的字体是打造优秀网页的第一步。通过本文，我们会介绍字体的知识点，并探索在PC和Mobile两端该如何正确的设置字体。字体基础知识字体的分类serif(衬线)sans-serif(无衬线)monospace(等宽)
2020-11-26 14:19:11
2992
2
原创 后台:nodejs 前台:vue 全栈开发 完整功能的外卖平台系统
关于一直考虑写一个功能齐全的完整Nodejs项目，但苦于没有找到合适的类型，而且后台系统无法直观的感受到，需要有一个前台项目配合，因此迟迟没有动笔。恰好前一段时间开源了一个vue前端项目，便以此为契机构筑了后台系统。因为前端项目是根据饿了么官网接口写的，所以后台系统也保持了和官网一致的API接口。整个项目分为两部分：前台项目接口、后台管理接口，共60多个。涉及登陆、注册、添加商品、商品展示、筛选排序
2017-06-05 12:32:46
10278
4
原创 基于 vue2 构建和后台真实交互的 管理系统
关于此项目是 vue + element-ui 构建的后台管理系统，是后台项目node-elm 的管理系统，所有的数据都是从服务器实时获取的真实数据，具有真实的注册、登陆、管理数据、权限验证等功能。源码地址https://github.com/bailicangdu/vue2-manage技术栈vue2 + vuex + vue-router + webpack + ES6/7 + less + e
2017-06-05 12:31:33
11790
5
原创 vuejs 初上手项目
学习一个框架有两个阶段最难，一个是初期的入门，一个是后期的源码阅读。虽然vue的官方文档非常棒，在我读完文档之后还是会有一种感觉，知识点我都懂，然后呢？似乎大体知道该怎么利用vue全家桶去搭建一个项目，但具体下笔又有点模糊。vue官方的脚手架并没有将vue-router和vuex包括进去，所以我们需要自己去配置它们。虽然找了一堆的demo，但是都没有达到我想要的效果。正好趁着自己接了一个小项目，拿...
2017-03-24 09:38:44
478
原创 基于 vue2 + vuex 构建一个具有 45 个页面的大型单页面应用
前言初学vue时曾在网上搜索vue的实战项目源码，无奈大部分都是简单的demo，对于深究vue没有太大的帮助，剩下的一些大部分都是像音乐播放器之类的展示型项目，交互没有预期那么复杂。但我们实际在工作中，经常会遇到有购物车的项目，这类项目因为涉及到money，所以对逻辑严谨度要求高，页面之间交互复杂，又会伴随着登陆、注册、用户信息等等，常常会让我们很头疼。既然还没人用vue写过这样的项目，那不如我来...
2017-03-11 13:29:53
729
原创 基于 vue2 + vuex 构建一个具有 45 个页面的大型单页面应用
前言初学vue时曾在网上搜索vue的实战项目源码，无奈大部分都是简单的demo，对于深究vue没有太大的帮助，剩下的一些大部分都是像音乐播放器之类的展示型项目，交互没有预期那么复杂。但我们实际在工作中，经常会遇到有购物车的项目，这类项目因为涉及到money，所以对逻辑严谨度要求高，页面之间交互复杂，又会伴随着登陆、注册、用户信息等等，常常会让我们很头疼。既然还没人用vue写过这样的项目，那不如我来写
2017-03-11 13:24:57
651
原创 vue2 + vuex 高度还原 饿了么 App，用真实数据登陆官网，并实现购物车、下单功能
前言vue2的发布后自己也研究了一段时间，奈何公司的技术栈是以react为主，没有机会好好利用vue2去做一个完整的项目。虽然写了几个demo，但和写一个完整的项目还是有很大差别的。于是自己想着用空余的时间写一个项目，选择了饿了么也只是因为经常用，熟悉它的布局。之前的饿了么官网是用angular写的，最近才发现原来这段时间改成了vue，看来饿了么也入了vue的坑。既然要写一个完整的项目，就要认真对待
2017-02-21 19:53:24
4361
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人