{"id":82921,"url":"https://github.com/lio-zero/frontend-focus","name":"frontend-focus","description":":newspaper: Focus on front-end hot news","projects_count":127,"last_synced_at":"2026-07-08T00:00:37.166Z","repository":{"id":43727195,"uuid":"511532698","full_name":"lio-zero/frontend-focus","owner":"lio-zero","description":":newspaper: Focus on front-end hot news","archived":false,"fork":false,"pushed_at":"2023-12-15T02:53:30.000Z","size":17,"stargazers_count":4,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2026-06-20T02:05:28.244Z","etag":null,"topics":["awesome","awesome-list","css","deno","front-end","html","javascript","news","nodejs","other","react","serverless","typescript","vite","vue","webpack"],"latest_commit_sha":null,"homepage":"","language":null,"has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/lio-zero.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-07-07T13:10:45.000Z","updated_at":"2024-12-20T15:56:42.000Z","dependencies_parsed_at":"2023-12-15T03:45:26.654Z","dependency_job_id":"fe163ae1-60d9-4174-b59f-028d957c6de4","html_url":"https://github.com/lio-zero/frontend-focus","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/lio-zero/frontend-focus","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lio-zero%2Ffrontend-focus","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lio-zero%2Ffrontend-focus/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lio-zero%2Ffrontend-focus/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lio-zero%2Ffrontend-focus/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/lio-zero","download_url":"https://codeload.github.com/lio-zero/frontend-focus/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lio-zero%2Ffrontend-focus/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":35246561,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-07-07T02:00:07.222Z","response_time":90,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"created_at":"2025-01-10T00:00:38.429Z","updated_at":"2026-07-08T00:00:37.167Z","primary_language":null,"list_of_lists":false,"displayable":true,"categories":["Awesome","React","Deno","JavaScript","Node","HTML","Vue","Other","Frontend","Build Tools","Serverless","2022","TypeScript"],"sub_categories":["Vite","Webpack"],"readme":"# Frontend Focus\n\n一份自己平常阅读的前端文章、新闻、工具，很棒的项目列表。\n\n## 2022\n\n- [Stack Overflow Developer Survey 2022](https://survey.stackoverflow.co/2022/) — Stack Overflow 2022 开发者调查\n- [Internet Explorer officially dies today](https://www.trustedreviews.com/news/internet-explorer-officially-dies-today-4241472) — 微软公司于 6 月 15 日永久关闭 IE 浏览器。\n\n![IE 落幕](https://upload-images.jianshu.io/upload_images/18281896-694798ac83a00cde.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)\n\n- [State of CSS 2022](https://web.dev/state-of-css-2022/) 和 [CSS in 2022](https://www.bram.us/2021/12/27/css-in-2022/) — CSS 2022 现状\n- [Vite 3.0 is out!](https://vitejs.dev/blog/announcing-vite3.html)\n- [2022 年的 React 生态](https://juejin.cn/post/7085542534943883301)\n- [尤雨溪主题演讲《2022 前端生态趋势》全记录](https://juejin.cn/post/7123126028838862862)\n- [State of Frontend 2022](https://tsh.io/state-of-frontend/)\n- [Is Turbopack really 10x Faster than Vite?](https://github.com/yyx990803/vite-vs-next-turbo-hmr/discussions/8)\n- [Announcing Nuxt 3.0 stable](https://nuxt.com/v3) — Nuxt 3.0 宣布推出稳定版\n- [2022 JavaScript Rising Stars](https://risingstars.js.org/2022/zh) — 2022 年 JavaScript 领域的年度总结。\n- [State of CSS 2022](https://2022.stateofcss.com/en-US/) — 2022 年 CSS 生态圈的技术趋势！\n- [State of JS 2022](https://2022.stateofjs.com/en-US/) — 2022 年 JS 生态圈的技术趋势！\n- [【VueConf 2022】尤雨溪：Vue 的进化历程](https://juejin.cn/post/7175444694917185591)\n\n## Frontend\n\n- [MDN](https://developer.mozilla.org/en-US/) — MDN Web Docs 提供了关于开放 Web 技术的信息，包括 HTML、CSS 和 JS，以及用于 Web 站点和渐进式的 Web 应用程序的 API。\n- [Frontend Focus](https://frontendfoc.us/) — 每周一次的最佳前端新闻、文章和教程综述。HTML、CSS、WebGL、Canvas、browser tech 等\n- [Frontend Developer](https://roadmap.sh/frontend) — 前端开发路线，该网站还提供了其他领域（包括后端、运维、Java、Go、React 等）学习路线\n- [freeCodeCamp](https://www.freecodecamp.org/) — 是一个友好的社区，你可以在其中免费学习编码。\n- [CSS-TRICKS](https://link.juejin.cn/?target=https%3A%2F%2Fcss-tricks.com%2F) — 一个专注于 CSS 新技术、新特性的优秀网站，也包含了其他的前端技术分享。\n- [weekly](https://github.com/ascoders/weekly) — 前端精读周刊。帮你理解最前沿、实用的技术。前端精读周刊。帮你理解最前沿、实用的技术。\n\n## HTML\n\n- [HTML Living Standard](https://html.spec.whatwg.org/multipage/)\n- [WHATWG](https://whatwg.org/)（Web 超文本应用技术工作组）是一个对通过标准和测试来发展 Web 感兴趣的人们组成的社区。\n- [W3C](https://www.w3.org/)（万维网联盟）是一个国际组织，它开发开放标准以确保 Web 的长期发展。\n- [awesome-html5](https://github.com/diegocard/awesome-html5) — 精选的 HTML5 资源精选列表。\n\n## JavaScript\n\n- [ECMA TC39](https://github.com/tc39)\n- [JavaScript Weekly](https://javascriptweekly.com/) — JavaScript 文章、新闻和酷项目的时事通讯。\n- [awesome-javascript](https://github.com/sorrycc/awesome-javascript) — 一组很棒的浏览器端 JavaScript 库、资源和闪亮的东西。\n- [awesome-javascript-cn](https://github.com/jobbole/awesome-javascript-cn) — 另外一份中文版的 JS 资源列表。\n- [Airbnb](https://github.com/airbnb/javascript) — JavaScript 样式指南。\n- [clean-code-javascript](https://github.com/ryanmcdermott/clean-code-javascript) — 适用于 JavaScript 的简洁代码概念。\n- [mqyqingfeng/Blog](https://github.com/mqyqingfeng/Blog) — 冴羽目前写的四个系列：JavaScript 深度系列，JavaScript 专题系列，ES6 系列，React 系列。\n- [33-js-concepts](https://github.com/leonardomso/33-js-concepts) — 每个 JavaScript 开发人员都应该知道的 33 个概念。\n- [learn-javascript](https://gitbook.gitbook.io/learn-javascript/) — 使用 JavaScript 的 GitBook 教学编程基础。\n- [JavaScript questions](https://github.com/lydiahallie/javascript-questions) — 一长串（高级）JavaScript 问题及其解释。 ✨\n- [30-Days-Of-JavaScript](https://github.com/Asabeneh/30-Days-Of-JavaScript) — JavaScript 编程语言的分步指南。\n- [javascript-patterns](https://github.com/shichuan/javascript-patterns) — JavaScript 设计模式集合，已经是个老项目了，但也值得阅读。\n- [modern-js-cheatsheet](https://github.com/mbeaudru/modern-js-cheatsheet) — 有关现代项目中经常遇到的 JavaScript 知识的备忘单。\n- [javascript-algorithms](https://github.com/trekhleb/javascript-algorithms) — JavaScript 实现的算法和数据结构，附有解释和进一步阅读的链接。\n- [30 seconds of code](https://www.30secondsofcode.org/) — 满足你所有开发需求的简短 JavaScript 代码片段。\n- [ES6 入门教程](https://es6.ruanyifeng.com/)\n- [现代 JavaScript 教程](https://zh.javascript.info/) — 以最新的 JavaScript 标准为基准。通过简单但足够详细的内容，为你讲解从基础到高阶的 JavaScript 相关知识。\n\n## TypeScript\n\n- [TypeScript](https://github.com/microsoft/TypeScript)\n- [type-challenges](https://github.com/type-challenges/type-challenges) — TypeScript 类型挑战。\n- [TypeScript Playground](https://www.typescriptlang.org/play) — 在线体验 TypeScript。\n\n## Node\n\n- [Node 官网](https://nodejs.org/en/)\n- [Node Weekly](https://nodeweekly.com/) — 一个免费的，每周一次的 Node 新闻和文章的电子邮件汇总。\n- [awesome-nodejs](https://github.com/sindresorhus/awesome-nodejs) — 令人愉快的 Node.js 包和资源。\n- [awesome-npm](https://github.com/sindresorhus/awesome-npm) — 很棒的 npm 资源和技巧。\n- [awesome-micro-npm-packages](https://github.com/parro-it/awesome-micro-npm-packages)\n- [awesome-nodejs-projects](https://github.com/sqreen/awesome-nodejs-projects) — 很棒的 Node.js 开源应用程序的精选列表。\n- [awesome-nodejs-security](https://github.com/lirantal/awesome-nodejs-security) — 很棒的 Node.js 安全资源。\n- [nodebestpractices](https://github.com/goldbergyoni/nodebestpractices) — ✅ Node.js 最佳实践列表。\n- [deep-into-node](https://github.com/yjhjstz/deep-into-node) — 深入理解 Node.js：核心思想与源码分析。\n- [Tao of Node - Design, Architecture \u0026 Best Practices](https://alexkondov.com/tao-of-node/)\n\n## Deno\n\n- [Deno 官网](https://deno.land/)\n- [Deno News](https://deno.news/) — Deno 文章、新闻和很酷的项目的时事通讯。\n- [awesome-deno](https://github.com/denolib/awesome-deno) — 与 Deno 相关的精选列表。\n\n## Vue\n\n- [Vue.js 官网](https://vuejs.org/)\n- [Vue.js News](https://news.vuejs.org/) — 向 Vue 开发人员提供最新的新闻和教程。\n- [awesome-vue](https://github.com/vuejs/awesome-vue) 🎉 与 Vue.js 相关的精彩内容的精选列表。\n- [vuejs-challenges](https://github.com/webfansplz/vuejs-challenges) — Vue.js 挑战集锦。\n- [Vue SFC Playground](https://sfc.vuejs.org/) — 在线体验 Vue。\n- [mini-vue](https://github.com/cuixiaorui/mini-vue) — 一个最简化 vue3 模型。\n- [vue-design](https://github.com/HcySunYang/vue-design)\n\n**里程碑**:\n\n- [Vue 2.7 \"Naruto\" Released](https://blog.vuejs.org/posts/vue-2-7-naruto.html) — Vue 2.7 \"Naruto\" 正式发布。\n- [Announcing Vue 3.0 \"One Piece\"](https://blog.vuejs.org/posts/vue-3-one-piece.html) — Vue 3.0 \"One Piece\" 正式发布。\n\n## React\n\n- [React 官网](https://github.com/facebook/react)\n- [React Status](https://react.statuscode.com/) — 每周汇总最新的 React 和 React Native 链接和教程。\n- [awesome-react](https://github.com/enaqx/awesome-react) 一系列关于 React 生态系统的精彩内容。\n- [awesome-react-native](https://github.com/jondot/awesome-react-native) 很棒的 React Native 组件、新闻、工具和学习资料！\n- [awesome-react-components](https://github.com/brillout/awesome-react-components) React 组件和库的精选列表。\n- [awesome-react-hooks](https://github.com/rehooks/awesome-react-hooks) 很棒的 React Hooks\n- 在线体验 React — [CodePen](https://reactjs.org/redirect-to-codepen/hello-world)、[CodeSandbox](https://codesandbox.io/s/new) 和 [Stackblitz](https://stackblitz.com/fork/react)\n- [React 源码解析](https://react.jokcy.me/)\n\n## Serverless\n\n- [Serverless 官网](https://cn.serverless.com/)\n- [Serverless](https://serverless.email/) — 每周新闻简报，介绍无服务器和功能即服务（FaaS）架构和平台，包括 AWS Lambda 和 Azure Functions。\n- [awesome-serverless](https://github.com/anaibol/awesome-serverless) ☁️ 为无服务器/无后端应用程序精心策划的服务、解决方案和资源列表。\n- [awesome-serverless](https://github.com/tinafangkunding/awesome-serverless) Serverless 的 100 种玩法。\n\n## Build Tools\n\n### Webpack\n\n- [Webpack 官网](https://webpack.js.org/)\n- [awesome-webpack](https://github.com/webpack-contrib/awesome-webpack) — 精选的 Webpack 资源、库和工具列表。\n\n### Vite\n\n- [Vite 官网](https://vitejs.dev/)\n- [awesome-vite](https://github.com/vitejs/awesome-vite) — 与 Vite.js 相关的精彩内容的精选列表。\n\n## Awesome\n\n一组 awesome 集合：\n\n- [awesome](https://github.com/sindresorhus/awesome) — 关于各种有趣话题的精彩列表。\n- [awesome-css](https://github.com/awesome-css-group/awesome-css) — 🎨 令人惊叹的 CSS 的精选内容 :)\n- [awesome-css-frameworks](https://github.com/troxler/awesome-css-frameworks) — 很棒的 CSS 框架列表。\n- [awesome-electron](https://github.com/sindresorhus/awesome-electron) — 使用 Electron 创建应用程序的有用资源。\n- [awesome-electronjs-hacking](https://github.com/doyensec/awesome-electronjs-hacking) — 一份关于 Electron.js security 的精选资源列表。\n- [awesome-tailwindcss](https://github.com/aniftyco/awesome-tailwindcss) — 与 Tailwind CSS 相关的很棒的东西。\n- [awesome-linux](https://github.com/inputsh/awesome-linux) — 一个很棒的项目和资源列表，这些项目和资源使 Linux 更加出色。\n- [awesome-interview-questions](https://github.com/DopplerHQ/awesome-interview-questions) — 精心挑选的面试问题清单。随意贡献！🎓\n- [awesome-mac](https://github.com/jaywcjlove/awesome-mac) — 收集各种类别的高级软件。\n- [Awesome-Hacking](https://github.com/Hack-with-Github/Awesome-Hacking) — 为黑客、渗透测试人员和安全研究人员提供的各种很棒的列表的集合。\n- [Awesome-Linux-Software](https://github.com/luong-komorebi/Awesome-Linux-Software) — 适用于 Linux 发行版的出色应用程序、软件、工具和其他材料的列表。\n- [awesome-selfhosted](https://github.com/awesome-selfhosted/awesome-selfhosted) — 可以托管在你自己的服务器上的免费软件网络服务和 Web 应用程序列表。\n- [the-book-of-secret-knowledge](https://github.com/trimstray/the-book-of-secret-knowledge) — 一系列鼓舞人心的列表、手册、备忘单、博客、黑客、单行、cli/web 工具等。\n- [awesome-go](https://github.com/avelino/awesome-go) — Go 框架、库和软件的精选列表。\n- [awesome-dotfiles](https://github.com/webpro/awesome-dotfiles) — dotfiles 文件资源的精选列表。\n- [awesome-actions](https://github.com/sdras/awesome-actions) — 在 GitHub 上使用的精彩 actions 列表。\n- [awesome-redis](https://github.com/JamzyWang/awesome-redis) — 令人惊叹的 redis 和 redis 生态系统资源的精选列表。\n- [awesome-postgres](https://github.com/dhamaniasad/awesome-postgres) — 受 awesome-mysql 启发的精选 PostgreSQL 软件、库、工具和资源列表\n- [awesome-mysql-cn](https://github.com/jobbole/awesome-mysql-cn) — MySQL 资源大全中文版，分析工具、备份、性能测试、配置、部署、GUI 等\n- [awesome-mysql](https://github.com/shlomi-noach/awesome-mysql) — 精选的 MySQL 软件、库、工具和资源列表\n- [awesome-mac](https://github.com/jaywcjlove/awesome-mac) — 收集了各种类别的出色 macOS 软件。\n- [architect-awesome](https://github.com/xingshaocheng/architect-awesome) 后端架构师技术图谱。\n- [Awesome-WSL](https://github.com/sirredbeard/Awesome-WSL) — 适用于 Linux 的 Windows 子系统的精彩列表。\n- [awesome-eslint](https://github.com/dustinspecker/awesome-eslint) — 很棒的 ESLint 插件、配置等列表\n- [awesome-security](https://github.com/sbilly/awesome-security) — 一组很棒的软件、库、文档、书籍、资源和关于安全的材料集合。\n- [awesome-web-security](https://github.com/qazbnm456/awesome-web-security) — 🐶 一份精心策划的 Web 安全材料和资源列表。\n- [awesome-swift](https://github.com/matteocrippa/awesome-swift) — 一份很棒的 Swift 库和资源的合作列表。欢迎投稿!\n- [awesome-macOS](https://github.com/iCHAIT/awesome-macOS) — 一个为 macOS 精心策划的令人敬畏的应用程序、软件、工具和闪亮事物的列表。\n- [awesome-ios](https://github.com/vsouza/awesome-ios) — 一份精选的 iOS 生态系统列表，包括 Objective-C 和 Swift 项目。\n\n## Other\n\n- [996.ICU](https://github.com/996icu/996.ICU)\n- [free-programming-books](https://github.com/EbookFoundation/free-programming-books) — 📚 免费提供的编程书籍。\n- [free-programming-books-zh_CN](https://github.com/justjavac/free-programming-books-zh_CN) — 📚 免费的计算机编程类中文书籍。\n- [CS-Notes](https://github.com/CyC2018/CS-Notes) — 📚 技术面试必备基础知识、Leetcode、计算机操作系统、计算机网络、系统设计。\n- [GitHub-Chinese-Top-Charts](https://github.com/GrowingGit/GitHub-Chinese-Top-Charts) — GitHub 中文排行榜，各语言分设「软件 | 资料」榜单，精准定位中文好项目。各取所需，高效学习。\n- [app-ideas](https://github.com/florinpop17/app-ideas) — 一系列应用程序创意，可用于提高你的编码技能。\n- [build-your-own-x](https://github.com/codecrafters-io/build-your-own-x) — 通过从头开始重新创建你最喜欢的技术来掌握编程。\n- [system-design-primer](https://github.com/donnemartin/system-design-primer) — 学习如何设计大型系统。为系统设计面试做准备。\n- [gitignore](https://github.com/github/gitignore) — 有用的 .gitignore 模板的集合。\n- [gold-miner](https://github.com/xitu/gold-miner) — 🥇 掘金翻译计划，可能是世界最大最好的英译中技术社区，最懂读者和译者的翻译平台。\n- [Google Chrome version history](https://en.wikipedia.org/wiki/Google_Chrome_version_history?source=post_page-----1e7d07966d6c----------------------) — Google Chrome 历史版本。\n- [ruanyf/weekly](https://github.com/ruanyf/weekly) — 阮一峰老师的科技爱好者周刊。\n- [DevDocs](https://devdocs.io/) — 将不同语言、框架和库的 API 汇聚到了一个网页上，你可以直接在一个页面进行搜索。\n- [OverAPI](https://overapi.com/) — 收集所有 API 备忘单。\n- [Public APIs](https://github.com/public-apis/public-apis) — 免费 API 的集合列表。\n- [the-art-of-command-line](https://github.com/jlevy/the-art-of-command-line) — 一页掌握命令行。\n","projects_url":"https://awesome.ecosyste.ms/api/v1/lists/lio-zero%2Ffrontend-focus/projects"}