uniapp 电子印章_第一章搭建uni-app 记账小程序

前言：

这一季会涉及到的内容

《vue+flutter+.net core +golang+uni-app》

这一季的内容准备用5年的时间来完善，博客是一种学习累计和分享(注: 我只是分享自己的实践过程，并不是教每个人怎么做(不是老师也不是大佬)，所以我也会犯错，希望通过交流得到指点，感恩????‍)

要做的东西：

(1)以”记账“为开发例子来学习所有涉及到的东西

使用开发工具

vscode vs2017 hbuilderX

要用到的技术

前端 ：

管理后台用 vue+element+admin(开源框架)写 涉及到的 webpack , Ts, 包括koa2 React 只能写一些入门项目

后端：

.net core 微服务 (关注国内前辈的文章学习中)

Golang 微服务 (发现很多没有写完的文章，接触后系统学习)

.net core 是最近推的最热门的话题，能火一定有它的原因，我找了张善友的公众号 圣洁的公众号 也在学习 微服务 ，跟着微软官网的文档研究。

Golang 微服务 跟着官网文档研究

移动端：

小程序 uni-app(非常优秀的中介器) app(混合开发)flutter

数据库：

NoSQL(两个基佬) MySql. SQL

运维部署：

系统

Linux windows2012(主要研究 如何部署 如何错误调试)

容器 和Nginx

最后总结 ：

我们先用uni-app来搭建小程序版本的。为什么要先做uni-app这一块？

1.这一块的内容最为简单，我也可以顺着实现思路，把前端的 Vue Vuex React Koa2 Ts 从入门过一遍后面

2.博客园我看相关uni-app 的内容还比较少，所以我打算写一些，希望能帮助uni-app来推广，这确实是国内很优秀的编译器

3.我看网上很多教程，最让我纳闷的是 一些官方文档的教程，他简单处理一下就开始收费了这很不厚道。

学习目录

使用uni-app“快速”搭建一个项目

下载 https://uniapp.dcloud.io/quickstart 直接按照官网的操作一步一步来基本不会出错

安装微信开始工具

安装Hbuilderx

两个东西安装成功后我们先建立一个项目。 名字随便按照自己的想法来

image

在确保你已经安装了 微信小程序开发工具 时选择运行 --选择微信开发者工具

如果看到uni-app 的logo就说明成功了

手机运行调试 百度搜索自己手机如何打开 开发者模式，进入开发者模式，选择USB传输方式为 文件传输 如果HbuilderX 检测到你的手机就说明成功了，让它自己允许按照基座

有的手机如 oppor9s 需要你在手机”设置允许外来设备安装 软件“ 这个按照各自的情况来，现在的HbuilderX 编译器连接手机很少会失败

image

第一步 看管网的文档这个相当的重要

如果你用过vue脚手架来搭建项目那么uni-app的结构你可能会比较好理解，如果没用过我来解释核心的东西

components 文件夹 也就是组件的目录，何为组件?(vue组件可以理解为预先定义好的ViewModel类)有什么用？(提高可重用性)

https://www.jianshu.com/p/0eee4b7f2b06 这里引用简书作者的文章

2.pages 文件夹 也就是我们.net mvc 里面用的视图层

3.static 这个文件夹就是我们用于存放静态资源的

注意：微信小程序的背景图片不能直接引用static 文件的图片 必须是 https 网络路径的图片

4.unpackage 这就是uni-app 帮我们把写好的代码进行转换 ，好达到跨平台的效果，其实就是帮你转换成了 微信小程序 weex 格式的代码 有兴趣可以点开来看看

5.App 这里我们打开可以看到两个 onLaunch onShow onHide 三个函数 表明程序第一次加载执行的地方 ，同时我们也可以注册全局CSS

6.pages.js manifest.js 第一个是页面路由配置js 这里的路由不是vue使用的路由 (uni-app 本身的项目就没有使用 vue 的路由) manifest 也就是我们项目的配置文件 ，比如你小程序的开发ID app的名称 ，和开发版本都可以在这里配置

介绍完过后我们就要开始做我们的第一个“首次加载导航篇” 和登录注册界面

如果在安装有任何问题可以加 q群 301453550 或是简书，博客留言我会定期查看