计算机专业的学生如何系统学习前台技术？

前台相较于后台语言而言较为好学，学习成果易见，学起来也更能体会到成就感。

这里我整理了一下前台学习线路，希望对你有帮助。

打开连尚头条，看更多新鲜猛料

1.HTML5+CSS3

PC端网站布局：

理解常用浏览器和浏览器内核;

理解语义化的概念;

掌握HTML5语法及使用技巧;

掌握HTML5常用标签。

掌握CSS语法及使用技巧;

掌握DIV+CSS布局方式;

掌握常见网页布局模式。

掌握Photoshop切图以及播件切图;

能够熟练使用开发人员工具进行页面调试

能够根据PSD文件独立完成静态页面的开发工作。

WebApp页面布局：

掌握HTML5新布局标签、多媒体标签;

掌握CSS32D.3D变换、动画效果;

能够使用CSS3新属性美化修饰网页;

理解手机端屏幕、手机端浏览器、操作系统的不同。

掌握常用手机端调试方法;

掌握常用手机端适配方法;

掌握CSS预解决器less的使用;

掌握常用手机端框架使用方法;

掌握常见手机端页面开发;

掌握响应式布局开发;

掌握Bootstrap开发响应式页面;

掌握适配不同终端的网页开发技术选型。

阶段学习成果检测，完成PC端商城页面布局，完成手机端页面布局

2.JS交互设计

JavaScript基础-进阶-高级：

能够掌握JavaScript基本语法;

掌握常见JavaScript算法;

掌握DOM的各种操作;

熟练使用面向对象思想进行DOM编程;

掌握JavaScript的高级语法;

掌握JavaScript常见兼容性方案。

独立完成视频网站的页面搭建(包括HTML结构、CSS样式、 JavaScript 特效);

掌握应对业务编程的能力;

掌握团队合作开发流程。

JQuery

熟练使用jQuery操作DOM ;

熟练使用和编写jQuery案例。

阶段学习成果检测，完成视频类目网站布局、交互、封装、性能优化等等

3.Node开发

ECMAScript6

理解ES6和JS的关系;

掌握ES6的基础用法和兼容性;

熟练掌握ES6的核心语法;

熟练使用ES6实现前台模块化开发。

WebPack模块打包器

熟练使用Webpack模块打包器;

熟练掌握前台自动化工具;

Node基础、Express框架、前台模块化、MongoDB

能够建立用户端服务器交互模型，

熟习网络通信相关概念;

能够使用Nodejs进行Web服务端开发;

能够掌握JavaScript异步编程模型;

能够掌握JavaScript模块化编程方式;

能够使用Nodejs操作MongoDB数据库;

能够了解HTTP协议;

能够独立开发基于后端接口的动态网站、Ajax 数据交互的项目;

能够独立完成企业网站从前端到后端的基本开发工作。

阶段学习成果检测，完成即时聊天系统

4.前台框架

数据可视化、Vue、React

能够掌握JavaScript基本语法;

掌握常见JavaScript算法;

掌握DOM的各种操作;

熟练使用面向对象思想进行DOM编程;

掌握JavaScript的高级语法;

掌握JavaScript常见兼容性方案。

Angular

掌握Angular常用的指令

掌握如何定义和使用模块与组件

掌握路由的配置

阶段学习成果检测，完成商城后端管理系统、电商网站注册登录、订单管理、条件挑选等等功能

5.小程序与APP开发

微信小程序开发

能够掌握小程序的开发基础;

能够独立开发小程序项目;

能够掌握Canvas的使用;

能够掌握小程序的部署与发布;

能够掌握小程序开发框架mpwue的使用;

掌握第三方AI平台的使用。

微信小游戏开发

能够掌握小游戏开发基础;

能够独立开发小游戏项目;

能够掌握小游戏的部署与发布;

掌握第三方AI平台的使用。

React Native

能够独立使用React Native开发原生APP ;

阶段学习成果检测，完成微信小程序开发、微信小游戏开发、原生APP开发

6.就业准备

简历编辑

面试礼仪

面试常见题

面试演练等等

最后，前台是一个不断学习的过程，学到这里，并不是结束，而是在这个行业刚刚起步，想要学习更多的前台内容，需要在工作中不断学习、积累、成长。

俗话说，不会前台的后端不是好测试，编程的路上一路打怪更新无止境，学就完事了。

假如对于学习编程有很多疑惑，没有思路，不知道如何有效率的学习，可以增加我的前台交流学习群 939106847，需要最新系统的学习教程也可以管我要。做了很多年开发，对于学习方式，如何提高自己的技术有肯定的经验，术业有专攻，多跟有经验的人交流学习，对这个行业信息理解的多，职业发展的空间就越大