超棒的Web开发资源 ![Awesome][awesome-badge]
这是一个关于Web开发资源的超棒项目。⚡
资源会频繁更新！⚡
尽情享用！:)
如果你喜欢这个仓库，请务必给它一个⭐。
在提交新资源之前，请阅读贡献指南。
目录
托管：
| 网站 | 描述 |
|---|---|
| https://netlify.com | Netlify 将整个现代工具和服务生态系统统一到一个简单的工作流程中，用于构建高性能网站和应用。 |
| https://firebase.google.com | Firebase 帮助你构建和运行成功的应用。它得到Google的支持，并受到从初创公司到全球企业的应用开发团队的喜爱。 |
| https://aws.amazon.com | Amazon Web服务提供广泛的全球云基础产品和服务，帮助组织更快地移动、降低IT成本并实现规模化。 |
| https://pages.github.com | GitHub Pages是你和你的项目的网站。它直接从你的GitHub仓库托管。你只需编辑、推送，你的更改就会生效。 |
| https://vercel.com | Vercel 将最佳开发者体验与对最终用户性能的执着关注相结合。它使前端团队能够做出他们最好的工作。你只需要开发、预览和发布。 |
| https://surge.sh | Surge 是面向前端开发者的静态网站发布工具。它是简单的、单命令的网站发布。它可以免费发布HTML、CSS和JS，无需离开命令行。 |
| https://render.com | Render 是一个统一的云平台，用于构建和运行所有你的应用和网站，提供免费的TLS证书、全球CDN、DDoS保护、私有网络和从Git自动部署。 |
| https://docs.gitlab.com/ee/user/project/pages/ | GitLab Pages - 直接从GitLab仓库托管静态网站。要发布网站，可以使用任何静态站点生成器或任何纯HTML、CSS和JavaScript。 |
| https://stormkit.io | Stormkit 可以轻松管理你的前端基础设施。它与你的git流程完美集成。它帮助你无缝地构建、部署和扩展你的web应用。 |
| https://www.digitalocean.com/ | DigitalOcean 提供你需要的云计算服务，具有可预测的定价、强大的文档和可扩展性，以支持你在任何阶段的增长。它是一个更简单的云平台，让开发者更快乐，获得更好的结果。 |
| https://www.000webhost.com/ | 000webhostapp 是零成本的网站托管，提供PHP、MySQL、Cpanel且无广告。其服务器使用先进的防火墙，并包括DDoS保护。 |
| https://infinityfree.net/ | InfinityFree 是功能齐全的完全免费网站托管，提供PHP、MySQL且网站上没有广告。 |
| https://pages.cloudflare.com/ | Cloudflare Pages 是一个JAMstack平台，供前端开发者协作和部署网站。它提 供免费的无限带宽。 |
| https://supabase.com | Supabase 是一个开源的Firebase替代品。使用Postgres数据库、身份验证、即时API、实时订阅和存储开始你的项目。 |
| https://railway.app/ | Railway 是一个基础设施平台，你可以在其中配置基础设施，在本地使用该基础设施进行开发，然后部署到云端。 |
| https://fly.io/ | Fly 是一个平台，用于在靠近用户的地方运行全栈应用和数据库。我们从2017年开始致力于这个项目，我们认为它非常棒。 |
| https://kinsta.com/static-site-hosting/ | Kinsta 为web应用、数据库、WordPress站点和静态网站提供一体化云托管。从GitHub、GitLab和Bitbucket快速安全地部署到由Google Cloud Platform和Cloudflare提供支持的基础设施。 |
| https://fleek.co/ | Fleek 使在新的开放网络上构建网站和应用变得容易：无需许可、无需信任、抗审查，并且没有中心化的看门人。 |
学习平台：
编程挑战平台：
自由职业平台：
远程工作：
照片：
视频：
插图：
图标：
字体：
YouTube频道：
播客：
代码编辑器：
| 网站 |
|---|
| VS Code |
| Sublime Text |
| Brackets |
| emacs |
| Vim |
| Spacemacs |
| Emacs |
| Neovim |
| Fleet |
| CodeLobster |
调色板：
UI 灵感：
| 网站 |
|---|
| https://websitevice.com/ |
| https://httpster.net |
| https://www.awwwards.com |
| https://dribbble.com |
| https://onepagelove.com |
| https://www.behance.net |
| https://tympanus.net/codrops |
| https://landings.dev |
文档：
| 网站 |
|---|
| https://developer.mozilla.org/en-US/ |
| https://w3schools.com |
| https://w3docs.com |
| https://devdocs.io |
动画库：
| 网站 |
|---|
| CSShake |
| Animate.css |
| AnimeJS |
| GreenSock (GSAP) |
| Magic Animations |
| Hover css |
| AniJS |
| Wicked CSS |
| Tuesday |
| Mo.js |
| AOS |
| Velocity.js |
| Popmotion |
| Snap.svg |
| Animista |
| Lottie-Player |
| Framer motion |
| SwiperJS |
| Motion One |
图表：
| 网站 |
|---|
| Chart.js |
| D3.js |
| three.js |
| amCharts |
| Charts.css |
| ECharts |
Chrome 扩展程序:
网站优化工具:
| 网站 |
|---|
| Google PageSpeed Insights |
| GTmetrix |
| WebPageTest |
| Yslow |
| web.dev |
| Optimizilla |
| SEOTester |
HTML/CSS/JavaScript 模板:
新闻通讯:
| 网站 | 主题 |
|---|---|
| Marko Tech Tips | 直接发送到您邮箱的实用技术提示。 |
| Smashing Newsletter | 前端和用户体验。 |
| Frontend Focus | HTML、CSS、WebGL、Canvas、浏览器技术等。 |
| CSS Weekly | CSS。 |
| JavaScript Weekly | JavaScript。 |
| Accessibility Weekly | 无障碍性。 |
| JAMstacked | JAMstack 生态系统。 |
| UI Dev Newsletter | 用户界面开发。 |
| Go Make Things | 每日原生 JavaScript。 |
CSS 生 成器:
| 网站 | 描述 |
|---|---|
| 毛玻璃效果生成器 | 使用毛玻璃效果生成器为您的项目创建令人惊叹的效果。 |
| 按钮生成器 | 一个在线画廊，包含 100 多种按钮设计，您可以轻松复制并在项目中使用。 |
| Layoutit Grid | 快速设计网页布局，并获取 HTML 和 CSS 代码。通过我们的交互式 CSS Grid 生成器直观地学习 CSS Grid 并构建网页布局。 |
| CSS 渐变编辑器 | 您可能只需要这个工具来创建 CSS 渐变和图案。 |
| Hola SVG 加载器生成器 | SVG 加载器生成器，带有 Sass 和 SMIL 选项 |
| Shape Divider | 一个免费工具，使设计师和开发人员更容易为他们的最新项目导出漂亮的 SVG 形状分隔器。 |
| BEAUBUS 图案 | 150+ 免费 SVG 图案和 CSS 背景图像生成器 |
| 9elements - 花式边框半径 | 9elements 是一个小工具，帮助您创建自己的有机形状。当您在 CSS 中使用四个/八个值指定 border-radius 时，您可以创建看起来像有机物的形状。 |
| Blobmaker | Blobmaker 是由 z creative labs 用 💕 制作的免费生成设计工具，可帮助您快速创建随机、独特和有机外观的 SVG 形状。 |
| Toptal CSS3 生成器 | 一个免费的在线工具，用于快速生成 CSS3 代码片段 ，如效果、渐变和动画。 |
| 新拟物化 | 一个免费的在线工具，用于设计具有颜色、渐变和阴影的吸引人的用户界面。 |
| Scrollbar.app | 一个简单的在线工具，用于为网页创建自定义滚动条。 |
| Code Magic | 一个免费工具，通过生成 Tailwind 和 CSS 代码来简化 CSS 的使用，用于效果、渐变和输入 |
CSS 游戏:
| 网站 | 描述 |
|---|---|
| Flexbox 青蛙 | Flexbox 青蛙是一个互动游戏，帮助用户学习和练习CSS Flexbox 布局。 |
| Flexbox 圆桌骑士 | 一系列挑战，我们必须使用Flexbox 属性来定位和对齐屏幕上的元素，以完成中世纪主题的游戏布局。 |
| Grid 花园 | Grid 花园是一个互动游戏，帮助用户学习和练习CSS Grid 布局。 |
| Grid 攻击 | 学习和练习CSS Grid 布局。 |
| CSS 餐厅 | 学习如何使用 CSS 选择网页元素的有趣互动方式。 |
| 猜 CSS | 另一种学习 CSS 的有趣互动方式。 |
| CSS 速通 | CSS 速通是一项挑战，看开发者只使用 CSS（层叠样式表）能多快完成一个任务。 |
在线工具：
| 网站 | 描述 |
|---|---|
| PRM | 项目和个人资料 Readme 制作工具：轻松创建 GitHub 项目和个人资料的精彩 readme |
| 二维码生成器 | 使用二维码生成器轻松为您的项目创建二维码。 |
| 谷歌分析检查器 | 扫描您的项目以确保正确设置了 Google Analytics 标签。 |
| 渐变艺术 | 一个高级的 CSS 渐变编辑器，具有分层、设计工具和免费云存储功能 |
| JSONT | 一个简单而强大的 JSON 格式化工具 |
| JSON Crack | 一个将 JSON 代码可视化为清晰树状结构的简单工具 |
| Codepng | 将您的源代码转换为精美的可分享图片 |
| tablebackend.com | 为您的简单项目提供后端，使用强大的基于画布的数据网格处理数百万行数据。 |
| Markdown 工具 | 一套免费工具，用于在 HTML、CSV、PDF 和 Excel 文件与 Markdown 之间进行转换 |
| OnlineInterview.io | 免费的面试平台，具有共享代码编辑器、绘图板和视频聊天功能。 |
UI 组件：
| 网站 | 描述 |
|---|---|
| Flowbite | 基于 Tailwind CSS 的开源 UI 组件库，具有暗黑模式和交互式元素 |
| TailGrids | 300+ 免费和高级 Tailwind CSS UI 组件和部分 |
| Ayro UI Bootstrap | 适用于现代 Web 应用的 Bootstrap UI 组件、代码片段和部分 |
| uiverse | 使用 CSS 和 HTML 制作的开源 UI 元素，任何人都可以贡献。 |
| shadcn/ui | 适用于 React 项目的开源 UI 组件，您可以轻松复制粘贴到您的应用中。 |
| Headless UI | 完全无样式、完全可访问的 UI 组件，设计用于与 Tailwind CSS 集成。 |
Vue UI 库：
| 网站 | 描述 |
|---|---|
| Vuetify | Vuetify 是一个语义化的 Vue 组件框架。它旨在提供干净、语义化和可重用的组件，使构建应用变得轻而易举。利用 Vue、Material Design 和大量精心制作的组件和功能的力量，构建令人惊叹的应用程序。 |
| Vue Material | 简单、轻量级，并完全按照 Google Material Design 规范构建。 |
| BootstrapVue | BootstrapVue 为 Vue.js 提供了最全面的 Bootstrap v4 实现之一。具有广泛的自动 WAI-ARIA 无障碍标记。 |
| Quasar 框架 | Quasar 是一个基于 MIT 许可的开源 Vue.js 框架。它使 Web 开发人员能够创建响应式++网站/应用，格式多样：SPA、SSR（+ 可选 PWA 客户端接管）、PWA、BEX、移动应用（Android、iOS 等）和多平台桌面应用（使用 Electron）。Quasar 的座右铭是"编写一次代码，部署为网站、移动应用和/或 Electron 应用"。它提供最先进的 CLI 和高效的 Quasar Web 组件，无需额外的重量级库如 Hammer.js、Moment.js 或 Bootstrap。 |
React UI 库：
| 网站 | 描述 |
|---|---|
| Material-UI | 简单且可定制的组件库，用于构建更快、更美观、更易访问的 React 应用程序。 |
| Ant Design | 企业级 UI 设计语言和 React UI 库。 |
| React Bootstrap | 使用 React 构建的 Bootstrap 组件。 |
| Semantic UI React | Semantic UI React 是 Semantic UI 的官方 React 集成。 |
| Chakra UI | 一个简单、模块化和可访问的组件库，为您提供构建 React 应用程序所需的构建块 |
| NativeBase | NativeBase 是一个可访问、实用优先的组件库，帮助您在 Android、iOS 和 Web 上构建一致的 UI。 |
| Prime React | 设计无关、灵活和可访问的 React UI 组件的终极集合。 |
Angular UI 库：
| 网站 | 描述 |
|---|---|
| Taiga UI | 一套强大的 Angular 开源组件 |
| PrimeNG | Angular UI 组件库，具有优雅、高性能、可访问和完全可定制的 UI 组件。 |
| Angular Material | Angular Material 是 Google 于 2014 年开发的 UI 库组件。 |
其他：
| 网站 | 描述 |
|---|---|
| MDB：Markdown 徽章 | 只需几次点击即可生成令人惊叹的 svg markdown 徽章 |
| Markdown 预览 | 使用 GitHub CSS 的即时预览 Markdown 编辑器。 |
| JavaScript 测验 | JavaScript 测验 - 通过有趣的方式检查您的知识。 |
| CookieBubble | 轻松告知用户您的网站正在使用 cookie 的方法。 |
| 开发者更新 | 让您了解软件开发世界中发生的一切 |
| Boxy SVG 编辑器 | SVG 编辑工具 - 在这里您可以轻松编辑和保存任何 SVG 文件 |
| Cssrepo | 精选的优秀框架、风格指南和其他编写精彩 CSS 的酷炫资源列表 |
| Web Searcher | 轻松创建 Open Graph、Twitter 和基本元标签 |
| MakeMeta | 轻松生成您网站的元标签！ |
| PerfectBugReport.io | 一个简单的清单，列出了错误报告中应包含的基本项目。 |
| Vue 速查表 | Vue、Vue Router 和 Pinia 的交互式速查表。 |
编辑推荐精选
讯飞智文
一键生成PPT和Word，让学习生活更轻松
讯飞智文是一个利用 AI 技术的项目，能够帮助用户生成 PPT 以及各类文档。无论是商业领域的市场分析报告、年度目标制定，还是学生群体的职业生涯规划、实习避坑指南，亦或是活动策划、旅游攻略等内容，它都能提供支持，帮助用户精准表达，轻松呈现各种信息。
讯飞星火
深度推理能力全新升级，全面对标OpenAI o1
科大讯飞的星火大模型，支持语言理解、知识问答和文本创作等多功能，适用于多种文件和业务场景，提升办公和日常生活的效率。讯飞星火是一个提供丰富智能服 务的平台，涵盖科技资讯、图像创作、写作辅助、编程解答、科研文献解读等功能，能为不同需求的用户提供便捷高效的帮助，助力用户轻松获取信息、解决问题，满足多样化使用场景。
Spark-TTS
一种基于大语言模型的高效单流解耦语音令牌文本到语音合成模型
Spark-TTS 是一个基于 PyTorch 的开源文本到语音合成项目，由多个知名机构联合参与。该项目提供了高效的 LLM（大语言模型）驱动的语音合成方案，支持语音克隆和语音创建功能，可通过命令行界面（CLI）和 Web UI 两种方式使用。用户可以根据需求调整语音的性别、音高、速度等参数，生成高质量的语音。该项目适用于多种场景，如有声读物制作、智能语音助手开发等。
Trae
字节跳动发布的AI编程神器IDE
Trae是一种自适应的集成开发环境（IDE），通过自动化和多元协作改变开发流程。利用Trae，团队能够更快速、精确地编写和部署代码，从而提高编程效率和项目交付速度。Trae具备上下文感知和代码自动完成功能，是提升开发效率的理想工具。
咔片PPT
AI助力，做PPT更简单！
咔片是一款轻量化在线演示设计工具，借助 AI 技术，实现从内容生成到智能设计的一站式 PPT 制作服务。支持多种文档格式导入生成 PPT，提供海量模板、智能美化、素材替换等功能，适用于销售、教师、学生等各类人群，能高效制作出高品质 PPT，满足不同场景演示需求。
讯飞绘文
选题、配图、成文，一站式创作，让内容运营更高效
讯飞绘文，一个AI集成平台，支持写作、选题、配图、排版和发布。高效生成适用于各类媒体的定制内容，加速品牌传播，提升内容营销效果。
材料星
专业的AI公文写作平台，公文写作神器
AI 材料星，专业的 AI 公文写作辅助平台，为体制内工作人员提供高效的公文写作解决方案。拥有海量公文文库、9 大核心 AI 功能，支持 30 + 文稿类型生成，助力快速完成领导讲话、工作总结、述职报告等材料，提升办公效率，是体制打工人的得力写作神器。
openai-agents-python
OpenAI Agents SDK，助力开发者便捷使用 OpenAI 相关功能。
openai-agents-python 是 OpenAI 推出的一款强大 Python SDK，它为开发者提供了与 OpenAI 模型交互的高效工具，支持工具调用、结果处理、追踪等功能，涵盖多种应用场景，如研究助手、财务研究等，能显著提升开发效率，让开发者更轻松地利用 OpenAI 的技术优势。
Hunyuan3D-2
高分辨率纹理 3D 资产生成
Hunyuan3D-2 是腾讯开发的用于 3D 资产生成的强大工具，支持从文本描述、单张图片或多视角图片生成 3D 模型，具备快速形状生成能力，可生成带纹理的高质量 3D 模型，适用于多个领域，为 3D 创作提供了高效解决方案。
3FS
一个具备存储、管理和客户端操作等多种功能的分布式文件系统相关项目。
3FS 是一个功能强大的分布式文件系统项目，涵盖了存储引擎、元数据管理、客户端工具等多个模块。它支持多种文件操作，如创建文件和目录、设置布局等，同时具备高效的事件循环、节点选择和协程池管理等特性。适用于需要大规模数据存储和管理的场景，能够提高系统的性能和可靠性，是分布式存储领域的优质解决方案。
推荐工具精选
AI云服务特惠
懂AI专属折扣关注微信公众号
最新AI工具、AI资讯
独家AI资源、AI项目落地
微信扫一扫关注公众号