夏天夏 夏天夏
首页
  • 技术分享

    • 小白都能看懂的闭包
    • 关于后台管理应用
    • 关于技术的取舍
    • 前端工程化
    • 切换node版本
    • 如何优雅的写事件代理
    • 我所不了解的技术
    • 我喜欢的parcel
    • angular1使用
    • npm script打造前端工作流
  • 发布一个node插件

    • 发布一个npm包
    • 如何打包一个插件工具库
    • 打包工具的选择
  • 年终总结

    • 2019年总结
    • 2020年总结
    • 2021年总结
  • JavaScript
  • CSS
  • 框架
  • Node
  • 服务
  • web3
  • 其他
我的作品
  • 分类
  • 标签
  • 归档
GitHub (opens new window)

夏天夏

我也不饶岁月
首页
  • 技术分享

    • 小白都能看懂的闭包
    • 关于后台管理应用
    • 关于技术的取舍
    • 前端工程化
    • 切换node版本
    • 如何优雅的写事件代理
    • 我所不了解的技术
    • 我喜欢的parcel
    • angular1使用
    • npm script打造前端工作流
  • 发布一个node插件

    • 发布一个npm包
    • 如何打包一个插件工具库
    • 打包工具的选择
  • 年终总结

    • 2019年总结
    • 2020年总结
    • 2021年总结
  • JavaScript
  • CSS
  • 框架
  • Node
  • 服务
  • web3
  • 其他
我的作品
  • 分类
  • 标签
  • 归档
GitHub (opens new window)
  • 个人作品
    • 一个手绘风格的ui组件库(pencil-vue)
    • 一个简洁的在线思维导图编辑器(MindMap)
    • NFT生成器(nftgen)
  • 个人作品
夏天夏
2022-05-15
目录

个人作品

# 一个手绘风格的ui组件库(pencil-vue) (opens new window)

以前一直都想做一个自己的组件库,但是经过市场调研发现现在的组件库真是太全了,没必要自己再做一次,直到发现了这个rough (opens new window)手绘风格的工具库之后,我头上的灵感灯泡一闪,是不是这个做一个手绘风格的组件库呢,然后就有了pencil-vue (opens new window)

实现原理也很简单,就是动态计算出div的宽和高然后把div隐藏掉,使用rough来描绘出div的宽高,主要目的是为了抛砖引玉学习开发组件中的架构,设计,封装等思想。具体看前往pencil-vue (opens new window)查看文档使用哦。

# 一个简洁的在线思维导图编辑器(MindMap) (opens new window)

因为之前有过图在线编辑的需求,从零搭建简直就是一个简直就是工作量非常巨大的工作,里面涉及了托拉拽,画布的数据结构,物料,组件,架构涉及等大量知识,加上功能点非常之多,之后我发现了一个最新而且完全可以满足我的业务需求的图编辑引擎antv-x6 (opens new window)可以说就是开箱即用了,这个思维导图MindMap (opens new window)也是基于x6引擎。 1d91d7a5e5b47c0a853dacc424ab981.png

# NFT生成器(nftgen) (opens new window)

2021年在web3领域最火的nft出现了,那时候想着一套nft需要好一万张,如果设计师一张一张的合成会不会很慢,后来就有了这个工具。 f779a444a459d2c80768f8e1ead1ca9.png

编辑 (opens new window)
#个人作品
上次更新: 2023/01/04, 13:02:32
最近更新
01
远程办公的个人思考
02-21
02
SEO
01-02
03
NFT的价值
12-27
更多文章>
Theme by Vdoing | Copyright © 2019-2025 夏天夏 | MIT License
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式