flask与js交互的示例代码_这些热门GitHub代码库,每个前端开发者都应该收藏

(给前端大全加星标,提升前端技能)

作者:前端宇宙 公号 / 刘小夕 (本文来自作者投稿)

经常会有小伙伴让推荐好的代码库,最近看到了 sayanide 写的文章,都是非常棒的代码库,供大家学习参考。

手头有大量的资源?总是一件很棒的事。

作为一个码农,我们需要专注于功能和最佳实践,而不是一遍遍地编写样板代码。消除无用功,投入时间学习使用正确的工具或者懂得使用有用的资源可以极大的帮助我们节省时间。

通过本篇文章,我们将会了解一些能够极大的帮助我们提升 WEB 开发技能的 GitHub 库,这些库也会帮助你编写更好的代码。

Node.js Best Practices

86910980bba015d1c0c40ff65fab39e1.png

这个库是一个很棒的地方,可以让你随时了解 Node 世界,并在使用时了解最佳实践。拥有 40k Star 和 133 位贡献者,这个库几乎每天都有更新。

该库对排名较高 Node.js 的最佳实践进行了总结和整理,包括 Node.js + Docker 最佳实践。目前拥有超过80多种最佳实践,风格指南和结构建议等。

一些常见的最佳做法包括:

  • 更好地组织项目

  • 错误处理实践

  • 代码风格实践

  • 测试和整体质量实践

  • 进行生产实践等等

仓库地址:

 https://github.com/goldbergyoni/nodebestpractices

HTML5 Boilerplate

078665b0bbb9d314047f34f7d9d5386b.png

HTML5 Boilerplate 是一个专业的前端模板,用于构建快速、健壮和适应性强的 Web 应用程序或者网站。

该项目是多年迭代开发和社区知识的产物。它没有强加特定的开发理念或者框架,所以你可按照自己的方式自由地构建代码。

包括像如下的预定义功能:

  • Normalize.css

  • jQuery with CDN

  • Apache Server Configs

  • 有用的 CSS 助手类

  • 默认样式,性能优化等

根据你想要用的内容以及使用方法,将所需文件复制粘贴到你的工程目录里即可。这样就为你提供了一个配置好的模板,从而加快了开发速度。

仓库地址: https://github.com/h5bp/html5-boilerplate

RealWorld

514a60ce508d76b54f91310d40ad7b7d.png

掌握一个新框架的核心概念和意识形态并不是一件令人沮丧的事情。

如果你没有正确理解这个概念的话,你需要阅读文档,运行示例代码,拆解示例应用程序并将其重新组合在一起,在本地安装 CLI 等等,它需要花费太多的经历,令人沮丧。

RealWorld 允许你选择任何前端(React,Angular2 等)和任何后端(Node , Django 等),并将它们集成在一起以查看应用程序的真实示例。

由于这些实现和技术栈相关,它们显然不能混用,但它们仍然遵循相同的功能和UX规范。

一些常用集成实例:

  • Angular + ngrx + nx

  • ClojureScript + re-frame

  • React / MobX

  • Go + Gin

  • NestJS + TypeORM/Prisma

你可以在仓库中找到无穷无尽的示例。尽情去寻找吧!

仓库地址: https://github.com/gothinkster/realworld

You Don't Know JS Yet

29230501a7c1e4b4ad632e7dcfe7cfee.png

这是一系列深入研究 JavaScript 语言核心机制的书籍。

所有的书籍均为免费,你可以随时在线阅读。

作者建议阅读的顺序为:

  • Get Started

  • Scope & Closures

  • Objects & Classes (还未开始)

  • Types & Grammar (还未开始)

  • Sync & Async (还未开始)

  • ES.Next & Beyond (还未开始)

仓库地址: https://github.com/getify/You-Dont-Know-JS

Airbnb JavaScript Guide

c3cfdc33e27b59a747ab17816a855cda.png

这是 Airbnb 提供的非常精确和专业的风格指南。

本指南将通过深入基础知识和代码片段来帮助你由深入浅地理解 JavaScript

本指南涉及的一些热门内容如下:

  • 箭头函数

  • 变量提升

  • 解构

  • 注释

  • 性能

  • 测试

仓库地址: https://github.com/airbnb/javascript

Storybook

7be87c1ba23a3d0f5cf04d0dfea7f1d5.png

Storybook 是 UI 组件的开发环境,它允许你浏览组件库,查看每个组件的不同状态,以及交互地开发和测试组件。

Storybook 在 app 之外运行,这允许你独立开发 UI 组件,提高组件的重用性、测试性和开发速度。你可以快速构建,而不必担心应用程序特定的依赖关系。

它附带了一个 CLI 和一些代码示例,供你熟悉 Storybook.

仓库地址: https://github.com/storybookjs/storybook

Front-End-Checklist

d2b46bc420d95b81508768d684791953.png

Front-End-Checklist 是一个详尽的列表,列出了在网站或者 HTML 页面投入使用前所需要具备或者测试的所有元素。

它是一个基于前端 Web 开发的仓库,更关注性能、安全性和 SEO 等。

Front-End-Checklist 中的所有项目对于大多数工程都是必须的,但其中有些元素可以省略。

包括:

  • ?文档或者文章

  • ?在线工具/测试工具

  • ?媒体或者视频内容

仓库地址: https://github.com/thedaviddias/Front-End-Checklist

灵感和资源

这篇文章的令该来源于 Tech Sapien 和他所有令人惊叹的工作。库中的图片? 也是取自同一处。

总结

上面提到的所有的库并不是唯一可用的资源,除此之外我敢肯定还有大量的令人惊叹的项目。这些是其中一些我觉得很有用的资源,同时我自己也经常沉浸其中。

不要忘了给这些库点 Star?。以感谢所有出色的贡献者,感谢他们为我们创造了如此有用的资源✌?

推荐阅读   点击标题可跳转 GitHub 上需要关注的 10 大 React 库 ; 解读新一代 Web 性能体验和质量指标 ; 前22年的Loser,后4年和自己赛跑的人 | 最惨前端面经

觉得本文对你有帮助?请分享给更多人

关注「前端大全」加星标,提升前端技能

fd4b3e53a6134bd73e5a8cfba37e68d3.png

好文章,我在看❤️

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值