大家好,我是 Chris。
这两年 AI 发展真的太快了,对前端开发领域的冲击非常直接。Chris 做前端将近 10 年,这种变化感受非常明显。从一开始手写各种业务逻辑,到现在 AI 能帮你快速生成代码、搭建项目结构,甚至参与架构设计,开发方式已经发生了本质变化。
现在我基本已经进入一种“Vibe Coding”的状态,开发了两个产品 WiseMindAI 和 ChatTOC。以前我们需要系统学习框架、语言、工程化、架构设计,现在很多事情 AI 都能帮你完成。
WiseMindAI 地址:wisemindai.app/
ChatTOC 地址:chattoc.aichris.cc/
但有一点我相信:越是 AI 强大的时代,越要保持对前沿技术的敏感度
因为你不再只是写代码的人,而是做技术决策的人。
所以今天我整理了一份前端技术信息源,主要是国外的资源,分享给大家,大家可以挑一些来看。
一、综合前端技术网站(基础 + 深度)
1. Smashing Magazine
简介:全球顶级前端与 UX 技术杂志,内容偏深度和实践结合
关键词:CSS / UX / Performance / Accessibility
官网:www.smashingmagazine.com
2. CSS-Tricks
简介:前端经典站点,覆盖 CSS、布局、JS 技巧,非常实用
关键词:CSS / Layout / Tricks
官网:css-tricks.com
3. A List Apart
简介:专注 Web 标准与设计思想,偏理念层和架构层
关键词:Web Standards / UX / Architecture
4. SitePoint
简介:老牌技术社区,从入门到进阶都有系统内容
关键词:HTML / JS / Tutorials
官网:www.sitepoint.com
5. Codrops
简介:偏创意前端,动画、交互、视觉效果灵感库
关键词:Animation / UI / Creative Coding
官网:tympanus.net/codrops
二、前端资讯 / 周刊(趋势)
6. Frontend Focus
简介:最知名的前端周刊之一,每周精选优质内容
关键词:Weekly / Curated / News
官网:frontendfoc.us
7. Frontend Weekly
简介:涵盖 React、Vue、工具链的精选资讯
关键词:Frameworks / Trends / Weekly
官网:www.frontendweekly.co/
8. JavaScript Weekly
简介:JS 生态核心信息源,覆盖新库、新工具、新标准
关键词:JavaScript / Ecosystem
官网:javascriptweekly.com
9. Web Design Weekly
简介:UI、设计与前端趋势结合
关键词:Design / UX / Trends
官网:web-design-weekly.com
10. Bytes Weekly
简介:专注响应式设计与移动端体验
关键词:Responsive / Mobile
官网:bytes.dev/
三、社区 & 实战经验来源
11. DEV Community
简介:开发者社区,更新速度快,很多真实开发经验
关键词:Community / Blog / Dev
官网:dev.to
12. Hashnode
简介:高质量技术博客平台,适合沉淀与输出
关键词:Engineering / Blog
官网:hashnode.com
13. Stack Overflow Blog
简介:偏工程趋势与行业洞察
关键词:Engineering / Trends
官网:stackoverflow.blog
14. Dev.to Frontend Tag
简介:筛选后的前端内容集合
关键词:Frontend / React / JS
官网:dev.to/t/frontend
四、顶级前端专家博客(认知升级)
15. Josh Comeau Blog
简介:交互式教学体验,讲解深入且易懂
关键词:React / CSS / Animation
官网:www.joshwcomeau.com
16. Kent C. Dodds
简介:React 生态核心人物,专注工程实践与 DX
关键词:React / Testing / DX
官网:kentcdodds.com
17. David Walsh Blog
简介:实战技巧型内容,偏问题解决
关键词:JavaScript / CSS
官网:davidwalsh.name
18. CSS Wizardry
简介:CSS 架构与性能优化大师博客
关键词:CSS Architecture / Performance
官网:csswizardry.com
19. Tania Rascia
简介:前端教程与经验总结,适合提升实战能力
关键词:Frontend / Tutorials
官网:www.taniarascia.com
五、进阶学习与官方资源
20. Frontend Masters Blog
简介:偏高级工程能力与系统设计
关键词:Advanced / Engineering
官网:frontendmasters.com/blog
21. GreatFrontEnd
简介:专注前端面试与工程能力训练
关键词:Interview / System Design
官网:www.greatfrontend.com
22. Web.dev
简介:Google 官方前端最佳实践平台
关键词:Performance / PWA
官网:web.dev
23. MDN Web Docs
简介:前端开发权威文档,基础知识体系核心
关键词:Reference / Docs
官网:developer.mozilla.org
写在最后
现在这个时代,最大的变化不是工具变强,而是 你获取信息的方式,决定了你的技术上限。
AI 已经可以帮你写代码、搭项目、甚至做部分设计,但它替代不了你对技术方向的判断。
你需要做的,是不断更新自己的“认知地图”。
最后,欢迎评论区补充~