北京web*端学习时间，2021 年*端学习路线总结

现在web前端也是一个非常热门的行业，想要学习web前端开发的同学请看这里北京web前端学习时间 ，通过对2021 年前端学习路线总结，web学习一周后心得，前端开发需要学多长时间?? 的了解，希望以上信息可以帮助到您

1.2021 年前端学习路线总结

这是在 GitHub 看到一个很不错的前端学习路线图（roadmap），从前端基础到前端工程化，再到跨端，都有知识点的覆盖，非常推荐阅读。图下面是我翻译的一个文字版，可以先看图再看文字。✅ 表示个人推荐学习✳️ 表示可选择学习❇️ 表示不需要严格按照路线的先后顺序，可在任何时间补充这一块的知识❎ 表示个人不再推荐计算机网络掌握计算机网络的基础是一名前端工程师的基本素养，建议先学习以下的知识：✅ Internet 如何工作✅ HTTP 协议✅ 浏览器工作机制✅ DNS 及其运行机制✅ 了解域名、网站托管HTML✅ 学习 HTML 基础，标签、元素、表单验证等等✳️ 语义化标签✳️ 了解 Web 无障碍（）✳️ 学习 SEO 优化CSS✅ 学习 CSS 基础✅ 制作布局：浮动、定位、显示、盒模型、网格布局、弹性布局✅ 响应式设计和媒体查询（@media）✅ 结合 HTML 制作一个简单的网页作为*实践✅ 学习语法和基本结构✅ 学习操作 DOM✅ 学习 Fetch API / Ajax（XHR）✅ ES6+ 和模块化 ✅ 了解变量提升、事件冒泡机制、作用域、原型、Shadow DOM、严格模式等概念版本控制✅ Git 的基本操作✅ 创建账号并且学习使用 GitHub✳️ 创建账号并且学习使用 GitLabWeb 安全知识❇️ HTTPS❇️ 内容安全策略（CSP）❇️ 跨域资源共享❇️ OWASP 安全风险上面的内容是前端最基础的部分，建议多花时间，掌握好每一个知识点。从这开始，将进入前端工程化的部分，你可能会接触到很多种不同的框架，并学习使用多种的工具为自己的开发提效。包管理工具npm 和 yarn 都很好，选择一个学习即可，他们两是相似的✅ npm✳️ yarnCSS 构架通过使用现代的 CSS 框架和 CSS-in-JS 的书写方式，不用再担心 CSS 的构架问题，但熟悉 BEM 规范是一个不错的选择。❇️ BEM，一种书写规范❎ OOCSS❎ SMACSSCSS 预处理器以下三个可选择一个进行学习。❇️ SCSS❇️ PostCSS❇️ Less构建工具任务执行器✅ npm scripts❎ Gulp 代码检查和格式化工具❇️ Prettier 代码格式化❇️ ESLint 代码检查❎ 模块打包 ✅ Webpack✳️ Rollup前端框架前端框架推荐先学习 React，能理解函数式编程和组件化。Vue 的特点是上手快，中文文档齐全，可以选择性的学习。✅ React.js ✅ Redux✳️ MobX✳️ Vue.js VueX✳️ Angular RxJSNgRx现代 CSS✅ Styled Component✅ CSS Module✳️ Styled JSX✳️ Emotion❎ Radium❎ 组件❇️ HTML 模版❇️ 自定义元素❇️ Shadow DOMCSS 框架CSS 框架有两种，一种是基于 框架开发的应用程序。推荐的框架有：✅ ✳️ Material UI✅TailWind CSS（这里和图片不一致，我认为 tailwind 更值得学习）✳️ Chakra UI另外一只是纯 CSS 框架，默认和不和 组件一起使用。✅ BootStrap✳️ CSS✳️ Bulma测试在这里你需要学习使用下面的框架进行单元、集成和功能测试。✅ Jest✅ react-testing-library✅ Cypress✅ Enzyme类型检查器✅✳️ ❎ Flow上面是前端工程化的学习内容，接下来的内容涉及到性能、服务端渲染以及跨端，这一部分前端也叫被称作「大前端」。PWA❇️ 学习 PWA 中使用到的 Web API： Workers 定位通知设备方向支付、证书等等❇️ 计算、测量以及提高性能： PRPL 模式 RAIL 模式性能指标学习使用 学习使用 DevTools服务端渲染✅ Next.js （React.js）✳️ Nuxt.js （Vue.js）✳️ Universal（Angular）❇️ GraphQL✅ Apollo✳️ Relay Modern❇️ 静态网站生成✅ Next.js✅ GatsbyJS✳️ Nuxt.js✳️ Vuepress✳️ JekyII✳️ Hugo❇️ 移动端应用开发✅ ❇️ Flutter❇️ 桌面应用开发✅ Electron✳️ Carlo✳️ Proton Native❇️ 总结完毕，不由得感叹前端生态真是丰富多彩，要学的东西很多，自己不懂的也很多，有些知识点也是浅尝辄止。虽然有这么多的方向，但还是需要找到一个点能够深挖。如果你是前端的初学者，也不要被这些框架给吓到，学好基础然后加以实践更为重要。上面推荐的 Roadmap GitHub 仓库里也有后端以及 DevOps 的学习路线，可以自行浏览，如果有时间我也会整理出一版文字版以供大家参阅。Keep Learning，持续精进。

2.web学习一周后心得

废话：一个阴差阳错的机会，我报名参加了我们学校的一个项目的前端组，因为我现在才大二，对于前端，web开发的知识可谓是空白。但是自己又不想放弃这次机会，怎么办呢？那就学呀，因为项目组有人员限制，所以我们需要考核，并且给我真正学习的时间不足两周，两周内学完html和css，做个b站的仿业可谓艰难。准备阶段 首先，学习前段，我得了解什么是前段，说实话我*次见面会那天我其实对这个概念也不太了解，只有一个模糊的认识，认为前段就是和用户交流的界面，比如网站.... 后来我去csdn论坛里面看到了一篇关于前段后端的区别，感觉有所收获！前端后端的区别（超详细版）_low5252的博客-CSDN博客_前端和后端的区别 了解了前段的概念，那么我就要了解我学前段要学些啥，因为我选的是web开发，所以学长给我推荐了一个慕课，感觉还是挺不错的。Web前端开发_北京林业*_**MOOC(慕课)这里也附上我学长发的一篇知乎文章，里面也有很多干货。怎么才能学好前端？我认为任何一门程序语言，实践是必不可少的，所以一个好的的编译器十分重要，可以让你的工作效率大大提升，编译器我用过记事本，pycharm和sublime Text3，相对而已，这里我推荐sublime，是真的香，那些快捷方式是真的的香！安装软件的教程我是参考了b站的一个视频，感觉讲的挺清楚的sublime及插件安装教程（2021版）_哔哩哔哩 (゜-゜)つロ 干杯~-bilibili学习阶段软件安装后接下来就是学习，我学习的话主要是通过上面的那个慕课，这里我就不做过多的解释，好好学就完事了！回归主题我结合我12月5号的面试来谈谈我的感谢！1.css和html里面的重要标签要熟练掌握，要弄透我面试的时候就有现场编码这一幕，学长就会提一些要求给你并且很喜欢问为什么？原理是啥？可想而知当时我有多自闭？2.要学会举一反三比如层定位有三种方式，你在用fixed的时候你就要想想另外两个，要了解他们的区别3.与时俱进现在前端的发展十分的快，很多种布局方式都在更新，特别是html5发展以后，有些我们所学的东西有点过时了(血泪史）不然就会这样 4.多实践实践出真知.....实践可以让你发现你犯的错误有多蠢5.插件，快捷键真的nb6.学会总结html和css里面的标签，属性又多又杂，学会整理，不然就会web开发从入门到放弃没了，祝看到*的你能有所收获还有，程序猿真的苦逼(இдஇ; )

3.前端开发需要学多长时间

前端开发需要学多长时间？ 假如说零基础学习，那么前端开发一般学习时间在4-6个月左右，要保证每天都学习，每天花三四个小时，需要花半年左右的时间才可；假如只是在工作和其他学习之余来学习前端的话花费的时间则更久。 前端开发学习可以分为五个阶段 *阶段为前端基础，实现动静态网页的开发。 第二阶段为前端进阶，通过项目实战练习，可以电商网站的整站开发。 第三阶段为后端开发，独立开发基于后台接口的动态网站、Ajax数据交互的项目。 第四阶段为移动端开发，以移动APP实战项目为练习。 第五阶段为全栈式开发，以前后端综合项目为实战练习。 什么是Web前端？ 前端开发是网络时代中软件研发不可缺少的角色。从狭义上讲，Web前端就是使用HTML、CSS、等专业技能和工具将产品的UI设计稿实现成网站产品，涵盖用户PC端、移动端等网页，处理视觉和交互问题。 Web前端开发是随着Web的兴起衍生出来的角色。实际上，Web前端是最接近产品和设计的工程师，起到衔接产品和技术的作用，它存在在互联网的每个角落，我们使用的微信里面的各种功能、小程序等都离不开web前端技术。 做一名Web前端工程师需要学习哪些知识？ Web前端所包含的知识模块很多，就目前而言，HTLL、CSS、JS、DOM是目前前端技术最为基础也是最为主要的四大模块，但会随着实际需求而有所改变。 做为一名优秀的web设计师，要具有良好的规范开发习惯；熟悉常用的设计模式，熟练使用Vue、Angular技术栈开发；能够熟练使用angular、vue、echarts、jquery等框架进行传统开发；要熟悉MVVM、MVC开发模式；熟悉前端工程化、自动化技术，可以根据需求配置Gulp文件及更改Webpack配置文件；熟练使用git版本管理工具。 其实，入门前端开发还是比较简单的，也正因为如此，前端开发领域有很多人自学成“才”，但大多数人都停留在会用的阶段，前进的步履艰难。这是因为Web前端技术繁杂多样化，每前进一步都要花费大力气，所以后面的学习提高就颇为艰辛。我组建了一个前端自学团，学习前端技术。在团里，会严格监督大家每天学习打卡，给大家分享学习资料，给大家匹配学习伙伴，定期组织大家进行项目实战。想要加入一起学习的小伙伴可以私信我或是给我留言。作者：爱创链接：前端开发需要学多长时间

看了以上有关2021 年前端学习路线总结，web学习一周后心得，前端开发需要学多长时间??的讲解，如果还有什么疑问可以直接来电咨询