【小程序源码案例】微信小程序项目开发案例分享

时间:2017-05-04 01:38:48   收藏:0   阅读:668

作者:web小二 本文标签: 微信小程序 小程序源码案例 小程序项目
小程序的开发,并不是适合所有公司,我今天跟大家分享小程序方面的教程,主要是供大家学习使用。
学习这种东西,有时候则是单纯的喜欢,没有任何目的,很单纯的为了好玩,记得很早之前学flash,没有想法,就是觉得好玩,纯娱乐爱好而已。到后来玩视频剪辑也是出于同样的原因,不图钱财名利,只是图自己个人爱好娱乐。

但是,学习,有时候则是需要有明确目的,特别是关系到自己吃饭问题的时候,你就需要非常有目的去学习,并且还需要制定好学习的计划与目标,希望最终达到一个什么样的效果。

所以今天我写这篇小程序开发教程,也是有一定目的性,我的目的就是希望,让没有接触过小程序开发的朋友,通过这篇文章,即可达到入门的目的。

当然,前提条件是,你必须要有一定编程的基础,接触过开发,这样,你学起来会快很多,编程这种东西,有很多是相通的,只要你肯花时间去学习,掌握一门新东西,学习一门新技能根本不是什么难事,当然,如果你想投机取巧,后面你还是需要补回来,学习和成功是一样,没有捷径,想走捷径的朋友,请绕道,因为我提供不了这种捷径。

一、注册微信小程序

到微信公号平台:https://mp.weixin.qq.com/,点击立即注册,到下图这个界面,接着选择小程序。

技术分享


点击上图中的小程序,则可以到小程序注册界面,如下图:

技术分享

按照里面的内容进行一步一步操作,这个也非常简单。我们学习使用,只要注册一个个人类型的小程序即可。

我们注册小程序的目的,就是为了后面的真机演示预览,因为在真机演示时,需要一个AppID,如果没有注册小程序的话,则获取不到这个AppID,所以也没有办法进行最后的真机演示预览。

二、微信开发者工具下载

Mac系统:链接: https://pan.baidu.com/s/1hscblK4 密码: 7wh9
Win 64位系统:链接: https://pan.baidu.com/s/1c1Nqlxe 密码: zsdv
Win 32位系统:链接: https://pan.baidu.com/s/1pLwLAEv 密码: twd6
根据自己电脑系统,下载不同的微信开发者工具,然后进行安装,这个跟安装一般软件一样。

三、添加小程序项目进行演示

这个过程是重点,请大家认真看。

1)打开微信开发者工具,可以看到如下界面。

技术分享

2)通过自己微信扫描二维码进行登录确认。

技术分享

3)选择本地小程序项目。添加小程序演示项目。

技术分享

4)点击添加项目在这一步就输入AppID,当然,你也可以选择无AppID。只是项目里有的功能会受限,项目名称可以自己定义,为了区别建议写易记易区别的名称;项目目录,这里只需要添加到app.json的上级目录即可。最后添加项目即可。
AppID:在你注册的小程序里的【设置】-【开发设置】,有一个开发者ID,里面有一个AppID,将此AppID复制过来即可。

技术分享

5)添加电影类APP源码,大家可以看看这个效果。里面的效果,大家还可以根据自己需求进行修改。

案例源码地址:链接: https://pan.baidu.com/s/1kVNsgej 密码: 72i4

技术分享

6)最后点击【项目】-【预览】,会生成一个二维码,扫描后,则可以在手机上查看真实的效果。下图为我手机上截图效果。

技术分享

四、更多其他小程序源码案例
1)仿京东首页

源码地址:链接: https://pan.baidu.com/s/1mika5PQ 密码: kie8

技术分享

2)关注web前端开发公众号,则可以获取更多小程序源码案例。

技术分享

写在最后:FOR Freedom 看看外边的世界,以及IT这一行,少不了去Google查资料,最后,安利一些速器代理。

加速器推荐 免费方案 付费方案 官方网站
一枝红杏加速器 免费方案暂无,稳定高速 输入8折优惠码wh80,年付只需80元/年 官网直达
安云加速器 最好用的外贸VPN 最低¥30/月 官网直达
LoCo加速器 每天免费2小时 最低¥15/月 官网直达

本文标签: 微信小程序 小程序源码案例 小程序项目

转自 SUN‘S BLOG - 专注互联网知识,分享互联网精神!

原文地址 【小程序源码案例】微信小程序项目开发案例分享

相关阅读Chrome 扩展 Stylish :给不喜欢某个网站一键「换肤」

相关阅读将 QQ 音乐、网易云音乐和虾米音乐资源「整合」一起的Chrome 扩展Listen 1

相关阅读8 个「新标签页」Chrome 扩展: 教你把 New Tab 页面玩的溜溜溜

相关阅读7 款实用 Chrome 扩展推荐:帮你提升 Chrome 使用体验

相关阅读无扩展就不是 Chrome 了:15 款优质的Chrome 扩展推荐给大家

相关阅读12 款不能少的使网页浏览获得的最佳体验Chrome 扩展

相关阅读5 款可以带来幸福感的 Chrome 扩展

相关阅读 关于 Android 中的 Palette 类的使用案例:色彩自适应的 Toolbar

相关阅读:GIT能做什么、它和SVN在深层次上究竟有什么不同

相关阅读:分享一些对开发者最有用的、用户友好和功能丰富的Google Chrome扩展工具

相关阅读:分享一些实际Android开发过程中很多相见恨晚的工具或网站

相关阅读:我是 G 粉,一直关注 Google,最近 Google 有一些小动作,可能很多人不太了解

相关阅读:机器学习引领认知领域的技术创新,那么SaaS行业会被机器学习如何改变?

相关阅读:VPS 教程系列:Dnsmasq + DNSCrypt + SNI Proxy 顺畅访问 Google 配置教程

相关阅读: 最有用:2017最新能上Google、Facebook的方法

相关BLOG:SUN’S BLOG - 专注互联网知识,分享互联网精神!去看看:www.whosmall.com

原文地址:http://whosmall.com/?post=447

评论(0
© 2014 mamicode.com 版权所有 京ICP备13008772号-2  联系我们:gaon5@hotmail.com
迷上了代码!