本文将从基础开始教起，完整实现一个可上线的小程序，期间附上许多有干货的学习资源。 基础 很多其实小程序的底层还是HTML+CSS+JS这套网页开发基础。所以如果没有这块基础知识的话，需要补一下。 建议从最简易的教程看起：w3school 进阶教程：MDN web docs 书籍推荐：红宝书《JavaScript高级程序设计》 开始 开发小程序，许多人会没什么思路，想做一个有趣有用又不那么复杂的应用。毕竟大家不希望开发的小程序只有自己一个用户。 从有用这个角度思考，大家就可以从自身需求出发。我第一个想到的是天气预报。 而天气预报的数据可以通过第三方的API获取，因此对服务后台的依赖是非常少的，或者说是几乎没有的。 设计 对于很多开发来说，设计应用的的界面是一座难以逾越的大山。我也不建议大家从零开始自行设计。 模仿是最好的老师，可以参考比较出名的，如苹果原生天气应用，墨迹天气等。 也可以参考很有名的设计社区：dribbble 数据 获取第三方的天气数据有很多方式。最简单的就是直接使用它们提供的API，免费版有一些限制但也足够使用。 我这边使用的是和风天气提供的API：文档链接 开发 具体开发起来，就是查看小程序的文档即可解决了。有什么问题大家可以在微信开发社区私信我。 运营 开发完小程序，要如何让别人知道呢。 首先推荐大家，将他绑定到自己的微信开发社区。 其次，可以到一些第三方小程序商店添加自己的小程序，如知晓程序 最后，就是写一篇完整教程，顺便给自己的小程序打个广告啦：天气号 [图片] 大家如果有什么好的idea，欢迎交流

微信小程序仿朋友圈功能开发（发布、点赞、评论等功能） 1.项目分析 项目整体分为三个部分 发布 展示 详情页 [图片] 2.数据库设计分析 **所有表共有字段 com ** create_time 记录的创建时间 update_time 记录最近的一次修改时间 动态表设计 circles_list 既然是仿朋友圈功能实现，那么数据实体必然包括 文字（主题内容） 和 图片。 content images 发布的信息还要携带上发布者的身份识别码、昵称 和 头像 , 可以选择性的带上位置信息（不需要要进行功能拓展的话就不用加上该字段）。 userid nickname avatar location 功能中存在 点赞 ， 评论等功能，需要的字段有 点赞数，评论数。 thumbsnum remarksnum 对于每一条记录，都要设置一个主键，唯一识别码 _id _id 点赞表设计 thumbs_list 设计该表的主要功能是 判断 该用户 是否对某个动态点过赞 circle_id 点赞的文章id userid cancle true / false 用于配置多次点击取消点赞 _id 评论表设置 remarks_list circle_id 评论的文章id userid content 评论的内容 avatar 评论者头像 nickname 评论者昵称 _id 3.项目效果 使用的框架 ColorUI 按照顺序展示 1.发布界面 [图片] 2.展示界面 [图片] 3.详情展示页 [图片] 4.项目关键问题 获取用户信息授权 我是在点击发布的图片按钮处做的处理 [代码] <button open-type="getUserInfo" bindgetuserinfo="topub"> <image class="add_icon" src="../../images/add.png"></image> </button> [代码] [代码] topub(e){ if (e.detail.errMsg == "getUserInfo:ok") { console.log('获得授权成功') app.globalData.userInfo = e.detail.userInfo; wx.setStorageSync('wxuserinfo', e.detail.userInfo) //console.log(e.detail.userInfo) wx.navigateTo({ url: 'SocialCirclePub/SocialCirclePub', }) } else { console.log('获得授权失败') } } [代码] 点赞评论数目增加处理 通过云函数解决 inc 解决 [代码] // 云函数入口文件 const cloud = require('wx-server-sdk') cloud.init({ env: cloud.DYNAMIC_CURRENT_ENV }) const db = cloud.database() const _ = db.command exports.main = async (event, context) => { var opr = event.opr; if(opr == 'incthumb'){ try{ return db.collection('circles_list').doc(event.id).update({ data:{ thumbsnum:_.inc(1) } }) }catch(e){ console.error(e) } }else if (opr == 'incremark') { try { return db.collection('circles_list').doc(event.id).update({ data: { remarksnum: _.inc(1) } }) } catch (e) { console.error(e) } } } [代码] 5.源码 关注公众号程序Stack ， 发送 “朋友圈” 获取项目地址和全部源码，后续会更新更多的技术知识。 [图片] <font size=5px; face=“楷体”>小程序开发联系QQ：1025584691</font>