第一个阶段，开发环境和工具准备

• 浏览器 （Google，FireFox，…）
• 下载，安装前端开发工具vscode，
• 下载、安装 node、npm、webpack、webpack-cli、cnpm，配置前端开发环境
• 下载、配���PHP和MySQL

  第二个阶段，前端入门，网页制作

  1，HTML：

  • 常用标签（p标签，p标签，span标签，a标签，img标签）
  • 锚点
  • 列表标签（有序列表，无序列表，自定义列表）
  • 表单标签
  • 表格标签
  • 标签分类
  • 标签语义化
  • 注释
  • 字符实体

    2，CSS：

    • CSS介绍

    • 全局样式

    • 行内元素

    • 内联元素

    • 选择器

      （1）基础选择器（标签选择器，类选择器，ID选择器）

      （2）复合选择器（后代选择器，兄弟选择器，相邻元素选择器，交集选择器，并集选择器）

      （3）选择器优先级

    • 字体样式值

    • 文本样式值

    • 颜色样式值

    • 盒模型（标准盒模型，怪异盒模型）

    • 控制台使用

    • 清除默认样式

    • 盒模型居中

    • 标准文档流

    • 块元素

    • 行内元素

    • 行内块元素

    • 多种伪类元素

    • 浮动

      （1）浮动元素脱离文档流

      （2）外边距塌陷问题

      （3）N种清除浮动的方式

    • 定位(相对定位，固定定位，绝对定位，z-index)

      第三个阶段，JavaScript动态交互

      1，JavaScript初阶

      • 变量和运算符

        （1）JS用途

        （2）JS书写规则

        （3）内置函数使用

        （4）字面量

        （5）变量

        （6）命名标识符规范

        （7）变量声明提升

        （8）运算符（数**算符，比较运算符，逻辑运算符，赋值运算符）

        （9）页面修改（innerHTML，innerText，value）

      • 逻辑控制

        （1）if关键字（if…else，if…else if…else，多分支条件语句，嵌套if语句）

        （2）for关键字（for循环，双重for循环）

        （3）自增

        （4）自减

        （5）switch条件语句

        （6）累加器

        （7）累乘器

        （8）while（continue关键字，break关键字，while循环语句，do…while循环语句）

        （9）js控制HTML标签

        （10）三目运算符

        （11）运算符优先级

      • Math类

        （1）Math属性（Math.PI，Math.E，…）

        （2）Math函数（round，floor，ceil，…）

      • 函数

        （1）无参函数

        （2）函数定义

        （3）函数调用

        （4）作用域

        （5）参数（形参，实参，入参，出参）

        （6）不定参函数

        （7）arguments

      • Object类

        （1）对象的定义

        （2）对象的使用

      • 定时器
      • Array类
      • String类
      • Date类

        2，JavaScript进阶

        • JavaScript DOM基础

          （1）DOM元素遍历

          （2）DOM元素查找

          （3）DOM元素增加

          （4）DOM元素删除

          （5）DOM元素修改

          （6）DOM元素剪切

          （7）属性操作

          （8）样式操作

          （9）文档碎片

        • this（在各个环境下this的指向）
        • 事件

          （1）普通事件回顾

          （2）绑定事件

          （3）取消普通事件

          （4）取消绑定事件

          （5）事件类型（键盘事件，鼠标事件，聚焦&失焦事件）

        • 事件流

          （1）事件源

          （2）事件流

          （3）事件冒泡

          （4）事件捕获

          （5）事件委托

        • JavaScript BOM 基础

          （1）offset

          （2）client

          （3）scroll

          （4）getBoundingClientRect()

          （5）滚动事件

        • call&apply&bind

          （1）深入探究作用域

          （2）偏函数的使用

        • 自定义属性
        • 面向对象编程

          （1）封装

          （2）构造方法

          （3）instanceof

          （4）constructor

          （5）继承（函数继承，构造函数继承，类继承）

          （6）原型

          （7）原型链

          （8）多态

          3，ES6

          • ECMAScript6简介
          • let和const
          • ES6+的作用域
          • 对象的扩展
          • 函数的扩展
          • 字符串的扩展
          • Symbol
          • Set&Map
          • Promise对象
          • async&awiat
          • 箭头函数
          • 模板字符串
          • rest参数
          • Class
          • Module模块

            4，JavaScript高阶

            • 闭包

              （1）深入理解闭包

              （2）深入理解闭包原理

              （3）闭包面试题权威解析

            • 立即执行函数
            • 惰性函数
            • 插件开发
            • 多人协作
            • 深复制与浅复制
            • 数组扁平化
            • 递归

              （1）斐波那契数列详解

              （2）递归深复制与浅复制

              （3）柯里化思想

              （4）柯里化及递归面试题权威解析

            • 正则表达式全解
            • 函数防抖
            • 函数节流

              第四阶段，移动端开发技术实战

              1，HTML5

              • HTML5简介
              • HTML5新语法
              • HTML5新语义化标签
              • HTML5新表单元素属性
              • HTML5手机端新事件处理
              • HTML5新增多媒体实战
              • 本地存储（cookie，localStorage，sessionStorage）
              • Canvas
              • HTML5地理组件GeoLocation

                2，CSS3

                • CSS3新增属性
                • 圆角制作企业级方案
                • CSS3背景属性
                • 过渡动画 transition
                • 变化属性 transform
                • 特效轮播图实战
                • 企业级flex布局实战
                • grid布局实战

                  3，Bootstrap

                  • 响应式
                  • 媒体查询（媒体类型，媒体特性，媒体查询企业级应用）
                  • 栅格系统
                  • 栅格参数
                  • 组合模式
                  • 列偏移/列排序/自动列
                  • 列对齐/列嵌套
                  • 文本与颜色
                  • 按钮
                  • 导航
                  • 图文混排
                  • 模态框
                  • 轮播图

                    4，移动端开发

                    • 移动端简介
                    • 移动端视口约束
                    • 移动端flex移动端实践
                    • rem
                    • vw
                    • flexible企业级实战

                      第五阶段，前后端分离技术及常用类库

                      1，ajax

                      • AJAX简介
                      • AJAX作用
                      • 封装AJAX
                      • 创建XMLhttpRquest对象
                      • 同步和异步
                      • AJAX分页

                        2,JQuery

                        • jQuery介绍
                        • jQuery链式语法
                        • jQuery选择器

                          （1）基础选择器

                          （2）复合选择器

                          （3）jQuery独有选择器

                        • jQuery核心

                          （1）jQuery核心函数

                          （2）jQuery对象访问

                          （3）数据缓存

                          （4）队列控制

                          （5）插件机制

                          （6）多库共存

                        • jQuery工具

                          （1）浏览器及特性检测

                          （2）数组和对象操作

                          （3）函数操作

                          （4）测试操作

                          （5）字符串操作

                          （6）URL

                          （7）插件编写

                        • jQuery事件

                          （1）原始事件

                          （2）创建事件

                          （3）页面载入

                          （4）事件处理

                          （5）事件委派

                          （6）事件切换

                          （7）事件

                        • jQuery事件对象
                        • jQuery特效(基本，滑动，淡入淡出，自定义，设置)
                        • jQuery回调函数
                        • jQuery文档处理（内部插入，外部插入，包裹，替换,删除，复制）
                        • jQuery筛选（过滤，查找，串联）
                        • jQuery属性（属性，CSS类，HTML代码/文本/值）
                        • jQueryCSS（CSS，位置，尺寸）

                          Echarts

                          • Echarts概述
                          • Echarts使用
                          • 坐标系
                          • 雷达图/饼状图/折线图

                            第六阶段，企业级高级WEB架构开发

                            1，Webpack

                            Webpack的安装和使用

                            • 项目模块打包
                            • 静态打包模块器
                            • Webpack入口

                            • 戳这里领取完整开源项目：【一线大厂前端面试题解析+核心总结学习笔记+Web真实项目实战+最新讲解视频】

                              Webpack输出

                              • Webpack插件
                              • webpack模块

                                2，Vue

                                • Vue使用
                                • Vue响应式
                                • Vue双向数据绑定
                                • Vue相关指令

                                  （1）条件渲染v-if

                                  （2）v-bind指令

                                  （3）v-on指令

                                  （4）v-on的修饰符

                                  （5）列表渲染

                                  （6）v-model指令

                                  （7）v-model详细讲解

                                  （8）v-cloak

                                • vue-resource
                                • axios
                                • template选项
                                • Vue生命周期
                                • Vue组件

                                  （1）Prop

                                  （2）**组件事件

                                  （3）插槽

                                  （4）动态组件

                                  （5）组件通信（父子，子父，其他组件）

                                  （6）函数式组件

                                  （7）异步组件

                                • 自定义指令
                                • 过滤器
                                • computed属性
                                • Vue-cli 2.x和3.x 脚手架配置
                                • Vue-router

                                  （1）VueRouter基础

                                  （2）嵌套路由

                                  （3）路由重定向

                                  （4）动态路由

                                  （5）路由传参

                                  （6）导航守卫

                                • Vuex（State，Getter，Mutation，Action，Module）
                                • Element UI

                                  3，微信小程序

                                  • uni-app
                                  • mpvue
                                  • 微信小程序注册
                                  • APPID申请
                                  • 生命周期
                                  • 小程序调试
                                  • 微信小程序框架组件
                                  • 微信小程序布局框架
                                  • 微信小程序条件渲染和列表渲染
                                  • 媒体组件audio
                                  • 视图容器
                                  • 网络api
                                  • 相机api
                                  • 地图api

                                    4，uniapp

                                    • uniapp基础
                                    • uniapp初始化配置
                                    • uniapp视图模板使用
                                    • uniapp生命周期
                                    • uniapp路由跳转
                                    • uniapp常用组件
                                    • uniappScrollView的使用
                                    • uniapp-ui使用
                                    • uniapp-Vuex使用

                                      更多面试题

                                      **《350页前端校招面试题精编解析大全》**内容大纲主要包括 HTML，CSS，前端基础，前端核心，前端进阶，移动端开发，计算机基础，算法与数据结构，项目，职业发展等等

                                      开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

                                      • uniapp基础
                                      • uniapp初始化配置
                                      • uniapp视图模板使用
                                      • uniapp生命周期
                                      • uniapp路由跳转
                                      • uniapp常用组件
                                      • uniappScrollView的使用
                                      • uniapp-ui使用
                                      • uniapp-Vuex使用

                                        更多面试题

                                        **《350页前端校招面试题精编解析大全》**内容大纲主要包括 HTML，CSS，前端基础，前端核心，前端进阶，移动端开发，计算机基础，算法与数据结构，项目，职业发展等等

                                        开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

                                        [外链图片转存中…(img-pQES5xjZ-1709690668488)]