网站建设服务的会计处理,seo关键词排优化软件,天津网站建设开发,制作照片的软件app文章目录 前端学习路线#xff01;特点符号表大纲前言 - 学编程需要的特质一、前端入门⭐️ 开发工具浏览器编辑器文档笔记 ⭐️ HTML⭐️ CSS⭐️ JavaScript✅ ES6 特性 二、巩固基础前端基础知识计算机基础✅ 算法和数据结构✅ 计算机网络✅ 操作系统 软件开发基础✅ 设计模… 文章目录 前端学习路线特点符号表大纲前言 - 学编程需要的特质一、前端入门⭐️ 开发工具浏览器编辑器文档笔记 ⭐️ HTML⭐️ CSS⭐️ JavaScript✅ ES6 特性 二、巩固基础前端基础知识计算机基础✅ 算法和数据结构✅ 计算机网络✅ 操作系统 软件开发基础✅ 设计模式⭐️ Git 版本控制✅ Linux 服务器✅ 正则表达式 三、前端工程化⭐️ 研发流程⭐️ 代码托管✅ Node.JS⭐️ 包管理开发框架 开发框架⭐️ CSS 框架⭐️ JavaScript 框架⭐️ Vue⭐️ React❌ Angular✅ Svelte✅ UmiJS 封装库⭐️ 组件库数据可视化组件插件工具库动效库字体图标库 ⭐️ 脚手架⭐️ 前端架构设计✅ 服务端渲染BFF✅ 微前端 CSS in JS⭐️ CSS 模块化 ✅ 开发调试内网穿透 ⭐️ CSS 预编译测试测试分类✅ Mock✅ 测试框架 ✅ 代码质量开发规范类型校验代码检查代码风格提交规范提交检查 构建工具自动化构建打包工具 CI / CD部署⭐️ Web 服务器⭐️ Nginx✅ Apache 容器✅ DockerKubernetes 部署策略 监控告警 四、前端优化✅ 性能优化性能指标优化手段 用户体验✅ 兼容性浏览器兼容性屏幕分辨率兼容性跨平台兼容性 SEO✅ 安全 五、前端生态⭐️ 静态站点构建开发博客文档 ✅ 大前端移动应用移动应用打包桌面应用小程序跨端开发框架移动端调试 ✅ Serverless✅ 云开发低代码 六、前端求职流程简历面试题库面经面试实战 七、前端未来WebComponents 我的前端学习路线1. 快速入门培养兴趣2. 多看多写巩固基础3. 框架学习学以致用4. 根据需要自主学习5. 渐入佳境拓宽视野6. 总结 尾声 - 持续学习优秀前端人的特质学习 资源前端资讯技术博客学习要点 前端学习路线 这份学习路线并不完美也不会有最终形态正如前端不可预见、永无止境的未来。 特点
一份全面的前端知识点大梳理和汇总分阶段学习每个阶段给出学习目标使用符号对知识点的重要程度做了区分按需学习知识点附有描述和资源链接提供一份清晰的个人顺序学习路线方法提供大量优质学习资源
符号表
可根据知识点前的符号按需选学并获取知识点描述和学习资源。
⭐️ 必学追求速成✅ 建议学重要知识❗ 面试重点❌ 一般没必要学习 描述 资源 目标
大纲 前言 - 学编程需要的特质 前端学习七阶段 前端入门巩固基础前端工程化前端优化前端生态前端求职前端未来 我的前端学习路线 尾声 - 持续学习
前言 - 学编程需要的特质
相信自己有能力那么你就真的会有
兴趣坚持付出心态
一、前端入门 描述学习前端基础三件套建议从实战开始边学边练培养兴趣快速入门。 资源 freeCodecamp 在线编程https://learn.freecodecamp.one/阿里云前端实战学习https://edu.aliyun.com/roadmap/frontendW3Cschool 编程入门实战https://www.w3cschool.cn/codecamp/pink老师前端入门教程https://www.bilibili.com/video/BV14J4114768 目标了解和实践各语言的基础语法并能使用开发工具来独立开发一个留言板网站。
⭐️ 开发工具 描述工欲善其事必先利其器。
浏览器
⭐️ Chrome✅ Edge✅ Firefox❌ OperaSafari
编辑器
⭐️ VSCode✅ WebStormAtom⭐️ Sublime TextHBuilder X记事本在线 IDE
文档笔记 ✅ Markdown 语法 ✅ Typora 在线笔记 语雀腾讯文档石墨文档印象笔记 Mdnice
⭐️ HTML 描述用于定义一个网页结构的基本技术。 资源https://developer.mozilla.org/zh-CN/docs/Learn/HTML ⭐️ 基本语法 ⭐️ 标签 分区 div标题 h1 ~ h6段落 p图像 img列表 ul / ol超链接 a表单 form表格 table框架 iframe ⭐️ 属性 ✅ HTML5 特性 localStoragesessionStorage❌ Web SQL语义化标签浏览器支持多媒体标签Canvas 画布❌ 内联 SVG本地存储Web Workers应用缓存Cache Manifest无障碍
⭐️ CSS 描述层叠样式表用于设计风格和布局。 资源https://developer.mozilla.org/zh-CN/docs/Learn/CSS ⭐️ 基本语法 ⭐️ 引入方式 行内样式内部样式表外部样式表 ⭐️ 选择器 后代选择器子元素选择器相邻兄弟选择器通用选择器标签选择器id 选择器class 选择器属性选择器派生选择器组合选择器伪选择器选择器优先级 ⭐️ 属性 pxemremvwvh单位背景文本字体列表表格 ⭐️ 文档流 标准流浮动流定位流 ⭐️ 内联元素 / 块状元素 ⭐️ 盒子模型 contentpaddingbordermargin ⭐️ 浮动 设置浮动 float清除浮动 clear ⭐️ 定位 staticabsolutefixedrelativesticky ⭐️ 层叠规则 ❗ BFC 和 IFC 机制 CSS3 媒体查询Flex 布局Grid 布局瀑布流⭐️ 响应式布局动画过渡渐变背景边框圆角字体2D / 3D 转换
⭐️ JavaScript 描述具有函数优先的轻量级解释型或即时编译型的编程语言。 资源https://developer.mozilla.org/zh-CN/docs/Web/JavaScript ⭐️ 基本语法 ⭐️ 数据类型 对象 Object数组 Array函数 Function字符串 String数组 Number布尔 Boolean空值 Null未定义 UndefinedSymbol值类型引用类型 ✅ 数据类型转换 ✅ 函数 ⭐️ 全局调用构造函数调用⭐️ 函数方法调用applycall⭐️ 概念⭐️ 自定义函数调用方式✅❗ 闭包 ✅ 对象 数字 Number字符串 String 对象日期 Date 对象数组 Array布尔 Boolean算数 Math概念this原型链和继承常用对象自定义对象 ✅❗ 作用域作用域链 ✅ BOM API ⭐️ DOM API ⭐️ JSON ⭐️ Ajax ✅ JavaScript 执行机制
✅ ES6 特性 描述新引入的 JavaScript 语法特性。 资源ES6 入门教程 https://es6.ruanyifeng.com/let 和 const变量解构赋值对象扩展和新增方法SymbolSet 和 Map 数据结构⭐️❗ Promise async / await 异步编程Generator 函数异步编程
二、巩固基础 描述学习前端、计算机、软件开发相关基础知识并复习巩固上阶段学到的前端三件套。 资源 《JavaScript 高级程序设计》https://www.code-nav.cn/rd/?rid28ee4e3e606b1e1a0e3cfd8952d172cf《JavaScript 忍者秘籍》https://www.code-nav.cn/rd/?rid28ee4e3e606b16c00e3c5b18609e3dc2 目标熟悉前端三件套语法尤其是 JavaScript并了解互联网、域名、浏览器、服务器等扎实前端程序员的基本功为下面进入实战开发做准备。
前端基础知识 ✅ 互联网 ⭐️ 域名 ⭐️ DNS ⭐️ 服务器 ✅ 浏览器 浏览器 DOM 事件流 / 事件委托⭐️ 浏览器加载顺序⭐️ 浏览器渲染过程浏览器事件循环浏览器同源策略❗ 跨域解决方案浏览器缓存控制台调试技巧 ✅ HTTP 1xx 信息2xx 成功3xx 重定向4xx 客户端错误5xx 服务器错误HTTP 1.0⭐️ HTTP 1.1HTTP 2HTTP 3❗ HTTP 请求过程常见 HTTP 协议⭐️ HTTP 请求类别⭐️ 常见状态码WebSocket⭐️ CookieSession⭐️ HTTPS
计算机基础
✅ 算法和数据结构 ⭐️ 时间 / 空间复杂度分析 数据结构 数组字符串队列栈链表集合哈希表二叉树 算法 排序双指针查找分治动态规划递归回溯贪心位运算DFSBFS图
✅ 计算机网络
HTTP 协议网络模型UDP / TCP 协议
✅ 操作系统
进程、线程进程 / 线程间通讯方式进程调度算法进程 / 线程状态死锁内存管理
软件开发基础
✅ 设计模式
单例模式代理模式工厂模式装饰者模式观察者模式策略模式门面模式
⭐️ Git 版本控制
常用命令
✅ Linux 服务器
常用命令
✅ 正则表达式
三、前端工程化 描述前端工程化是使用软件工程的技术和方法来进行前端的开发流程、技术、工具、经验等规范化、标准化其主要目的为了提高开发过程中的开发效率减少不必要的重复工作时间。 资源 什么是前端工程化https://www.zhihu.com/question/433854153/answer/1713597311 目标至少学会一门主流的前端开发框架Vue / React并配合脚手架、组件库、工具等从 0 开始独立搭建并开发一个完整的前端网站可以试着仿一些知名站点。要求遵循企业开发规范将项目代码提交到代码仓库中并独立发布上线供他人访问。此外建议抓住机会参与一些团队项目感受团队开发模式和前端工程化的优势。
⭐️ 研发流程
技术选型初始化开发本地测试代码提交编译、打包、构建部署集成测试发布上线监控运维
⭐️ 代码托管 描述集中存储、备份你的代码还能和团队成员协作开发。⭐️ GitHubGiteeGitLab
✅ Node.JS 描述一个开源与跨平台的 JavaScript 运行时环境。它是一个可用于几乎任何项目的流行工具 资源 Node.js 官方教程http://nodejs.cn/learnNode.js 入门https://cnodejs.org/getstart
⭐️ 包管理 描述用于安装 Node.js 的扩展、工具等。⭐️ npm⭐️ yarn❌ bower✅ npx
开发框架
ExpressKoaEgg
开发框架 描述解决特定的问题,提高开发效率、简化我们的代码复杂度。
⭐️ CSS 框架
✅ BootStrap⭐️ Tailwind CSS
⭐️ JavaScript 框架
⭐️ Vue
Vue RouterVuex
⭐️ React
React DOMReact RouterReduxMobXReact Hooks
❌ Angular
RxJSNgRx
✅ Svelte
✅ UmiJS
封装库
⭐️ 组件库
✅ LayUI⭐️ ElementUIVue✅ VantUIVue⭐️ Ant DesignReactMaterial UI
数据可视化
✅ AntVApache EChartsHighChartsD3.js
组件插件
富文本编辑器弹窗轮播图
工具库
✅ jQuery✅ Lodash✅ Axios时间处理 Moment.js
动效库
✅ Animate.cssAnt Motion
字体图标库
⭐️ IconFontIconParkFont Awesome
⭐️ 脚手架 描述快速生成新项目的目录模板提升开发效率和开发舒适性。 资源https://www.jianshu.com/p/25ce8cf2e6a7Vue CLIcreate-react-app✅ Yeoman
⭐️ 前端架构设计 描述一系列工具和流程的集合旨在提升前端代码的质量并实现高效可持续的工作流。模块化组件化✅ MVVM设计原则⭐️ SPA 单页应用⭐️ 多页应用✅ 前端路由PWA有损服务
✅ 服务端渲染 描述在服务端渲染 HTML 页面的模式。 资源https://www.zhihu.com/question/379563505Next.jsReactNuxt.jsVue❌ UniversalAngular
BFF 描述Backend For Frontend服务于前端的后端就是服务器设计 API 时会考虑前端的使用并在服务端直接进行业务逻辑的处理。 资源https://www.jianshu.com/p/eb1875c62ad3GraphQL
✅ 微前端 描述将前端应用分解成一些更小、更简单的能够独立开发、测试、部署的小块从而解决庞大的一整块后端服务带来的变更与扩展方面的限制。 资源https://zhuanlan.zhihu.com/p/96464401qiankunsingle-spa
CSS in JS 描述用 JavaScript 来写 CSS。 资源http://www.ruanyifeng.com/blog/2017/04/css_in_js.html内联样式声明样式引入样式
⭐️ CSS 模块化
⭐️ CSS Modules✅ styled-components✅ Styled JSXEmotion
✅ 开发调试 描述本地开发时热更新提升开发效率。webpack-dev-serverserve
内网穿透 描述将内网外网通过 nat 隧道打通让内网的网站、数据让外网可以访问。NgrokNATAPP
⭐️ CSS 预编译 描述使用新的扩展语言以增强 CSS 的能力并通过预编译的方式将其转换为浏览器认识的 CSS 代码。⭐️ SASS✅ PostCSSStylus❌ LESS
测试
测试分类
⭐️ UT 单元测试SIT 系统集成测试E2E 端到端测试UAT 用户验收测试
✅ Mock 描述通过随机数据模拟各种场景增加单元测试的真实性。Mock.js
✅ 测试框架
✅ JestEnzyme✅ PuppeteerHeadless BrowserMochaJasmine
✅ 代码质量
开发规范 描述依照规范写出的代码会更加合理。 资源Airbnb 代码规范 https://github.com/BingKui/javascript-zhCSS Style GuideJavaScript Style Guide
类型校验
TypeScript
代码检查
ESLintStyleLint
代码风格 描述根据配置自动格式化代码统一格式。Prettier
提交规范
约定式提交
提交检查 描述在提交代码时触发一些操作比如检查代码的风格等。pre-commithusky
构建工具
自动化构建 描述按照配置好的流程自动打包构建项目提高团队的开发效率降低项目的维护难度。Gulp✅ npm scriptGrunt
打包工具 描述将各种零散的 资源文件打包为可在浏览器等环境运行的代码。⭐️ Webpack✅ Rollup✅ ViteParcelSnowpack
CI / CD 描述通过在应用开发阶段引入自动化来频繁向客户交付应用。GitLab CI✅ Jenkins
部署
⭐️ Web 服务器
⭐️ Nginx 描述高性能的 HTTP 和反向代理 web 服务器。 资源腾讯云动手实验室 https://cloud.tencent.com/developer/labs/gallery反向代理解决跨域改写请求
✅ Apache
容器
✅ Docker 描述容器是一个标准化的软件单元它将代码及其所有依赖关系打包以便应用程序从一个计算环境可靠快速地运行到另一个计算环境。Docker容器镜像是一个轻量的独立的可执行的软件包。包含程序运行的时候所需的一切代码运行时间系统工具系统库和设置。 资源Docker 从入门到实践 https://vuepress.mirror.docker-practice.com/Dockerfile
Kubernetes
部署策略
全量发布蓝绿部署滚动发布灰度发布
监控告警
前端埋点错误监控性能监控行为监控
四、前端优化 描述通过分析和优化手段提高网站的性能和用户体验。 目标实践前端优化方法从多个方面优化自己做过的项目最好能将优化后的网站与原网站进行对比得到一些数据和体验上的明显提升。
✅ 性能优化
性能指标 描述用于衡量一个 Web 页面的性能。 资源https://juejin.cn/post/6844904153869713416 FPFirst Paint 描述从开始加载到浏览器首次绘制像素到屏幕上的时间也就是页面在屏幕上首次发生视觉变化的时间。 FCPFirst Contentful Paint 描述浏览器首次绘制来自 DOM 的内容的时间。 FMPFirst Meaningful Paint 描述页面的主要内容绘制到屏幕上的时间。 FSPFirst Screen Paint 描述页面从开始加载到首屏内容全部绘制完成的时间用户可以看到首屏的全部内容。 TTITime to Interactive 描述表示网页第一次完全达到可交互状态的时间点浏览器已经可以持续性的响应用户的输入。
优化手段 性能监控 Performance API 样式优化 JavaScript 优化 防抖节流 代码分割 资源压缩 打包优化 服务器优化 缓存优化 Service Worker 动画性能 dns-prefetch Lazy loading 优化启动性能 异步化 渲染优化 网络优化 移动端性能优化 ✅ CDN 描述内容分发网络是构建在现有网络基础之上的智能虚拟网络依靠部署在各地的边缘服务器通过中心平台的负载均衡、内容分发、调度等功能模块使用户就近获取所需内容降低网络拥塞提高用户访问响应速度和命中率。 资源BootCDN https://www.bootcdn.cn/
用户体验
设计系统骨架屏
✅ 兼容性
浏览器兼容性
normalize.csshtml5shiv.jsrespond.jsBabelPolyfill
屏幕分辨率兼容性
跨平台兼容性
SEO 描述搜索引擎优化利用搜索引擎的规则提高网站在有关搜索引擎内的自然排名。 资源百度搜索 资源平台 https://ziyuan.baidu.com/cooperateresource/indexrobots.txtdescriptionkeywordsSiteMapHTML 标签优化站内链接建设友情链接
✅ 安全
⭐️ XSSCSRF反爬虫SQL 注入DDoS
五、前端生态 描述如今前端领域的范围越来越广出现了更多前端工程师需要了解和关注的技术。 目标能用学到的前端技术去做更多的事情比如开发个人博客、文档网站、小程序、APP 等。
⭐️ 静态站点构建
开发
React Static
博客
✅ Gatsby.js✅ DocusaurusHugoHexo
文档
JekyII⭐️ DocsifyVuePress✅ Dumi
✅ 大前端 描述前端技术的融合更加紧密应用的领域也更加广泛前端领域的内容呈现多样化除了网站外还可以用前端技术跨平台开发 Android、iOS、小程序、虚拟现实、增强现实等。
移动应用
HybridWebViewReact NativeFlutter
移动应用打包
WeexCordovaPhonegapIonic
桌面应用
ElectronNW.jsProton Native
小程序
原生WebView
跨端开发框架
✅ uni-app✅ TaroFlutterChameleonWepyRax
移动端调试
Chrome Dev ToolsAndroid SimulatorIOS Simulator
✅ Serverless 描述一种构建和管理基于微服务架构的完整流程允许你在服务部署级别而不是服务器部署级别来管理你的应用部署你甚至可以管理某个具体功能或端口的部署这就能让开发者快速迭代更快速地开发软件。
✅ 云开发 描述云端一体化的后端云服务 采用 Serverless 架构免去了移动应用构建中繁琐的服务器搭建和运维。同时云开发提供的静态托管、命令行工具CLI、Flutter SDK 等能力降低了应用开发的门槛。使用云开发可以构建完整的小程序/小游戏、H5、Web、移动 App 等应用。✅ 腾讯云云开发阿里云云开发
低代码 描述无需编码零代码或通过少量代码就可以快速生成应用程序的开发平台。通过可视化进行应用程序开发的方法使具有不同经验水平的开发人员可以通过图形化的用户界面使用拖拽组件和模型驱动的逻辑来创建网页和移动应用程序。腾讯云低码阿里宜搭
六、前端求职 描述求职是一个漫长的过程建议拉长战线尽早准备。 目标找到理想的工作。
流程
2020 秋招面经汇总https://www.nowcoder.com/discuss/205497
简历
超级简历
面试题库
牛客前端工程师面试宝典https://www.nowcoder.com/tutorial/96/f5212664ab664984882b00635066ded2前端面试每日 31https://github.com/haizlin/fe-interviewReact 面试题目 题解https://github.com/sudheerj/reactjs-interview-questions
面经
前端面经汇总https://www.nowcoder.com/discuss/experience?tagId644
面试实战
AI 模拟面试https://www.nowcoder.com/interview/ai/cover?jobTagId644
七、前端未来 描述前端未来可能的发展趋势和热门技术。 目标关注前沿持续进步。WebAssembly智能 UIReact Server ComponentCSS Houdini
WebComponents
HTML templatesHTML模板Custom elements自定义元素Shadow DOM影子DOM
我的前端学习路线
虽然上面整理的学习路线知识点非常多但是大家也别太担心其实按照一定顺序和方法来学习并不会很难聊聊我的学习经历。
1. 快速入门培养兴趣
刚开始学习前端时一定要以培养兴趣、快速入门为 目标。我入门前端时由于没有基础、啥都不懂因此选择在线实战教程网站来学习跟着教程案例一行行把代码敲下来实时浏览显示效果很轻松地就把 HTML、CSS、JavaScript 的语法基础过了一遍。但是这时我对看过的知识点没有什么印象基本是看了就忘当我想要自己写一个网站也根本无从下手。
于是我开始试着死记硬背代码结果发现背了之后还是不会写。那干脆一不做二不休直接打开编辑器和教程网站把之前在线实战时敲过的代码复制粘贴到编辑器中然后再修改保存到浏览器中打开文件。这样虽然要在编辑器和浏览器中来回切换但起码能看到自己的网页文件运行的效果了。后来我利用浏览器开发者工具提升了自己开发网站的调试效率敲出的代码达不到满意的效果时就再去查再改再浏览最后终于完成了一个留言板网站
通过这件事我明白了一个道理既然记不住知识那就先别强行记忆上手多写忘了就去查不就好了不要担心自己知识不够做不出来只要你去试都一定能实现。
2. 多看多写巩固基础
在这种操作下我虽然能使用基础三件套开发简易网站了但做的很慢还老出问题。于是我开始完整地看了几本前端入门和项目实战书籍有三件套入门的也有响应式网站设计的还有 JavaScript 综合讲解的以及一套完整的视频教程通过这些来复习巩固之前学过的知识打好了基础并且了解了更多实战教程上没见到的知识。
看书和视频的过程中我跟着做了几个简易的网站也是边看边做。在这之后我发现自己渐渐地能够脱离文档来写网站了
3. 框架学习学以致用
但是总感觉开发网站时什么都要自己写重复的代码写一大堆很麻烦。于是我试着上网搜了解决这些问题的方法发现可以用组件库减少重复编写 HTML 和 CSS 代码于是学了 LayUI其实和之前一样的就是打开官网找到要用的组件然后复制到项目中修改就行了写的多了竟然还真记住了一些虽然这个没必要记。
界面和样式代码简化了但是 JavaScript 写的我依旧头疼。于是我决定进入下一个阶段的学习当时先看了本书叫《锋利的 jQuery》来学习 jQuery学会之后使用它趁热打铁做了几个网站发现的确能大大简化繁琐的 JavaScript DOM 操作让我尝到了甜头又有了继续学习前端的动力。
在那之后大概半年我开始学习主流前端框架 Vue也是跟着视频教程学并且结合 ElementUI 组件库开发了一个响应式网站。不得不说习惯了用原生 JavaScript 和 jQuery 开发后再去用 Vue 开发真的是爽飞了小有成就感。
4. 根据需要自主学习
在那之后我就是通过不断地做项目来积累经验既然编程知识太多学不完那我就随需随学逐渐拓宽自己的知识面。举个例子我要做一个移动端 H5 页面那就去搜 Vue 的移动端组件库学会了 MintUI、VantUI 等项目中要处理日期那我就去搜日期处理库学会了 Moment.js项目重复文件和代码太多我就去网上搜一些组件化、模块化的最佳实践项目代码太大、加载太慢我就去网上搜一些前端压缩、性能优化的方式要把开发好的项目变成 APP那我就去网上搜到了 Cordova 等打包工具跟其他同学一起做项目时比较混乱、开发效率低我就去搜了一些代码规范、前端工程化等遇到 Bug 时也是自己去网上搜索解决方案并且还要看看有没有知识点是我遗漏的我会再去弥补学习。通过不断实践、不断遇到问题和自主解决问题我始终保持着学习的积极性学到了越来越多前端的知识并通过归纳总结来加深印象。
5. 渐入佳境拓宽视野
在那之后我学前端技术非常快了。此外我不仅仅关注前端网页开发本身还同时关注前端的生态和发展学习了微前端、Serverless、云开发、低代码等技术因此个人的能力提升也很大。如今在工作中也是面对各种不同技术栈的前端项目我都能迎难而上毕竟不会就学嘛
6. 总结
总结一下学前端的路线其实就一句话基础三件套 巩固基础 学习框架 多做项目 按需学习 拓宽视野。还有一个学任何编程技术都要注意的点全程多敲代码多敲代码多敲代码
尾声 - 持续学习
优秀前端人的特质
深厚的功底良好的编码习惯发现问题的洞察力思维灵活善于思考追求技术紧跟前沿有创造力有行动力追求用户体验时刻保持好奇全栈意识解决问题的能力强懂得合作和高效沟通重视工作同样重视生活责任心和全局观个人的进步能带动团队的进步
学习 资源
编程导航包含以下所有 资源强烈推荐 https://www.code-nav.cnfreeCodecamp 在线编程https://learn.freecodecamp.one/阿里云前端实战学习https://edu.aliyun.com/roadmap/frontendW3Cschool 编程入门实战https://www.w3cschool.cn/codecamp/腾讯云动手实验室https://cloud.tencent.com/developer/labs/gallerypink老师前端入门教程https://www.bilibili.com/video/BV14J4114768MDN 前端文档https://developer.mozilla.org/zh-CNNode.js 入门https://cnodejs.org/getstart前端清单https://cheatsheets.devtool.tech/前端小课https://lefex.github.io/被删的前端游乐场http://www.godbasin.com/《ES6 入门教程》https://es6.ruanyifeng.com/谷歌 Web 开发者https://developers.google.com/webJavaScript 明星项目https://risingstars.js.org/2020/zhBest of JShttps://bestofjs.org/Codewarshttps://www.codewars.com/?languagejavascriptVue.js exampleshttps://vuejsexamples.com/
前端资讯
掘金资讯https://juejin.cn/newsInfoQhttps://www.infoq.cn/topic/Front-enddaily.devhttps://daily.dev/
技术博客
掘金https://juejin.cn/frontend腾讯前端 IMWEBhttp://imweb.io腾讯 Web 前端团队 Alloy Teamhttp://www.alloyteam.com淘宝前端团队http://taobaofed.org百度 Web 前端研发部http://fex.baidu.com京东凹凸实验室https://aotu.io360 奇舞团https://75team.com七牛团队技术博客http://blog.qiniu.com有赞技术团队https://tech.youzan.com/tag/front-end/百度 EFE Techhttps://efe.baidu.com/css-trickshttps://css-tricks.com/archivesweb.devhttps://web.dev/blog/
学习要点 前期学习以培养兴趣为主不要过于追求深层理解。 前端学习不能靠死记硬背要多敲代码、多做项目实践。 不要急于求成踏实积累才是硬道理。
