day03--项目前端相关基础知识

day03--项目前端相关基础知识

谷粒学院功能简介及系统架构 https://www.cnblogs.com/coderD/p/14506161.html

day01--MybatisPlus的使用 https://www.cnblogs.com/coderD/p/14506180.html

day02--环境搭建与讲师管理接口开发 https://www.cnblogs.com/coderD/p/14506295.html

day03--项目前端相关基础知识 https://www.cnblogs.com/coderD/p/14506446.html

day04--项目前端相关基础知识（二） https://www.cnblogs.com/coderD/p/14506481.html

day05--讲师管理模块前端开发 https://www.cnblogs.com/coderD/p/14506505.html

day06--讲师管理模块前端开发 https://www.cnblogs.com/coderD/p/14506540.html

day07--课程发布-添加课程信息 https://www.cnblogs.com/coderD/p/14506574.html

day08--课程发布-添加课程信息 https://www.cnblogs.com/coderD/p/14506609.html

day09--课程列表和整合阿里云视频点播 https://www.cnblogs.com/coderD/p/14506636.html

day10--微服务调用 https://www.cnblogs.com/coderD/p/14506649.html

day11--首页数据显示和添加Redis缓冲 https://www.cnblogs.com/coderD/p/14506655.html

day12--首页登录和注册 https://www.cnblogs.com/coderD/p/14506657.html

day13--微信扫码登陆 https://www.cnblogs.com/coderD/p/14506670.html

day14--首页课程和名师功能 https://www.cnblogs.com/coderD/p/14506677.html

day15--统计分析 https://www.cnblogs.com/coderD/p/14506685.html

day16--权限管理 https://www.cnblogs.com/coderD/p/14506689.html

day17--权限管理和配置服务 https://www.cnblogs.com/coderD/p/14506701.html

1、ECMAScript6简介

ECMAScript 6.0（以下简称 ES6）是 JavaScript 语言的下一代标准，已经在 2015 年 6 月正式发布了。它的目标，是使得 JavaScript 语言可以用来编写复杂的大型应用程序，成为企业级开发语言。

2、vue.js是什么

Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。

Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。

官方网站：https://cn.vuejs.org

2.1、组件

组件（Component）是 Vue.js 最强大的功能之一。

组件可以扩展 HTML 元素，封装可重用的代码。

组件系统让我们可以用独立可复用的小组件来构建大型应用，几乎任意类型的应用的界面都可以抽象为一个组件树：

2.1.1、局部组件

定义组件

var app = new Vue({
    el: '#app',
    // 定义局部组件，这里可以定义多个局部组件
    components: {
        //组件的名字
        'Navbar': {
            //组件的内容
            template: '<ul><li>首页</li><li>学员管理</li></ul>'
        }
    }
})

使用组件

<div id="app">
    <Navbar></Navbar>
</div>

2.1.2、全局组件

// 定义全局组件
Vue.component('Navbar', {
    template: '<ul><li>首页</li><li>学员管理</li><li>讲师管理</li></ul>'
})

<div id="app">
    <Navbar></Navbar>
</div>
<script src="vue.min.js"></script>
<script src="components/Navbar.js"></script>

<script>
    var app = new Vue({
        el: '#app'
    })
</script>

2.2、实例生命周期

2.3、路由

Vue.js 路由允许我们通过不同的 URL 访问不同的内容。

通过 Vue.js 可以实现多视图的单页Web应用（single page web application，SPA）。

Vue.js 路由需要载入 vue-router 库

2.4、axios

axios是独立于vue的一个项目，基于promise用于浏览器和node.js的http客户端

• 在浏览器中可以帮助我们完成 ajax请求的发送
• 在node.js中可以向远程接口发送请求

2.5、element-ui:

element-ui 是饿了么前端出品的基于 Vue.js的 后台组件库，方便程序员进行页面快速布局和构建

官网： http://element-cn.eleme.io/#/zh-CN

创建 06-element-ui.html

将element-ui引入到项目

3、Node

3.1、简介

3.1.1、什么是Node.js

简单的说 Node.js 就是运行在服务端的 JavaScript。

Node.js是一个事件驱动I/O服务端JavaScript环境，基于Google的V8引擎，V8引擎执行Javascript的速度非常快，性能非常好。

3.1.2、Node.js有什么用

如果你是一个前端程序员，你不懂得像PHP、Python或Ruby等动态编程语言，然后你想创建自己的服务，那么Node.js是一个非常好的选择。

Node.js 是运行在服务端的 JavaScript，如果你熟悉Javascript，那么你将会很容易的学会Node.js。

当然，如果你是后端程序员，想部署一些高性能的服务，那么学习Node.js也是一个非常好的选择。