微信小程序开发基础 -- 开发前的准备

缘由

1月9日张小龙微信小程序正式上线,因为微信,所以小程序从诞生开始就头戴巨大的光环,很多的团队,公司以及开发的个体都眼巴巴的盯着这个小程序。而那个时候我却在全力以赴的研究node,所以也没有仔细的研究这个风风火火的小程序。本以为此生无甚交集,但是最近公司却准备开发小程序,而我也"幸运"的被选中......

小程序上线有有一段时间了,虽然还是在不断的更新,但是却大体趋于稳定,网上也积累了一定的教程和帖子,所以在研究了一下之后也就决定将自己学习小程序的一些过程记录在博客中,以供他人参考。

什么是微信小程序

微信小程序(weixinxiaochengxu),简称小程序,缩写XCX,英文名mini program,是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或搜一下即可打开应用。

全面开放申请后,主体类型为企业、政府、媒体、其他组织或个人的开发者,均可申请注册小程序。小程序、订阅号、服务号、企业号是并行的体系。

2017年1月9日,张小龙在2017微信公开课Pro上发布的小程序正式上线。

发展历程

2016年9月21日,微信小程序正式开启内测。在微信生态下,触手可及、用完即走的微信小程序引起广泛关注。腾讯云正式上线微信小程序解决方案,提供小程序在云端服务器的技术方案。

2016年1月11日,微信之父张小龙时隔多年的公开亮相,解读了微信的四大价值观。张小龙指出,越来越多产品通过公众号来做,因为这里开发、获取用户和传播成本更低。拆分出来的服务号并没有提供更好的服务,所以微信内部正在研究新的形态,叫「微信小程序」。

2017年1月9日0点,万众瞩目的微信第一批小程序正式低调上线,用户可以体验到各种各样小程序提供的服务。

小程序核心理念

具备明星光环的小程序,如果在百度里面查找相关的资料以及介绍,是非常容易的。但是在众多理念中,我认为最为核心的理念应该就是一句__用完即走__。

那么什么是用完即走呢?

非常简单,当需要的时候,不需要下载动则几十兆的app,也不需要进行过多复杂的操作,打开微信,开启小程序,直接使用。而用完直接退出,不用顾虑它是否会过多的占用你手机宝贵的内存。

给人的感觉有点像叫车一样,需要的时候一个预定,车就来了,到达了目的地,下车,再见。

开发

与其他语言开发动不动就要配置环境,下载一些插件软件安装包等等的复杂项目构建不同,小程序的开发非常简单,直接点击https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html?t=1496882410 根据不同的系统选择开发工具进行下载,而软件的安装也完全是傻瓜式安装,不存在什么需要注意的点。软件安装好之后,图标如下:

如果你成功的安装好了开发工具,那么恭喜你,你已经搭建好了所有的开发环境,怎么样,简单吧。

而软件的内部操作界面如下:

无论是调试还是代码的编辑还是查看代码的运行仅需要这个开发工具就已经足够了。

账号的注册

当我们开发微信小程序的时候,需要使用appId,用来验证身份,所以就需要注册账号。

点击这里 https://mp.weixin.qq.com/ 即可进行账号的注册和登陆。

在页面的右上角点击立即注册,既可以进行注册

进入注册页面后选择小程序。

点击小程序模块进入后,输入基础信息进行注册

三步:账号信息 - 邮箱激活 - 信息登记

注册完成后重新进行登陆。

输入账号密码后使用绑定的微信号扫描二维码即可进入如下网页:

在左边选择设置,可以找到开发AppID。

项目创建

我们需要通过开发者工具,来完成小程序创建和代码编辑。

开发者工具安装完成后,打开并使用微信扫码登录。选择创建“项目”,填入上文获取到的 AppID ,设置一个本地项目的名称(非小程序名称),比如“我的第一个项目”,并选择一个本地的文件夹作为代码存储的目录,点击“新建项目”就可以了。

为方便初学者了解微信小程序的基本代码结构,在创建过程中,如果选择的本地文件夹是个空文件夹,开发者工具会提示,是否需要创建一个 quick start 项目。选择“是”,开发者工具会帮助我们在开发目录里生成一个简单的 demo。

项目创建成功后,我们就可以点击该项目,进入并看到完整的开发者工具界面,点击左侧导航,在“编辑”里可以查看和编辑我们的代码,在“调试”里可以测试代码并模拟小程序在微信客户端效果,在“项目”里可以发送到手机里预览实际效果。

点击编辑既可以对代码进行编辑。如果需要调整编辑器字体等相关内容,可以点击左上角的设置。

微信小程序开发 -- 01的更多相关文章

  1. 微信小程序开发01 --- 微信小程序项目结构介绍

    一.微信小程序简单介绍: 微信官方介绍微信小程序是一个不需要下载安装就可使用(呵呵,JS代码不用下载吗?展示的UI不用下载吗?)的应用,它实现了应用“触手可及”的梦想,用户扫一扫或搜一下即可打开应用. ...

  2. 微信小程序开发 [01] 小程序基本结构和官方IDE简介

    1.小程序账户注册 实际上在进行开发时没有注册小程序账户也是可以的,官方提供的IDE提供实时编译模拟预览,和当前你有没有绑定小程序账户没有关系. 当然,最终你要正式上线你的小程序的话,肯定还是需要账户 ...

  3. 微信小程序开发笔记01

    微信小程序开发的优势 1,不用安装,即开即用,用完就走.省流量,省安装时间,不占用桌面: 2,体验上虽然没法完全媲美原生APP,但综合考虑还是更优: 3,对于小程序拥有者来说,开发成本更低,他们可以更 ...

  4. 微信小程序开发之模板消息

    一.添加模板 登录https://mp.weixin.qq.com获取模板,如果没有合适的模板,可以申请添加新模板,审核通过后可使用,详见模板审核说明 页面的 <form/> 组件,属性r ...

  5. 零基础入门微信小程序开发

    注:本文来源于:<零基础入门微信小程序开发> 课程介绍 本达人课是一个系列入门教程,目标是从 0 开始带领读者上手实战,课程以微信小程序的核心概念作为主线,介绍配置文件.页面样式文件.Ja ...

  6. 微信小程序开发-入门到熟练(wepy-初级篇)

    Title:最近做完了项目,review代码的同时,就想写一篇详细的小程序开发经历,记录自己的项目从0到1的过程 Desc : 小程序从0到1,从小白到完成项目,你需要这样做: step1: 基础知识 ...

  7. 微信小程序开发心得

    微信小程序也已出来有一段时间了,最近写了几款微信小程序项目,今天来说说感受. 首先开发一款微信小程序,最主要的就是针对于公司来运营的,因为,在申请appid(微信小程序ID号)时候,需要填写相关的公司 ...

  8. 【微信小程序开发•系列文章六】生命周期和路由

    这篇文章理论的知识比较多一些,都是个人观点,描述有失妥当的地方希望读者指出. [微信小程序开发•系列文章一]入门 [微信小程序开发•系列文章二]视图层 [微信小程序开发•系列文章三]数据层 [微信小程 ...

  9. 微信小程序开发日记——高仿知乎日报(下)

    本人对知乎日报是情有独钟,看我的博客和github就知道了,写了几个不同技术类型的知乎日报APP 要做微信小程序首先要对html,css,js有一定的基础,还有对微信小程序的API也要非常熟悉 我将该 ...

随机推荐

  1. centos GUI界面与命令行的切换

    Linux 系统任何时候都运行在一个指定的运行级上,并且不同的运行级的程序和服务都不同,所要完成的工作和所要达到的目的都不同.Centos设置了如下表所示的运行级,并且系统可以在这些运行级别之间进行切 ...

  2. DirectFB 之 分段动画

    动画动态配置 一套素材的目录结构一般如下: 子目录中的图片名称都是以数字命名,比如,1,2, 3, 4,--        而配置文件animation.cfg的格式如下: #width height ...

  3. SVM流行库LIBSvm的使用和调参

    简介:Libsvm is a simple, easy-to-use, and efficient software for SVM classification and regression. It ...

  4. js判断字符串是否全为空(使用trim函数/正则表达式)

    我们需要判断用户输入的是否全是空格,可以使用以下方法: 方法一: 使用trim() /* 使用String.trim()函数,来判断字符串是否全为空*/ function kongge1(test) ...

  5. get和post提交数据的区别

    get是客户端向服务器索取数据的请求,设定的初衷是,客户端(浏览器)给服务器发送请求,然后服务器再返回给客户端其要求的数据. 那么为什么说get也能提交数据呢? 我们仔细理解第一句话“客户端(浏览器) ...

  6. Ajax与Pjax请求在服务端是如何识别的

    我在后台处理ajax和一般的网页请求时,一般是需要额外加个参数进行区分的.比如使用get参数的is_ajax=1,后台判断有is_ajax=1成立时,表明该请求是ajax请求,遂可区分处理.我正在使用 ...

  7. 在R中整理数据

    原始数据一般分散杂乱,并含有缺失和错误值,因此在进行数据分析前首先要对数据进行整理. 一.首先,了解原始数据的结构. 可使用如下函数(归属baseR)来查看数据结构: class(dataobject ...

  8. Servlet的线程安全

    Servlet的线程安全 一.什么是Servlet的线程安全 1.在Servlet的整个生命周期中,构造方法只被执行一次.也就是说,在Servlet的整个生命周期中,只存在一个Servlet实例对象. ...

  9. 仿中关村win8频道(win8.zol.com.cn)下的tab效果

    最近觉得中关村win8频道下的那个Tab效果很好看. 一时兴起就自己做了一个.觉得还蛮不错的,特地来给大家分享一下.以下是相关的HTML页面写法: <div class="popula ...

  10. 【JAVAWEB学习笔记】02_HTML&CSS

    //--------------纯文本版------------------------------------------------- 今日新增单词(更多属性查看手册) form:表单 (要提交的 ...