⭐前端好站导航

综合

• 全栈公开课 https://fullstackopen.com/zh/
• 带你入门前端工程 https://github.com/woai3c/introduction-to-front-end-engineering
• Web Browser Engineering https://browser.engineering/
• frontend-dev-bookmarks https://github.com/dypsilon/frontend-dev-bookmarks
• web.dev https://web.dev/

工具

• 代码块图片 https://carbon.now.sh/
• 转webp https://anywebp.com/
• 图片压缩 https://tool.tanpok.com/
• public-api-lists https://github.com/public-api-lists/public-api-lists
• free-api https://github.com/fangzesheng/free-api
• 绘图 https://www.tldraw.com/
• excalidraw https://tilipa.zlsam.com/#/tool?id=207
• excalideck https://excalideck.com/
• ast https://astexplorer.net/
• DeepL 翻译器 https://www.deepl.com/translator
• 开发者武器库 https://devtool.tech/
• 图片压缩 https://github.com/antonreshetov/image-optimizer
• 图片转svg https://github.com/visioncortex/vtracer
• 代码分析工具 https://analysis-tools.dev/
• 变量命名 https://unbug.github.io/codelf/

CSS

• CSS属性演示 https://cssreference.io/
• CSS参考手册 http://css.doyoe.com/
• Beautifully simple click-to-copy CSS effects https://github.com/jolaleye/cssfx
• CSS 资源大全中文版 https://github.com/jobbole/awesome-css-cn
• CSS 的灵感 https://github.com/chokcoco/CSS-Inspiration
• 30秒 CSS 中文版 http://caibaojian.com/30-seconds-of-css/
• 常用的 CSS 样式 https://github.com/QiShaoXuan/css_tricks
• You-need-to-know-css https://github.com/l-hammer/You-need-to-know-css
• CSS 专业技巧 https://github.com/AllThingsSmitty/css-protips
• flex游戏 https://flexboxfroggy.com/
• 开源数据可视化工具列表 https://awesome.cube.dev/
• grid布局生成器 https://grid.layoutit.com/
• 在线调试CSS工具 https://animista.net/
• hover.css https://github.com/IanLunn/Hover
• animate.css https://animate.style/
• magic css https://www.minimamente.com/project/magic/
• 阴影生成器 https://www.minimamente.com/cssboxshadow/
• 渐变生成器 https://www.minimamente.com/example/gradient-generator/
• 阴影生成器 https://neumorphism.io/
• css shake https://github.com/elrumordelaluz/csshake
• css实现提示 https://kushagra.dev/lab/hint/
• 随机颜色 https://colorspark.app/
• 生成不规则的矩形 https://9elements.github.io/fancy-border-radius/
• 字体大小 https://type-scale.com/

JS

• ES5 标准 https://www.w3.org/html/ig/zh/wiki/ES5
• ES5 标准 http://lzw.me/pages/ecmascript/
• JavaScript 30 Day Challenge https://github.com/wesbos/JavaScript30
• JavaScript开发者应懂的33个概念 https://github.com/stephentian/33-js-concepts
• 50 Projects in 50 Days https://github.com/bradtraversy/50projects50days
• JavaScript single line of code https://github.com/1milligram/1loc
• JavaScript questions https://github.com/saviomartin/slickr
• JavaScript资源大全 https://github.com/jobbole/awesome-javascript-cn
• 设计模式 https://designpatternsgame.com/patterns
• promise游戏 https://bevacqua.github.io/promisees/
• jschallenger https://www.jschallenger.com/

前端实践

• Learning Patterns https://www.patterns.dev/
• clean-code-javascript https://github.com/alivebao/clean-code-js
• 30 seconds of code https://www.30secondsofcode.org/
• node最佳实践列表 https://github.com/goldbergyoni/nodebestpractices

前端代码规范

• 阿里 https://w3ctim.com/post/1d821dd8.html
• 腾讯代码安全指南 https://github.com/Tencent/secguide
• codeguide https://codeguide.bootcss.com/
• Airbnb规范 https://github.com/lin-123/javascript

前端面试

• 前端知识每日3+1 https://github.com/haizlin/fe-interview

正则

• 正则大全 https://github.com/any86/any-rule
• 逐步学习正则表达式 regexlearn.com
• https://regexper.com/
• https://regexr-cn.com/
• https://jex.im/regulex/
• https://regex101.com/

个人博客

• 冴羽的博客 https://github.com/mqyqingfeng/Blog
• 前端修炼小册 https://github.com/wenyuan/fedbook
• 前端内参 https://github.com/coffe1891/frontend-hard-mode-interview/
• 前端指南 https://github.com/seognil/fe-foundation
• 不知非攻 https://www.yuque.com/coreadvance
• yck前端进阶之道 https://github.com/KieSun/Dream
• ssh的博客 https://github.com/sl1673495/blogs
• web全栈体系 https://github.com/hejialianghe/Senior-FrontEnd
• 剑指前端offer https://febook.hzfe.org/awesome-interview/
• 被删的前端游乐场 http://www.godbasin.com/
• Jian‘s blog https://www.wangjxk.top/
• limei https://limeii.github.io/
• 热血难凉 https://github.com/NLRX-WJC/Blog

书籍

• 现代javascript教程 https://zh.javascript.info/
• JavaScript 编程精解 中文第三版 https://wizardforcel.gitbooks.io/eloquent-js-3e/content/
• Javascript20周年 https://cn.history.js.org/
• 阮一峰 JavaScript https://wangdoc.com/javascript/
• 阮一峰 ES6 https://wangdoc.com/es6/
• 深入浅出webpack http://webpack.wuhaolin.cn/
• JavaScript Promise迷你书 http://liubin.org/promises-book/
• Javascript权威指南第7版 https://js.2019919.xyz/index.html

Vue

• Vue 技术内幕 http://caibaojian.com/vue-design/
• Vue.js 技术解密 https://ustbhuangyi.github.io/vue-analysis/
• vue-patterns-cn https://github.com/ZYSzys/vue-patterns-cn

React

• React 小书 https://hyf.js.org/react-naive-book/
• 全栈潇晨 https://xiaochen1024.com/
• 深入浅出 React Hooks developer.aliyun.com

CS

• 编程之法：面试和算法心得 https://github.com/julycoding/The-Art-Of-Programming-By-July
• 对开发人员有用的定律、理论、原则和模式 https://github.com/nusr/hacker-laws-zh)
• 计算机体系结构基础 https://github.com/foxsen/archbase

有意思

• 交互式学习工具列表 https://markodenic.com/interactive-learning-tools/
• 任意内容转化为 HTML 复选框 https://github.com/bryanbraun/checkboxland
• 基于 GitHub API 开发的图床神器 https://github.com/XPoet/picx
• online-java-to-javascript-converter https://kalkicode.com/ai/online-java-to-javascript-converter
• App Ideas Collection https://github.com/florinpop17/app-ideas
• 支持多家云存储驱动的公有云文件系统 https://github.com/cloudreve/Cloudreve
• 绝妙的个人生产力 https://github.com/eastlakeside/awesome-productivity-cn
• 将Markdown可视化为脑图 GitHub地址 https://github.com/gera2ld/markmap)
• 随机创建漂亮的网站布局 https://shuffle.dev/setup#shuffle
• 为程序员编写的英语学习指南 https://github.com/yujiangshui/A-Programmers-Guide-to-English
• 学习路线 https://reallyconfused.co/

国内前端团队