微信小程序云开发 初学者入门准备
原创
随着小程序云开发的逐渐流行，一个工程师全栈小程序的能力也逐步变得越来越强大，作为一个前端工程师，现在也可以逐步脱离后台的帮助了，自己可以按照自己的想法来开发一款小程序比什么都重要。开发者可以使用云开发开发微信小程序、小游戏，无需搭建服务器，即可使用云端能力。
微信小程序云开发 初学者入门准备（云开发环境搭建）
本教程适合刚刚入门的小白,云开发为开发者提供完整的云端支持，弱化后端和运维概念，无需搭建服务器，使用平台提供的 API 进行核心业务开发，即可实现快速上线和迭代，同时这一能力，同开发者已经使用的云服务相互兼容，并不互斥。
1：在桌面新建一个文件夹，命名为cloud
2：填写小程序appid，选择建立云开发快速启动模板，点击确定按钮。
3：完成之后，界面如下所示，默认好的项目目录和一系列的代码，可以仔细阅读和学习这些官方默认的文档
4：点击云开发按钮，申请开通
5：创建创建资源环境，填写环境名称，每个小程序帐号可免费创建两个环境。填写相关信息，环境名称
6：成功开通之后进入；创建完成之后的界面。
7：仔细看一下新建的云项目之后发现，新建项目中一个简单的获取用户openId的云函数示例
8：在cloudfunctions路径下的login文件夹上点击右键，选择创建并部署
9：在云开发控制台里，找到自己的环境ID，复制准备
10：在miniprogram目录下的app.js配置环境ID
示例代码：
//app.js
App({
onLaunch: function () {
if (!wx.cloud) {
console.error('请使用 2.2.3 或以上的基础库以使用云能力')
} else {
wx.cloud.init({
env: 'wang-t6e372',
//我刚刚从云开发控制台里复制过来的自己的环境ID，
traceUser: true,
})
}
this.globalData = {}
}
})11：再次回到云开发控制台，依次点击云函数->login函数->右上角的测试按钮
11：测试成功
我们可以查看一下结果
打开云开发控制台，切换到“用户管理”标签页，查看小程序的用户列表
再来测试一下上传图片的功能 在本地桌面选一张图片上传，然后打开云开发控制台，查看存储管理，里面多了一张图片的记录，也就是刚刚我上传的自己的图片
微信小程序云开发 初学者入门准备 -前端操作数据库模块
如何操作数据库，作为一名前端，如果对数据的知识不够熟悉也没关系，从现在开始好好学习就行，数据库的操作内容差不多涉及增删改查四大模块，花一些业余的时间在上面，也必有所得。
数据库操作大多数需要用户openid,需要先配置好吧login云函数，如果已经配置好了，获取用户的openid之后，开始步骤：
数据库操作API:https://developers.weixin.qq.com/miniprogram/dev/wxcloud/reference-client-api/database/index.html
步骤
1：打开云开发控制台，进入到数据库管理模块
2：选择添加集合，集合名称为counters，添加完成之后的界面
3：可以看到counters集合出现在左侧集合列表中
注：集合必须在云开发控制台中创建
4：新增一条记录试一试
a. 打开pages/databaseGuide/databaseGuide.js文件，定位到 onAdd 方法
b：选中所有注释过的代码，ctrl+/快捷键，解除注释
onAdd: function () {
const db = wx.cloud.database()
db.collection('counters').add({
data: {
count: 1
},
success: res => {
// 在返回结果中会包含新创建的记录的 _id
this.setData({
counterId: res._id,
count: 1
})
wx.showToast({
title: '新增记录成功',
})
console.log('[数据库] [新增记录] 成功，记录 _id: ', res._id)
},
fail: err => {
wx.showToast({
icon: 'none',
title: '新增记录失败'
})
console.error('[数据库] [新增记录] 失败：', err)
}
})
},c. onAdd 方法会往 counters 集合新增一个记录，新增如下格式的一个 JSON 记录
{ "_id": "数据库自动生成记录 ID 字段",
"_openid": "数据库自动插入记录创建者的 openid", "count": 1 }在桌面新建一个json文件，将这段代码复制黏贴进去，备用
导入之后显示的界面
d： 点击按钮：新增记录
e：在云开发 -> 数据库 -> counters 集合中可以看到新增的记录
微信小程序云开发数据库操作一添加记录实例演示
官方文档解读：
<!-- 新增记录 -->
<view class="guide" wx:if="{{step === 3}}">
<text class="headline">新增记录</text>
<text class="p">1. 打开 pages/databaseGuide/databaseGuide.js 文件，定位到 onAdd 方法</text>
<text class="p">2. 把注释掉的代码解除注释</text>
<image class="code-image" src="../../images/code-db-onAdd.png" mode="aspectFit"></image>
<text class="p">3. onAdd 方法会往 counters 集合新增一个记录，新增如下格式的一个 JSON 记录</text>
<text class="code">
{
"_id": "数据库自动生成记录 ID 字段",
"_openid": "数据库自动插入记录创建者的 openid",
"count": 1
}
</text>
<text class="p">4. 点击按钮</text>
<button size="mini" type="default" bindtap="onAdd">新增记录</button>
<text class="p" wx:if="{{counterId}}">新增的记录 _id 为：{{counterId}}</text>
<text class="p">5. 在云开发 -> 数据库 -> counters 集合中可以看到新增的记录</text>
<div class="nav">
<button class="prev" size="mini" type="default" bindtap="prevStep">上一步</button>
<button class="next" size="mini" type="default" bindtap="nextStep" wx:if="{{counterId}}">下一步</button>
</div>
</view>做一个小demo
效果如下：点击新增记录的按钮的时候，会出现提示，新增的记录为多少，并且有弹框提示，新增记录成功。
打开云开发控制台，点击数据库模块，可以看到刚刚添加的记录
wxml代码：
<button size="mini" type="default" bindtap="onAdd">新增记录</button>
<text class="p" wx:if="{{counterId}}">新增的记录 _id 为：{{counterId}}</text>js代码：
// pages/databaseGuide/databaseGuide.js
const app = getApp()
Page({
data: {
step: 1,
counterId: '',
openid: '',
count: null,
queryResult: '',
},
onLoad: function (options) {
if (app.globalData.openid) {
this.setData({
openid: app.globalData.openid
})
}
},
onAdd: function () {
const db = wx.cloud.database()
db.collection('counters').add({
data: {
count: 1
},
success: res => {
// 在返回结果中会包含新创建的记录的 _id
this.setData({
counterId: res._id,
count: 1
})
wx.showToast({
title: '新增记录成功',
})
console.log('[数据库] [新增记录] 成功，记录 _id: ', res._id)
},
fail: err => {
wx.showToast({
icon: 'none',
title: '新增记录失败'
})
console.error('[数据库] [新增记录] 失败：', err)
}
})
},
})对于数据库的增删改查 后续会有更加细致的文章： 1：微信小程序云开发数据库操作一添加记录 2：微信小程序云开发数据库操作二查询记录 3：微信小程序云开发数据库操作三删除记录 4：微信小程序云开发数据库操作四更新记录
下班之后带着电脑回家，在地铁上拥挤非常，感觉电脑都要被挤坏了，这几天反思了一下从前，每天上班下班，完成老板给的任务就可以潇洒走人了，总觉得自己不够努力，又或者每天重复着老旧的技术，周而复始，早已落后于前端发展的潮流，不觉开始惶恐。每天晚上开始学习，戒掉游戏和手机，让自己尽快达到一个沉迷于代码不可自拔的境界。
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。