商汇粹外网资源平台

搜索
查看: 1824|回复: 5

github上有哪些有趣、实用的前端开源项目?

[复制链接]

该用户从未签到

7

主题

21

帖子

77

积分

注册会员

Rank: 2

积分
77
发表于 2022-10-22 09:52:58 | 显示全部楼层 |阅读模式
兴趣才是最好的老师,想以此进一步提高自己的前端水平,希望大佬们推荐一下。
回复

使用道具 举报

该用户从未签到

3

主题

61

帖子

185

积分

注册会员

Rank: 2

积分
185
发表于 2022-10-22 10:11:18 | 显示全部楼层
推荐一些有趣、实用的前端开源项目
1、vue-color-avatar
纯前端实现的矢量风格头像生成网站。可以通过搭配不同的素材,生成个性化头像。该项目使用 Vite + Vue3 开发,能够帮助前端初学者熟悉 Vue3 语法并掌握项目搭建的相关知识



2、city-roads
自动生成任意城市的道路图。采用 OpenStreetMap 的免费数据实现城市道路可视化,还支持导出图片用这些图片做壁纸感觉很酷。



3、https://www.hellogithub.com/periodical/category/JavaScript%20%E9%A1%B9%E7%9B%AE/?page=2#spy-debuggerspy-debugger
远程调试手机页面和抓包的工具。操作简单仅需手机和电脑在同一个 WIFI 下,即可在实现真机调试页面



4、drawio
一款简洁强大的绘图工具。免费开源可以自行部署也可以在线使用,功能上直追 Microsoft Visio。支持流程图、序列图、网络拓扑图、甘特图、思维导图、模型图等,还能导出多种格式类型比如 png、svg、PDF、HTML 和 VSDX 格式(Microsoft Visio 图形格式)



以上项目都收录于 HelloGitHub 每月28号发布的月刊中,感兴趣可以专注下
附最新一期月刊:





HelloGitHub 想让更多人爱上编程、开源,所以一直在尝试、摸索如何可以帮助到更多的人。目前 HelloGitHub 交流群 已全面开放,关注 HelloGitHub ,添加:HelloGitHub001 为好友入群,可同 CC++JavaGoPython、前端机器学习等各界大佬谈笑风生、切磋技术~ 还有大学生开源群,叫上你的小伙伴一起感受开源的乐趣吧!目前 HelloGitHub 小程序已上线,可以直接搜索开源项目啦~
HelloGitHub 分享 GitHub 上有趣、入门级的开源项目,找开源就上 HelloGitHub。
回复

使用道具 举报

该用户从未签到

7

主题

30

帖子

102

积分

注册会员

Rank: 2

积分
102
发表于 2022-10-22 10:29:38 | 显示全部楼层
下面是我整理的20个有趣的开源项目,希望当中有您想要收藏的那一个。
★1. Proton粒子

Site: github.com/drawcall/Pr…

Proton是一个轻量、灵活的
Javascript
粒子动画库。使用它可以轻松创建各种炫酷粒子动画效果,该项目在github被近 2k 项目引用。Proton还支持3d粒子版本github.com/drawcall/th… 。










★2. Awesome LowCode Component

Site: github.com/aliaszz/awe…

LowCode - 最近几年前端领域最火的概念, Awesome LowCode Component 项目为您收集了各种LowCode组件和前沿的技术方案, 可用于快速构建企业级项目或者直接用于开发, 大幅提高业务需求和商业变现的效率。



★3. wp2vite

Site: github.com/tnfe/wp2vit…






一个特别有用的项目, 它可以让你的webpack项目支持vite。相较于webpack,vite开发环境构建速度可以提升80%左右,构建生产环境能够提升50%左右。





★4. Awesome State

Site: github.com/tnfe/awesom…

网罗行业内各种各样的前端 状态管理 方案,包含react、vue、angular、小程序等状态库。





★5. 前端工程化工具Feflow

Site: github.com/Tencent/fef…

Feflow是腾讯开源的用于提升工程效率的前端工作流和规范工具。目前已经在NOW直播、花样直播、花样交友、手Q附近、群视频、群送礼、回音、应用宝、企鹅号等业务广泛使用。





★6. TDesign React Starter

Site: github.com/Tencent/tde…

TDesign React Starter 是一个基于 tdesign-react,使用
React

Vite2
开发,可进行个性化主题配置,旨在提供项目开箱即用的、配置式的中后台项目。







★7. Web IDE UI

Site: github.com/DTStack/mol…

Molecule是一个受VS Code启发,使用React.js构建的Web IDE UI 框架。通过设计一种类似VS Code扩展机制(Extension),可快速、轻松搭建一个高度抽象的Web IDE UI系统。





★8. Flutter 游戏library

Site: github.com/flutterkit/…

Zerker 是一个灵活、轻量的
Flutter
动画游戏框架。使用
Flutter
来开发跨端游戏您试过吗? 同时它还可以制作Widget组件动画效果,比方飞出动画、弹窗动画、场景转场等等。







★9. InkPaint

Site: github.com/drawcall/in…






InkPaint
是一个运行在
node.js
端的轻量级
Canvas
图形渲染库。使用
InkPaint
可以在服务端动态合成各种图片、pdf等。同时,InkPaint是
node.js
和浏览器之间的通用库,在浏览器端依然可以正常运行。







★10. Golang for Node.js Developers

Site: github.com/miguelmota/…

本指南包含大量示例,适用于从 Node.js 学习 Go 的人,反之亦然。Go 是一个具有高性能、高并发、跨平台的语言,正在得到越来越来广泛的关注与应用。俗话说,技多不压身,多掌握一门语言也就意味着在应用开发的时候拥有了更丰富的选择余地。





★11. 云开发CloudBase CMS

Site: github.com/TencentClou…

CloudBase CMS 是腾讯云开发推出的,基于 Node.js 的 Headless 内容管理平台,提供了丰富的内容管理功能,安装简单,易于二次开发,并与云开发的生态体系紧密结合,助力开发者提升开发效率。










★12. qiankun微前端实践

Site: github.com/wl-ui/wl-mf…

qiankun 是一套完整的微前端解决方案,这个项目将通过一个微服务Demo 介绍 Vue 项目如何接入 qiankun。本项目是基于vue3+koa2+qiankun2的微前端后台管理系统项目实战。





★13. 在线视频编辑器

Site: github.com/kudlav/vide…

一个在线视频编辑器, 支持时间轴操作和视频裁剪等功能。项目使用服务器端渲染, 支持现代主流浏览器。





★14. 代码时钟收藏

Site: github.com/drawcall/cl…

这个项目收藏了几十款各种各样好玩的时钟代码。找一款好看的时钟挂到你的博客主页上, 瞬间会让它变得高大上。










★15. Awesome made by chinese

Site: github.com/JN-H/awesom…

Github上来自中国开发者的开源项目,这个项目里收集并整理了部分我们中国开发者自己的作品,其中每一个都值得点赞。类似Awesome项目还有

  • github.com/igoradamenk…
  • github.com/felipefialh…
  • github.com/jeswinsimon…
  • github.com/mvximenko/a…





★16. Alloy Worker

Site: github.com/AlloyTeam/a…

面向事务的高可用 Web Worker 通信框架, 经受住腾讯文档等大型前端项目的考验。





★17. 商城低代码平台

Site: github.com/wangyuan389…

Mall-Cook 是一个基于 vue 开发的可视化商城搭建平台,包括多页面可视化构建、Json Schema 生成器(可视化搭建物料控制面板),实现组件流水线式标准接入平台。最新版本使用 uni-app 重构物料、模板项目,支持生成 H5、小程序多端商城。










★18. WebGPU Samples

Site: github.com/austinEng/w…

WebGPU是最新的Web 3D图形API, 目前网络上关于WebGPU的学习资料非常少, 本项目中包含了一系列WebGPU例子以及代码, 它可以帮助您快速上手。





★19. 前端资讯 TNT Weekly

Site: github.com/tnfe/TNT-We…

由腾讯新闻TNTWeb前端团队维护的weekly项目,每周为您推荐国内外前端领域最新的优秀文章以及行业进展。该项目自开源以来收获 3.5k+ star,深受业内广大前端开发者喜爱。





★20. 程序员在家做饭

Site: github.com/Anduin2017/…

菜谱哪都有,上网一搜遍地都是,甚至还有视频教程,可里面总会时不时出现难以捉摸的“适量”、突然冒出的“调料”等,这对做事向来谨慎明确的程序员来说,实在颇为头疼,“HowToCook”项目也由此诞生。



另外补充:一个比较好的知乎开源项目专栏:GitHub掘金
Github一些比较优秀的开源项目:

1、高仿超兔吃货探城微商项目开源,超级好玩,毕设必用!
2、一个极其好用的图片处理类库!
3、程序员搞了一个离线地图APP,还挺好用
4、Spring Boot + Vue + Shiro 实现前后端分离、权限控制
5、牛逼了!github上一个 身份证号码识别系统
6、GitHub上15 个有这些趣又好玩的项目
7、Gitee上一个很不错的代码生成神器,开发效率能提高一倍!
8、Github上一款前端桌面端应用项目,很值得学习!
9、github重磅推荐!一个很好用的PPT生成工具
10、Github上一款前端桌面端应用项目,很值得学习!
11、GitHub上一个基于Springboot+Security + Layui实现一套权限管理后台模板
12、重磅推荐一个毕设项目——一个高仿博客园系统项目实战!
13、再见 Shiro!权限认证我选择 Sa-Token:简单、优雅!
14、github上的「冰墩墩」代码,开源了!
感谢您的耐心阅读!
作者:腾讯TNTWeb前端团队
连接: https://juejin.cn/post/7071857303590273061
来源:掘金
回复

使用道具 举报

该用户从未签到

2

主题

11

帖子

47

积分

新手上路

Rank: 1

积分
47
发表于 2022-10-22 10:47:58 | 显示全部楼层
具体的可以看笔者最近写的:强烈推荐 GitHub 上值得前端学习的开源实战项目。
比如下面的也是很好的开源项目:
JavaScript

阮一峰老师的 ES6 入门教程笔记

全栈工程师培训材料

每个 JavaScript 工程师都应懂的33个概念

Vue.js











React.js














Angular



Node.js








最后



笔者前段时间就弄了个博客项目,包括前端,后端,数据库,服务器,发布,域名等完整流程,也写了 8 篇详细的高质量的文章解说。
项目地址如下:

  • react 版前台展示

2.  文章管理后台

3.  后台接口

4. vue 版前台展示

笔者博客首更地址 :
回复

使用道具 举报

该用户从未签到

1

主题

6

帖子

22

积分

新手上路

Rank: 1

积分
22
发表于 2022-10-22 11:06:18 | 显示全部楼层
哈哈哈哈, 我也会被邀请回答问题,有点开心喔
我就来安利几个我之前写的有趣的小小小小小玩意~
1. Medit.js
创新性玩法的专注于移动端的富文本编辑器,解决了移动端不好点的问题,支持通过手势左右划来精确选择内容。
https://medit.js.org
2. GMF 一键帮你搞好前端es6、preact+rollup等前端开发环境,我也会尽量保证里面的技术栈是最新的哦⊙∀⊙
https://github.com/echosoar/gmf
3. DataV 这可不是那个可视化库,而是一个可视化模块化页面搭建工具。
拥有基于electron的桌面客户端,搭建系统基于react+redux。
另外DataV还有一堆的周边工具,包括DataV-server、模块组件生成工具DataV-tools等等。
https://github.com/echosoar/DataV

感觉不错请给予star哦~
回复

使用道具 举报

该用户从未签到

1

主题

10

帖子

48

积分

新手上路

Rank: 1

积分
48
发表于 2022-10-22 11:24:38 | 显示全部楼层
自荐一下自己最近基于electron做的开源版本utools:



回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

快速回复 返回顶部 返回列表