程序员@IT·互联网

小程序冷启动01 - 磨刀不误砍柴工

2017-06-29  本文已影响380人  杨梅泡酒

工欲善其事 必先利其器

前两天生病,现在基本好转,今天继续小程序冷启动之旅。

在前一篇的《小程序冷启动00 - 小程序的前生今世》一文中,谈到小程序的概念、应用场景以及为什么你需要学习小程序。这篇文章主要聊聊开发小程序的准备工作及开发环境的搭建。

对于一名非程序猿(媛)来说,一听到开发程序,或许内心就会产生莫名的恐惧感。一是对程序的抽象概念无法理解;二是对代码的迷糊。既然是零启动,所以先谈谈与程序有关的基本概念,消除一些人的内心恐惧。

什么是程序?

程序,顾名思义可以理解为处理业务的既定方法或先后顺序,比如法律程序、处理程序等。但在计算机领域,程序是英文的program的中文翻译,意指一组计算机指令,这组指令通过计算机执行可以获得预期的结果。这个与非计算机领域的程序概念类似,都要经过一些步骤的执行,都会有一个预期的结果。

举个例子,计算1到100的和。你会先构思一个计算方法,比如先求1加2,其和加上3,其和再加上4……,最后一直加到100。这其中的每一步都可以想象为一个指令,将这所有的指令组合起来,就是一个计算1到100之和的程序。

当然关于程序,还有更加专业的定义与解释,但对于初学者,暂时可以不用关注。

什么是程序语言?

程序是由一组指令构成,用来表示和描述指令的方法就是程序语言。到目前为止,能被计算机识别和执行的语言已高达上千种,而且这个数量还在不断地增加。但各种语言的使用率相差很大,下图是一个目前主流的语言统计情况:

TIOBE:2017年5月全球编程语言排行榜

从图中可以看出,使用率最高的是Java,其次是C,再次是C++

那么代码是什么呢?代码就是程序语言的具体的表现形式,包括语法与语义两部分,这点与我们常用的汉语与英语是完全一样的。

到目前为止,想必你对程序概念已经有了个清晰的认识,希望可以消除你内心对程序的恐惧和陌生感。

小程序使用什么语言开发?

开发小程序主要用到三种语言:HTML、CSS以及Javascript。不过细心的你可能会发现,HTML和CSS这两种语言都没有在上图的语言排行榜出现,难道它们不够主流不够流行吗?

不是的。HTML全称为超文本标记语言(HyperText Markup Language,简写为HTML),顾名思义,它是一种对文本的标记,即对文本组织和排列的定义和描述,但不会对文本和数据进行处理。在计算机领域,凡是不能对数据进行处理的语言,都不能当作程序语言对待,因而HTML虽然也带有语言二字,但无资格进入程序语言的行列,当然你也无法在榜单上看到它,虽然它是目前使用最广泛的语言(没有之一)。

同样,CSS全称为层叠样式表(Cascading Style Sheets,简写:CSS),用来表现HTML或XML(另一中标记语言,类似HTML)样式的语言,它也不对数据进行处理,所以也不被当作程序语言看待,虽然也是被使用最广泛的语言之一。

如果说HTML是对文本的标记和组织,那么CSS就是对HTML标记的描绘。正如画一幅画,可能会先画出动物的轮廓,然后在轮廓的基础进行着色,最终才能完成一副维妙维肖的动物作品。HTML就是勾勒轮廓的过程,CSS就是选择各种不同颜色进行着色的过程。

HTML和CSS最主要的用途在于网页设计。所以当你打开一个网页时,你应该首先要想到它是主要由两部分组成,一个是HTML,另一个是CSS。下图是一个简单的包含HTML和CSS的页面。

Hello World

其对应的HTML和CSS为:

HTML与CSS

关于HTML及CSS的更多介绍与学习,文末有推荐学习指南。下面来介绍一种真正的程序语言Javascript。

随着互联网的兴起,Javascript被使用的越来越广泛,在上图的排行榜中位居第七。在网页设计中,它用来处理页面的动态内容与交互。比如你想在一个页面中计算123乘以123的值,就可以通过Javascript代码来实现,将结果及时显示和反馈给你。目前基于Javascript有各种前端开发框架,但对于小程序开发,暂时不需要关注那些框架,简单基础的Javascript就可以满足。文末同样有给出Javascript的入门与学习指南。

至此,关于程序的相关概念及小程序所使用的语言全部介绍完毕。现在开始介绍小程序开发所要做的基本工作。

1. 注册一个小程序帐号

微信的公共平台上选择小程序入口,填写相关的信息,作为开发练习,建议注册个人类型的小程序。如果没有邮箱需要,可以先注册一个免费邮箱,推荐163和QQ邮箱。

注册步骤

2. 获取AppID

在注册完成之后,登录帐号,在设置页面中的开发设置中找到AppID,保存在一个记事本里,创建小程序时会用到。


找到AppID

3. 安装微信开发工具

下载微信小程序开发工具,注意根据你电脑的操作系统选择相应的下载版本,一般来说windows系统选择windows 64,苹果电脑选择mac

版本选择 安装完成启动时,要求扫描登录

4. 了解微信开发者工具

扫描登录之后,选择新建项目。然后填写刚才获取的AppID,给项目取个名字,选择项目存放的路径,最后确认新建项目。开发工具的具体使用,在编写代码的过程中介绍。

新建项目 新建项目 编辑,调试与项目

到这里,开发小程序的准备工作已经完成,接下来就可以进行小程序的开发。不过在开发之前,需要明确想要设计一款什么样的小程序产品,所以在下一篇会介绍一些产品设计的基本知识,并着手开始编写一些简单的代码。

开发程序是个实践与积累的过程,关靠看和想无法学会编程,一定要动手写代码去试试,去摸索,只有趟过坑,你才会真正成长。

今天给大家的作业就是花几天的时间去了解和掌握HTML、CSS及Javascript基础知识。

教程推荐:
HTML/CSS教程:http://www.w3school.com.cn/html/
Javascript教程:http://www.w3school.com.cn/b.asp,仅看基础部分。

在学习过程有什么问题,可以后台给我留言或发私信给我,我尽量及时回复。

上一篇下一篇

猜你喜欢

热点阅读