第一章搭建uni-app 记账小程序

csrzdd · · 5354 次点击 · · 开始浏览    
这是一个创建于 的文章,其中的信息可能已经有所发展或是发生改变。

前言:
这一季会涉及到的内容

《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的结构你可能会比较好理解,如果没用过我来解释核心的东西

  1. components 文件夹 也就是组件的目录,何为组件?(vue组件可以理解为预先定义好的ViewModel类)有什么用?(提高可重用性)
    https://www.jianshu.com/p/0eee4b7f2b06 这里引用简书作者的文章

2.pages 文件夹 也就是我们.net mvc 里面用的视图层
3.static 这个文件夹就是我们用于存放静态资源的 <p style="color:red">注意:微信小程序的背景图片不能直接引用static 文件的图片 必须是 https 网络路径的图片 </p>
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 或是简书,博客留言我会定期查看


有疑问加站长微信联系(非本文作者)

本文来自:简书

感谢作者:csrzdd

查看原文:第一章搭建uni-app 记账小程序

入群交流(和以上内容无关):加入Go大咖交流群,或添加微信:liuxiaoyan-s 备注:入群;或加QQ群:692541889

5354 次点击  
加入收藏 微博
暂无回复
添加一条新回复 (您需要 登录 后才能回复 没有账号 ?)
  • 请尽量让自己的回复能够对别人有帮助
  • 支持 Markdown 格式, **粗体**、~~删除线~~、`单行代码`
  • 支持 @ 本站用户;支持表情(输入 : 提示),见 Emoji cheat sheet
  • 图片支持拖拽、截图粘贴等方式上传