uni-app框架介绍-uniapp入门教程

当前位置:　首页>> 技术小册>> uniapp入门教程

### 1. 前言
uni-app 是一个由 DCloud 团队推出的跨平台应用的前端框架，用的是 Vue.js 语法。

如果你之前没有接触过 Vue.js 语法也没有关系，相信你在学习这篇文章之前一定是了解 html、js、css 的， Vue.js 语法其实就是这三者的结合，很容易上手的。

说起uni-app，我们最常听说的，应该是他可以用来开发小程序，但是他的功能可不仅限于此，我们可以用它开发几乎所有的前端应用，功能非常强大！

用uni-app框架开发，代表我们只需要用一套代码，就可以将项目部署到多个平台上面。这些平台包括iOS、Android、H5、小程序（微信/支付宝/百度/头条/QQ/钉钉/淘宝）、快应用等。再也不用根据各个平台的特性去单独开发一套代码了，维护也只需要维护这一套代码，会极大的提高我们的工作效率。

总的来说，uni-app是一款容易上手、功能强大的开发框架。想要学习前端开发，uni-app 绝对是一款良心的好框架，非常值得我们学习使用！

### 2. 为什么要使用uni-app
当下进行开发的时候，特别是前端开发，之前我们需要根据各个平台的特性单独开发一套代码，对于开发还是维护来说都是很大的工作量，大大消耗了我们的时间和精力。

如果使用 uni-app 框架开发就不需要考虑这些了，用一套代码就可以部署到多个平台上面。下面来看一下 uni-app 为什么值得我们去学习使用。

**2.1 学习成本低**
uni-app 基于通用的前端技术栈，用的是vue语法+微信小程序api，简单易上手，新手友好度高。

只学习 uni-app 就可以开发出iOS、Android、H5、以及各种小程序的应用，不需要再学习其他的应用框架。

如果你有过h5、原生小程序、mpvue等的开发经验，也可以无缝衔接到 uni-app，几乎没有额外的学习成本。

**2.2 开发成本低**
之前针对 h5 应用、小程序等平台需要各自开发一套代码，现在使用 uni-app 开发。可以实现多端一套代码，不需要重复开发，极大的提高了我们的开发效率。对公司来说，也大大减少了开发成本。

再搭配上 HBuilderX 这个通用的前端开发工具，熟练掌握后研发效率至少翻倍，即使不跨端，uni-app 也是更好的小程序开发框架、h5开发框架。

**2.3 部署简单**
不知道大家之前有没有部署过其他的框架，还记得部署环境时遇到各种插件、各种依赖、各种报错时那种崩溃的心情吗？这种心情 uni-app 框架绝对不会让你体会到。

不同于其他前端框架繁杂的部署，DCloud 团队非常贴心，开发了成熟的软件HBuilderX。集成了我们开发所需要的基础环境，我们不需要再去一个个的安装插件，体会连环套的报错了，只需要下载安装这个软件就可以了。开始 uni-app 的开发调试就是这么简单。

**2.4 良好的周边生态**
uni-app 的开发团队不仅贴心还很用心，他们长期维护代码，并积极拥抱社区，打造了开放、兼容的生态系统。

越活跃的开发社区，就代表有更多的学习资料，bug 能更快的得到修复，问题也能更快的得到解答。学习这个框架会让你越来越惊喜，一定不会让你失望的。

### 3. 学习基础
为了让大家有更好的学习体验，在学习本课程之前，最好已经具备下面这些基础知识：

对 Vue.js 语法有一定的了解；
没有接触过 Vue.js，有 html、css、JavaScript 的基础也可以；
对 nodeJs 有一定的了解，这个主要是后端开发会用到，如果你只负责前端开发可以忽略掉。但如果要进行前后端全栈开发，就一定要掌握 nodeJs。
### 4. 小结
本小节主要介绍了 uni-app 是一个怎样的框架，主要为了让大家放下心防。这么强大的框架，其实上手并不难，我们不需要过多的操心，后面的课程会给大家一步步拆解这个框架。本节的重点如下：

uni-app 是一款几乎可以开发所有前端应用的框架；
我们为什么要使用 uni-app ？因为它的学习成本低、开发成本低、部署简单以及有一个良好的周边生态；
学习 uni-app 之前最好对 Vue.js 语法有一定的了解。

该分类下的相关小册推荐：

uni-app零基础入门