前端开源小册-《从0到1手写可插拔前端框架》
想让自己的学习有意义,想做点技术输出回报大家
所以开源了一本名叫《从0到1手写可插拔前端框架》
的前端小册
开源小册的所有源码:https://github.com/BoyYangzai/mini-umi
共计25+小节
目前已开源前6小节 -- 手把手教你从0到1开发前端类库实战,深入前端工程化
每篇都是
匠心之作
,千字长文
,已实战为主
,请放心食用
小册地址:https://github.com/BoyYangzai/mini-umi
体验 mini-umi + Vue3.2 + Vite预设
npx create-mumi 项目名 npm install npm run dev npm run ssr // 服务端渲染模式
- 0.小册简介:手写可插拔前端框架Umi
- 1-1.前端漫谈:npm包与框架
- 1-2.牛刀小试: 实现并发布一个CLI
- 1-3.构建编译:现代前端构建方案
- 1-4.仓库架构: Monorepo仓库实践
- 1-5.源码调试:脚本断点调试
- 技术收敛: 什么是微内核架构
你将获得
- 类库开发,从0基础到掌握开源类库开发的所有知识;
- 新人友好,手摸手教你从0开始造轮子;
- 深入浅出,理解微内核架构、拓展无限可能;
- 手写内核,一步一步实现umi的微内核架构;
- 定制框架,教你搭建企业级可插拔定制框架。
作者介绍
前百度、现蚂蚁-支付宝体验技术部 AntV 开源团队实习生,牛客千粉博主,喜欢探索前端工程化解决方案,热爱开源,喜欢分享技术,同时 AntV 的 Member
,Umi、Dumi、AntDesign 的 Contributer
<br>我的Github:https://github.com/BoyYangzai
适宜人群:
在校大学生 ,初、中级前端工程师
- 对前端开源社区中类库开发、框架开发、基础架构相关感兴趣的前端工程师
- 对前端工程化感兴趣,想要学习如何参与开源,但没有系统学习认识的在校大学生和初级前端工程师
- 一起阅读源码,和作者一起学习优秀前端工程师们的工程实践经验
- 对于Umi微内核架构感兴趣,对如何基于Umi内核拓展能力开发例如蚂蚁金服的中后台框架-Bigfish,npm包研发工具father,以及刚刚推出的dumi2 感兴趣的前端工程师
小册介绍:
如果你现在去使用 Umi,你会发现它是一个类似于Nextjs、Remaix一个样的前端框架,它有很多功能:约定式路由、SSR、MOCK数据、配置文件...
像蚂蚁金服内部的中后台前端框架Bigfish其实就是基于Umi框架封装的,类似的还有Dumi、father这两个框架
如果你对如何手写实现这样的前端框架感兴趣,这本小册你一定不能错过
什么是微内核架构?
如果你平时喜欢玩游戏,那你一定对MOD(模组)这个词并不陌生
通过微内核暴露出来的API,你可以自定义各式各样的模组去实现任何你想要的功能,比方说给你的游戏角色换个衣服,比方说给你的前端框架加个SSR的模式,只不过在前端领域我们把它叫做Plugin-插件
在本课程中,我分了三个大部分来系统讲述:
1.前端工程化-类库开发
系统认识如何开发好用的npm类库与框架,每一小节都配备了充足的实战项目,保证新手同学也能看得懂,学得下去,为后续手写内核和框架学习必要工程化知识
2.手写微内核架构-实现mini-core
在这一大章,你将认识微内核架构的原理与实现,并亲手实现微内核架构的各个模块,如Service、Plugin、PluginAPI、可扩展插件系统、应用元数据等
3.手写企业级中后台前端框架
这一大章你已经实现了自己的微内核架构,我们将在微内核架构的基础上,手写实现一个企业级可用的中后台前端框架-mini-umi
#前端工程师##前端开发实习##前端实习#