网络前端学习路线-20个真实的网络开发项目
目前，网络前端工程师平均每天的岗位缺口已经超过50，000个。随着互联网的深入发展，作为前端显示技术，市场对人才的需求将直线上升。
网络前端工程师的岗位职责是利用各种网络技能，如超文本标记语言、服务标准、Java、DOM等。结合产品的界面开发，制作标准化的纯手工代码，增加交互功能，丰富互联网的网页开发，努力提高用户体验。如今，网络前端工程师已经成为各大互联网公司不可或缺的热门职位。从业者的数量正在增加。其中不乏基础学习者和职业转换者。为了方便大家系统全面地掌握前端的基础知识，编者特意安排了介绍网络前端开发的路线图，涵盖了20个实战项目知识点的详细讲解，希望对大家的学习有所帮助。
第一项:个人电脑端网站的布局
知识点包括:HTML基础、CSS基础、CSS核心属性、CSS样式分层、继承、框模型、容器、溢出和元素类型、浏览器兼容性和宽度-高度自调节、定位、锚点和透明度、图片集成、表格、CSS属性和过滤器
项目2: HTML5+CSS3基础项目
知识点包括:HTML5添加元素和属性、表单域增强元素、CSS3选择器、文本字体相关样式、CSS3位移和变形处理、CSS3 2D转换和覆盖动画、CSS3 3D转换和关键帧动画、弹性盒模型、媒体查询、响应设计
第3项:WebApp页面布局项目
知识点包括:移动页面设计规范、移动剪切、文本流/控制灵活性/图片比例/专门设计的100%布局、比例缩放布局、视口/元、快速眼动/大众使用、灵活盒细节、移动网页特殊风格处理(重置、1px边框、高清图片)
项目4:本机Java交互功能开发项目
知识点包括:基本语法、循环语句、函数和数组、字符串和日期、BOM和DOM、事件、拖放效果、cookie存储、正则表达式、Ajax、面向对象基础、体育和游戏开发
项目5:面向对象的高级和ES5/ES6应用项目
知识点包括:承诺/A+，设计模式(观察者模式等)。)，原型链，构造函数，执行上下文堆栈和执行上下文，变量对象和活动对象，范围链，闭包，this，ES5，ES6
项目6: Java工具库独立研发项目
知识点包括:DOM库、事件库、AJAX库、原型和继承库、MVVM核心库、基于SPA的路由库
第7项:jQuery经典互动特效开发
知识点包括:时间线效果、标签页切换效果、网页定位导航效果、滑动门效果、焦点人物旋转效果、导航栏菜单效果、瀑布效果、弹出层效果、倒计时效果和抽奖效果
项目8: PHP+MySQL后端基础项目
知识点包括:PHP、MySQL、HTTP协议的详细解释、Ajax高级、跨域和延迟、Apache和Nginx环境构建和配置、接口定义、模拟数据、Restful、前端调试、前端安全(XSS、CSRF、JSON注入)
项目9:前端工程和模块化应用项目
知识点包括:狼吞虎咽、网络包、NPM、吉特/SVN、通用、AMD、CMD、ES6模块化
项目10:个人电脑端全堆叠开发项目
知识要点包括:大型主页、列表页面和详细页面显示以及交互式特效、搜索、登录和注册、购物车、jQueryUI和Jqueryui、引导(ACE)、高级图表/技术、艺术模板、速度、智能、云平台系统前端
项目11:用Vue.js开发WebApp项目
知识点包括:Vue.js基础、模块化、单文件组件、路由、与服务器的通信、状态管理、单元测试和产品发布、服务器渲染的SSR和Nuxt.js、基于Vue.js的企业级项目开发(MinUI、ElementUI)
项目12:用React.js开发WebApp项目
知识点包括:ReactJS基础、JSX语法、组件、flux+Redux、reach、路由器路由、动画效果、基于reach的企业级项目研发(Antd、Antd Mobile)
项目13:使用Angular开发WebApp项目。
知识点包括:类型基础和高级、开发环境配置、Hello World、体系结构、模块和组件、模板、元数据、数据绑定和数据显示、表单、服务和指令、依赖注入、路由、Ionic 3 MUI框架
项目14:微信公众号的开发
知识点包括:首先了解微信公众号，订购游行号的基本功能，利用百度百科实现快速在线编码，利用Git完成在线编码部署，公众号开发权限和功能访问，微信JSSDK接口应用编程接口，微信场景项目开发和访问
项目15:微信小程序的开发
知识点包括:微信小程序的初步研究，小程序的引入必须学会，小程序组件的经验，小程序的大功能，以及项目的实战会带你去征服小程序。
第16项:自然反应
知识点包括:反应本机的初步探索、反应本机项目的导航、反应本机项目的文本框、反应本机项目的滚动分页、反应本机项目的第三方登录、反应本机的其他组件
项目17:混合应用的开发
知识点包括:自主本地导航混合(iOS、安卓)、第三方混合框架Cordova/Phone gap、第三方混合框架MUI+HTML5+
项目18: NodeJS全堆栈开发
知识点包括:
(1)节点JS基础项目-节点JS介绍、开发环境构建、模块和包管理工具、公共组件模块、网址网址网址解析、查询字符串参数处理、HTTP模块、HTTP爬虫、请求方法、事件事件模块、文件fs模块、流流流模块、本地路由和参数接收、读取图片文件、npm、纱和PM2
(2) MongoDB-MongoDB简介和环境构建、常用数据库命令、集合集合集合、文档操作、集合集合查询、节点连接MongoDB
(3) GraphGL-GraphQL:从REST到GraphQL，安装GraphGL，准备数据源，建立GraphQL服务器，进行数据查询
(4)快速-快速介绍、基于快速的项目的安装和创建、快速4.1x初始化项目的详细说明、路由简介、模板引擎EJS、模板引擎帕格(Jade)
(5) Koa-Koa条目、KOA应用程序、中间件、上下文、异步方式、请求和响应
(6)测试框架Mocha-构建框架，断言，项目测试，运行多个测试
(7)套接字即时消息项目——套接字介绍和通信流程，套接字，网络套接字，套接字. io基于网络模块实现
项目19:节点高级完整堆栈项目
知识点包括:基于Vue+Node+MongoDB+微信的高级全栈项目开发
项目20:大数据可视化
知识点包括:数据可视化介绍、数据可视化基础、零编程工具的使用:图表块、信息图、图形、原始、表格、D3.js详细说明、D3.js介绍、D3.js高级应用、D3.js应用工具:NVD3、n3、图表、高级图表、融合图表、聚合地图
在前端学习的初始阶段，最重要的是要有明确的目标和合理的学习计划。为此，小编辑特意为大家总结了网络前端基础学习阶段的四个主要学习点，希望能让大家的学习更有效率:
首先，对基础知识的掌握是在我们所梳理的知识框架中进行的。根据我们分析的两个维度中最先进和最肤浅的部分，作为基础阶段，我们必须在这个过程中投入更多的努力。我们通常认为，当我们做得更多并变得熟练时，这部分知识和内容就被掌握了。
第二，掌握常用工具。要掌握常用工具，应该掌握一些有大公司或专业团队背景的流行工具。熟练使用这些工具可以提高专业性、专业性，同时提高我们的工作效率。
第三，中国人掌握了沟通技巧。技术人员通常制定并实施自己的计划。在实施过程中，缺乏相关产品和交互设计人员的沟通。他们中的大多数都是根据自己的想法发展起来的。随着时间的推移，我们习惯于相信自己的观点，从自己的角度看待问题。我们总是尽力“证明”挑战。我们需要改进的是如何从另一方的角度看待问题，以及如何从用户的角度看待问题。
4.良好的发展习惯已经形成。一旦有了坏习惯，将来改正它们将会是一个很大的麻烦。为了培养良好的开发习惯，一个人必须从头开始，例如，在写代码之前先分析，先写文档，先写评论，等等。
最后，我希望每个人都能通过自己的努力和学习，成为一名完整的网络前端工程师。
