本课程已经线上线下混合式教学实施了2轮:
1,第一轮面向大四同学的毕业实训,一共70位同学通过5天,10个半天完成了10次教学内容,同学们反映提供的资料非常的充分,学习的过程十分的顺利,配合视频的讲解,将这次小程序实训的难点和疑点都十分清楚的讲解了出来。同学们通过屏幕左侧的模拟器页面非常直观的看到了每一段代码运行后的功能,受到了极大的鼓舞,强烈的激发了同学们学习兴趣,毕竟很多书本知识都无法立即看到产生的效果。
2,第二轮面向大二同学的选修课,一共130位同学将学习15周,每周3节课,其中前10周完成本课程的10次教学内容,后面5周完成一个微信小程序的项目开发。目前在浙江省高等学校在线开放课程共享平台 https://zjedu.moocollege.com/course/detail/30008277 已经完成了5周的教学,同学们学习非常认真,95%的同学每周的视频、测试、作业都能按时完成,并表现出了极大的学习兴趣和热情。
一、本课程共有30个教学微视频,共10章,需要完成10次作业,10次测试,视频总时长达213分钟。
二、本课程共30个学时,1学分,开课时间为2019年4月15日 至 2019年6月29日,共10周;
三、 本课程内容共分为2个模块,第一模块内容为小程序前端开发;第二模块内容为后台环境搭建。配套线下教材为《微信小程序开发从入门到实践微课视频版》,清华大学出版社(预计19年11月出版)
四、教学计划如下:
周数 学时 教学内容
1 3 hello微信小程序
2 3 习题练习案例开发
3 3 我的页面模块开发
4 3 信息修改模块开发
5 3 课程页面模块开发
6 3 课程练习模块开发
7 3 签到测距模块开发
8 3 初识后台与数据库
9 3 接口开发与云平台
10 3 初识云开发及实战
五、特色和亮点
本课程团队包括4位教师,以及由各年级十多位本科生,四位研究生组成微信小程序在线教学团队,团队成员擅长PHP、HTML,CSS,JS等语言。本课程基于团队多年的微信应用人才培养经验,建设一门“微信小程序项目开发从入门到实践”课程。本课程教授读者微信小程序开发和云服务的相关知识,根据团队开发运行的豆豆云助教小程序展开案例教学,使得学习者通过模仿激发小程序开发学习热情,让学习者快速掌握开发基于云服务的微信小程序能力。
建设一系列微信应用开发实战课程,让更多学生和想从事微信小程序开发的人员,能更快掌握开发语言和开发项目的具体实施内容,让每个参与课程的学生都能开发自己想做的内容,以微信小程序形式展现出来。以本团已经开发使用的豆豆云助教在线教学平台案例为基础,依托新浪云建立基于云服务的在线微信小程序实践平台,让每位同学都具有独立开发微信+云平台的在线信息处理平台能力。
计算机基础、C语言、网页编程。
综合成绩大于60分。
1. 微信小程序官方教程:https://developers.weixin.qq.com/miniprogram/dev/
2. 学堂在线课程:https://www.xuetangx.com/courses/course-v1:TsinghuaX+2018032801X+2018_T1/about
3. 周文洁,微信小程序开发零基础入门,清华大学出版社,2019
Q : 大二同学完成第一次课程的心得节选
A :
心得1:首先,这是我第一次接触微信小程序的设计,老实说,本以为照着视频所讲做会很容易,但我也遇到了这样那样的问题。一开始因为我的粗心,选择了云开发(应该是普通快速启动模板),之后因为软件问题导致电脑老是提醒我不是开发者(相同操作五遍后成功了)。所以,综上我认识到了做这个开发一定要细心,其次,当你软件出现这样那样的问题时,不一定是你的操作有问题,有可能是软件的问题,要对自己有信心。要大胆,细心与自信!
心得2:通过本次课程,加深了我对微信小程序的了解,了解了微信小程序给我们生活带来的便利,让我对自己动手开发自己的小程序产生了浓厚的兴趣。之后通过在源代码上进行修改,可以将微信名称换个颜色。
心得3:这是第一次尝试自己进入小程序后台做属于自己的小程序,感觉挺有意思的。跟着老师给的PPT一步一步做下来也还算顺利,按照PPT上面进行了自己的个性化修改。讲过第一节课的自己动手操作,对这个课程有了最大致的了解
心得4:第一次尝试自己开发小程序,前期的准备工作做了很久才做好,虽然是最简单的hello world程序也花费了很长时间,并且在教学视频的帮助下学会了更改界面颜色等等操作,很实用。
心得5:按照文档和视频一步一步来做小程序,虽然中间很曲折,不过弄完还是很有成就感的,刚开始一直把原始账号当成APPID,所以一直都登不上去,后来才知道APPID在设置里面。粗略知道了web小程序开发工具的使用(改了一下代码,把颜色换了一下)。
心得6:这是第一次打开微信小程序开发环境,今天完成了新浪云账号的注册,微信小程序开发账号的注册,跟随网课学习了怎么使用web 开发工具,然后APPID一开始没有找到,后来是在小程序微信公众平台的开发设置中找到,修改颜色一开始也没有太清楚,后来找到了位置就进行了修改,主题颜色也可以设置修改,后来把它在手机界面上显示是先进行预览,然后二维码会给出,扫描后即可进入,刚学了一点点,还很浅薄,以后继续加油吧
心得7:这不是我第一次接触微信小程序,却是我第一次作为程序员的身份接触微信小程序,感觉就像学习一门全新的语言一样,有一种新鲜感,但是万变不离其宗,虽然在形式和方法上有些许不同,但是根本上还是编程语言的使用,希望能在这门课上学到更多东西
心得8:今天初次了解了微信小程序的开发流程,并自己申请了一个账号进行尝试。安装完开发者工具,跟着步骤走,成功创建完成了Hello World小程序。(一开始没搞明白AppID到底是什么,输了好久一直出错,百度后才知道要在微信公众平台的基本设置中查看)
心得9:第一次做微信小程序有点紧张!!首先是在微信公众平台上创建自己的小程序号,并且复制自己的APP ID 这对于我来说没什么问题,后面的问题就出现在微信开发者工具上后端服务的选择不知所以,所以就把三个试了试,试出来了。对于小程序的修改,我主要改了以下三个方面:
1.app jason 修改上面框架颜色为fee 淡粉色
2.app jason 修改框架上的字为Hyj WeChat
3.index.js 修改页面字motto为Hi World!
虽然只做了这一点点修改,但是这是我小程序迈出的第一步,还是挺感兴趣的!
Q : 大四同学完成一轮微信小程序课程的体会节选
A :
体会1:
我从这几天的实习生活中,得到很多的收获与体会,主要为以下几个方面。
1)“微信小程序开发”通过视频教程、代码教学、线下答疑的方式,讲解了微信小程序开发者文档中的干货,解释大部分的难点和重点,感觉比从基础从头开始学习的效果更好。这种通过项目学习的方式使有过代码基础的人更快、更便捷地进行小程序的自主开发。
2)学会了小程序开发方式并完成了“近现代史纲要题库”小程序的前端建立与新浪云的后台建立。该小程序具有课程、我的、测距三大界面,能够实现注册登录、修改信息、在线做题(可分章节、分类型)、收藏与错题回顾、测距等功能。
3)在开发基础上,进行了《易停车——基于微信小程序的智能停车系统》项目申请书的撰写。在这过程中,将学习的知识转化为了实际的项目,申请书的内容包括:内容简介、项目意义、目的、背景、研究方案、创新点、预期成果等,为将来的学习和工作积累了宝贵的经验。
体会2:
首先,申请了一个小程序号,下载了微信开发者工具。接着,认识一下微信开发者工具这个平台。其中pages与utils文件夹、app.js与app.json文件不可缺,其他文件夹均为手动添加,存放小程序所需文件。pages:主要存放小程序的页面文件。为方便管理,一般每个页面对应的4个文件放置于同一文件夹,目录结构可自定。utils目录主要用于存放全局js文件,公共用到的一些事件处理代码文件可以放到该文件夹下,用于全局调用。小程序所呈现页面均由4个文件构成,分别是*.js、*.wxml 、*.json 、*.wxss。其中,app.js 这个文件是整个小程序的入口文件,开发者的逻辑代码在这里面实现,同时在这个文件夹里面可以定义全局变量。app.json 这个文件可以对小程序进行全局配置,决定页面文件的路径,窗口表现,设置网络超时时间,设置多tab等。该文件内不可包含注释,否则不可运行。app.wxss 是小程序的公共样式表。
接下来,通过案例教学,课程的教学内容在网易云课程上观看。我一边观看,一边在微信开发平台上试验。由于在开发中,本以为画面不是很流利,实际上完全出乎我的意料,动画效果很流畅,可以与ios,andriod app相媲美。我主要学习了授权登录页面、注册页面、我的页面、修改我的信息、myInfo页面调整、change页面配置文件、课程模块、做题模块、错题与收藏模块的开发。最后,依托新浪云建立基于云服务的在线实践平台,将代码上传到云端。
在这一系列的操作中,难免会遇到一些问题。首先,因为粗心的毛病,经常会遇到一些遗漏,多添加,拼写错误等等的一些毛病,因为这些小小的疏漏之处,我的程序就这样卡死了,捉襟见肘,一直进行不下去,浪费了大把的时间。其次,视频比较模糊,分辨率不高,我眼神也不太好,就经常看不清楚,容易弄错。视频和讲义的内容交错了,有的讲义上没有,有的视频里没有,漏了一部之后,后面的全都编译不出来了。再次,我对微信小程序的开发以及其他程序的编写不是很熟练,对于一些简单的操作也不是很水到渠成,对于一些简单的错误也不能及时发现,所以,在代码敏感度这一方面,我还是有待于加强的。当然,今后,我也会运用更多的编程软件,来弥补我自己的这一缺陷。
体会3:
(一)实践主要内容及进程
1、对这次的微信小程序开发进行了一次系统的了解,主要依靠指导老师的视频和网上上传的课程对本次校内实训的主要内容具体详细的观看了一遍。
2、完成了微信小程序的环境的搭建,其实非常的简单,只需要下载微信web开发者工具就可以了。然后申请了专门的微信小程序账号,通过微信公众号平台注册,观察浏览了小程序中的相关代码。
3、通过网上上传的微信小程序开发的课程视频,一步一步完成了本次微信小程序开发的程序的代码的编写,首先是完成了框架的搭建,在前几天完成了登录页面、注册页面、我的页面的相关信息,并且可以成功的将注册的信息在我的页面显示出来。
4、随后完成了课程模块的相关功能,并且可以通过本地数据库将课程题目成功的导入,并在课程模块里显示出课程的题目。在习题测试里面也可以顺利的进行测试,记录错题,可以收藏想要收藏的题目。
5、添加了一些额外的功能,比如测距功能等,并且优化了页面的布局和设置,将新添加的模块在主页设置了链接。
6、将数据库的内容导入新浪云,并通过相关修改让小程序可以顺利的从新浪云里面的数据库中下载并导入数据库的题库内容。
7、完成了实训主要内容后,通过了指导老师的测试和校验,完成了心得体会报告并上传,最后在实训结束后编写项目申报书,在随后的时间里完成了项目申报书并上传。
(二)主要收获与体会
这次的微信小程序校内实训提供的资料非常的充分,当我下好这些资料并进行了解和学习的过程十分的顺利,配合视频的讲解,将这次小程序实训的难点和疑点都十分清楚的讲解了出来,让我在这次微信小程序的学习和开发中少走了不少的弯路,虽然有很多的代码都是靠借鉴和复制过来的,但是在视频中也对很多的代码的功能和用处进行了详细的解释,也让我在开发的过程中,对很多的代码都有了自己的认识,深深的记载在自己的脑海中,倘若以后我参与了与微信小程序开发相关的一些项目开发和工作的话,并不敢说自己的编程能力有多好,但是我相信在思路和思维方面,我应该会有一个十分清晰的脑回路;第一天进行实训的时候,听到要配置微信小程序开发的一些环境的时候,还以为又要安装许多麻烦的东西,还要配置环境变量啥的很复杂的东西,但是真正去配置的时候,发现特别的方便,只需要安装一个微信web开发者工具,并在微信公众平台注册一个微信小程序的账号就可以了,我感觉这也是微信小程序相对于app等开发的优点吧;进入微信web开发者工具,界面十分清楚,简洁,在开发的过程中时刻可以了解相关代码在界面中的实现,每当写入一些代码并在界面里面正确的显示出来的时候,感觉会有一丝满足感,通过结合word文档的提示和视频的讲解,这次的微信小程序开发其实是非常简单的,虽然我们以前对小程序的相关知识并没有很多的了解,但是我们只需要了解其中最基础的功能实现和每一个文件所承担的作用,就能够很容易的完成此次微信小程序的开发,而这些功能和文件的作用在word文档和视频中都很清楚的解释了。当然在微信小程序开发的过程肯定不是一帆风顺的,我也遇到了很多卡壳和编译出错的地方,例如在如何把在主页面注册的信息正确的转送到服务器去的时候,我跟着学习开发的程序总是不能够正确的将注册的信息获取并转送,后来通过仔细对视频的学习和老师的指导,终于发现是有一段代码中value的赋值出的问题,并没有将this.data加入到代码中去,所以value变量总是得不到我输出的信息,进行了修改之后编译就完全正确了,由此可以看出,即使是微信小程序的开发编程过程中一点小小的错误都会让整个程序无法正常的运行,这告诉了我对编程一定要十分的仔细;其次在后来编写getCurrentCourse函数的时候,用current接口接收课程号和相关课程和题库信息的时候,接收标识总是false,这个问题困扰了我很长时间,视频中因为操作正确而没有提及有此问题,有段时间我都有要重新开始的念头,不过对程序代码进行仔细的检查和对console,network和storage的信息的观察后发现,原来是storage中接收的课程号并不是我创建的课程号,所以current接口在判断课程号的时候总是不一致,无法接受课程的信息,通过助教和老师的帮助删除了错误的课程号注册信息后,将正确的课程号与注册信息输入后,current函数就可以正确的接收相关信息了,通过这一个问题,我深刻的体会到,不管资料多么的详细,不管视频做得多么易懂,很多程序开发和编程需要我们亲自去实践才能找到很多没有提及的问题,因为每个人的实践都是不同的,总会发现一些不相同的问题,而这些问题不可能全部被资料和视频提及,这些问题对我们来说也是最重要的,当我们解决了这些问题后,我们才会真正的学习到一些东西,并且将相关的知识深深的印刻在自己脑海里面,我相信这些才是这次微信小程序开发校内实训给我们最大的意义和帮助吧。
最后在顺利的将豆豆云助教这个小程序中一些最简单的代码正确的编写成功后,在自己的手机中将小程序成功运行之后,我感觉到十分的满足,虽然还存在着一些小bug,也有一些多余的代码和功能没有解决和删除,但也算是勉强可以运行了,这或许是我参与的第一个关于微信小程序开发的小程序了,虽然核心的代码是如何实现的,每一个函数之间是如何相互传递参数,接口中的信息如何传入服务器等原理我都没有细致的理解,但是整个开发的框架和开发的思维我都有掌握,俗话说“完事开头难”,这次的微信小程序开发也是我第一次接触,但是学院通过这种简单,清楚,详细的方式让我这么容易地去了解微信小程序,去学习微信小程序的开发,让我在学习的过程中十分的顺利,我感觉这其中也包含了老师,助教的劳动结晶和心血在里面;因此我感觉十分的荣幸,也庆幸这次能够选择微信小程序开发这一个校内实训,对我的大学生活有着很大的意义。
体会4:
虽然这次校训实习的时间只是短短五天,但我还是从中学习到了点东西,对微信小程序整个过程有了一定的认识和理解,也提高了自己的独立动手能力上,认知了自身的一些性格上的缺陷,接下来我就简单概述这五天实习的内容和过程以及其中遇到的一些问题。
这次实习主要就是通过一个案例教学,让我们可以依托新浪云建立基于云服务的在线实践平台,让我们对独立开发微信小程序整个过程有一定的熟悉认知和对一些代码方面有一定的理解,我们做的是一个可以注册自己的信息然后登入进行答题的一个微信小程序,整个过程分为开发环境配置、页面布局、修改页面、课程模块、做题模块、错题与收藏、签到测距、后台与数据库。开发环境配置在实习前就已经自己根据WORD材料配置好了,主要就是安装好微信Web开发者工具,然后再自己通过邮箱注册一个微信小程序账号,这个过程还是蛮简单没有遇到过什么问题,然后第一天就着手学习页面布局:首先是授权登录,每一个小程序都有一个openid,既用户标示符,通过这个建立一个普通快速启动模板,完成后,在app.js文件的wx.login()方法中进行微信授权登陆,登录后进入到注册页面,所以要新建register页面,然后再增加一个样式可以创建style目录然后放进想要的样式代码文件,最重要的还得在app.wxss里引用这个样式,我在做这个的时候就卡住了一段时间,就是没有引用,所以说写代码得心细,缺一少两都会使结果没有达到预想的效果。然后调用register_by_openid并返回注册成功之后,就已经往数据库写入该用户的注册信息了,到此完成了注册的流程。我在做这个注册的过程就遇到了个问题,就点击注册的时候弹出姓名不能为空,后来通过他人帮助下解决了这个问题,原因是漏了bindchange这个属性,所以说遇到问题时一定得虚心求教,这样才能更有效率的解决问题。后面的那个修改页面信息我照着视频做,视频里老师讲的非常清晰,跟随老师说讲去做没有遇到什么问题。
第二天就开始着手课程模块,首先通过一个链接申请课程,其中appid代表你的小程序的appid,courseName代表要创建的课程的名字,questionSet代表实现预设的题目集,creater代表创建者创建成功后就可以获取课程号的courseId,然后在config.js文件中加入courseId,再对页面进行布局,增加样式。做题模块上,我们找到的是一个与驾校考题相关的小程序,该小程序具有模拟考试、章节练习、专题练习、顺序练习和随机练习的功能,用户可选择自己需要的练习方式刷题。另外还有收藏题目与错题回顾的功能,帮助用户更有针对性的学习。在我们自己的小程序的pages文件夹中新建一个answer文件夹,将复制过来的answer_chapter到mark页面黏贴在answer文件夹下,然后我们自己还得在app.json上更改下自己的路径,answer文件下的每个js也要更改路径,可见写微信程序代码里文件的路径是重中之重,即使你其他代码写的完美无缺,粗心写错路径那也编译不出想要的效果。后面的错题收藏,首先写一个getCurrentCourse函数,用current接口获取课程相关信息,保存在current_course。写完getCurrentCourse函数后,在onload函数中加两句代码调用该函数并打印,然后实现错题与收藏功能,需要完善错题与收藏在index.wxml中的bindtap函数。后面那个测距跟随视频和WORD资料做没有遇到什么问题,资料里讲的都非常清楚,主要就是拷贝下代码,然后修改点东西。
最后在做后台与数据库的过程中遇到过3次问题,做本地时在最后编译那出错,是由于自己apiurl的路径弄错。云端的第一个问题重新注册申请课程号时显示为找到该注册的openid,后来发现是由于自己在修改完新浪云中目录为Application/Api/config/config_sae.php和Application/Common/Conf/config_sae.php代码中的数据库名用户名密码没有进行保存。第二个问题是自己在没有重新注册新课程前将自己原本的那个课程号加入了新浪云数据库管理中的pingshifen_class,导致后面新注册申请的课程号覆盖不了原来的那个,所以编译时显示加入的人数为0,错题与收藏收藏不了。
通过这五天时间的实训,我对整个微信小程序开发前端的整个过程框架上有了一定的认知熟悉。小程序开发框架的目标是通过尽可能简单、高效的方式让开发者可以在微信中开发具有原生 APP 体验的服务。框架提供了自己的视图层描述语言 WXML 和 WXSS,以及基于 JavaScript 的逻辑层框架,并在视图层与逻辑层间提供了数据传输和事件系统。但对代码只有一定的理解,毕竟实训的时间太短,想要掌握编译代码还是不行的,不过收获还是蛮多的,至少学到了一些代码是具备什么功能的。还有性格上认识了自身的一些缺陷,就是耐心和细心,从事代码方面的工作一定得具备这两大点,我在跟随视频做的过程,明明视频上讲的是清清楚楚,自己也跟着一步一步做,但也经常出现编译时发生错误,就是因为自己不够细心少了一段代码或者输错一个字母,然后发生错误后就会有点急躁静不下心,缺少耐心去寻找哪里出错的地方。还学到一点就是要善于去虚心求教,写代码真的就自己一个人去学很难学,即使具备齐全的资料有些地方还是弄不懂,尤其是编译错误自身很难找出错误的地方并加以解决,所以学会虚心求教,主动找懂的人去解决问题可以达到事半功倍的效果。然后就是感觉实训的时间太短,虽然有着视频和WORD文档内充足的资料,但缺少时间去理解代码,更多的仅仅就是从模板那里拷贝过来,然后自己修改点东西,对整个过程是有一定的认知了,但学不到动手自主去写代码的能力。
体会5:
12月26日,我们开始了本次的校内实习。实习期间,我们按照分好的小组,在老师和两位助教的带领下进行为期一周的校内实习。在这一周的时间内,我们通过学习与实践相结合的方法完成老师布置的任务。老师对于我们每天该完成的任务都是有合理安排的。在这一周的时间里,我不止学会了如何搭建一个微信小程序,更明白了未来踏上社会的时候该如何做。
这次校内实习我们依托新浪云建立基于云服务的在线实践平台,做一个辅助教学的小程序。在实习还未开始之前,我们就已经做好了微信小程序和新浪云的注册准备。这次实习,我们在网易云课堂上观看助教事先录好的教学视频,通过实践验证学习,在学习中加强实践。
第一天,我们先搭建了小程序的运行环境,创建了一个QuickStart项目,分析该项目的目录结构,通过学习这个项目中每一个文件的意义,明白了整个微信小程序是如何配合工作的,配合微信小程序文档来学习各种组件、API的使用方法。在第一天快结束时,我们将当天完成的微信小程序打包提交为体验版,让助教们可以查看我们的完成进度。
第二天,我们构建了授权登录、注册、我的信息、修改信息页面,此时我们使用的接口还是测试接口,后期布置到新浪云之后才会使用搭建在新浪云服务器上的接口。在这里我遇到了一个问题,修改信息页面修改提交之后跳转到我的信息页面,此时我的信息并不会马上更改过来,而是需要刷新小程序之后才能更改过来,我猜想是因为我们跳转回原来的页面,没有再一次到服务器中去获取信息,而是直接获取本地信息,而本地信息的更改有时间延迟,我尝试着想解决这个问题,但没有得到解决,于是这个问题就搁浅了。
第三天,我们进行了课程模块和做题模块的制作。这部分是整个小程序的核心内容,做题模块是在github上面找的开源的成熟的做题模块,但里面有许多内容其实是我们不需要的,因此还需要慢慢的修改、删减。这里需要我们足够细心并且有耐心,否则就很容易出错,而且由于不是我们自己写的代码,查找错误也会比较的费时间。
第四天,我们完成了错题与收藏功能,并且另外完成了一个经纬度测距的小程序。错题与收藏功能较简单,而经纬度测距是想让我们理解在线签到功能,但由于这个功能还设计到教师端,因此只是通过这个小程序帮助我们理解在线签到是如何实现的。测距的方程我们同样是从网上寻找的现成的功能,因为我们确实不擅长这个方面。
第五天,我们进行了后台与数据库的部署,在这个部分我们进行了本地和云端两个方面。在新浪云部署的时候遇到了一点问题,但在助教的帮助下也很快解决了。
通过这次实习的项目,我对微信小程序的了解有了很大的提升。我很喜欢这种边学习边实践的方法,这让我很快的就能知道自己的学习是不是有用、自己的能力是不是有所提升。对于微信小程序,我还有很大的学习空间,这次实习只是一个开始,远远不是结束,学习也永远不会结束,总有新的东西可以让我们去学习,就像微信小程序也是一个新的东西,未来还会有更多新的框架,学习是永远不会停止的,如果想提高自己的能力,或者不想被别人超越,就只有不断地学习。
在这次校内实习之前,我接触过React框架,其实微信小程序和React从根本上来说是很相似的,这两者都推崇模块化、组件化、数据与元素绑定。这样没有繁琐的DOM操作,组件之间完全分离,样式和逻辑全都封装在模板里,别人写好的组件可以拿来直接用,这会明显地提高我们前端开发的速度。微信小程序相比较React,体积会更加小一点,而且很多API都是可以直接拿来用的,这是非常方便的,对于有前端基础的人想开发小程序是很好上手的,这是微信小程序一个很大的优点。
记得最初自己看视频敲代码的时候,就是那种很小心,视频里面是怎么样的,我就怎么样敲,连一丝丝都不敢改动。然后关了视频之后自己想敲一段代码,就觉得不知道该从哪里入手。有一句话挺恰当的,看着代码敲就像是老师讲课,一条路到终点,而自己写中途就可能会遇到各种问题,但是正是这个过程能够让你认识到这个框架的各种细节问题,从而帮你更快速的熟悉框架。跟着老师做固然不会有错,但是如果你一直都是跟着做,那或许永远你都没有办法自己做,我们只有在跟着做的基础上,再加入自己的理解,把所学的知识变成自己的,我们才可以自如地运用这些知识。在暑假刚开始接触小程序的时候,我那时是要修改一个项目,我就不敢很大的去改动它,怕代码会出错,然后后面遇到了一个问题,我就是照着代码原来放在什么生命函数里面就放在什么里面,然后页面一直没有办法出来,看了很多资料,才知道有生命周期这个概念,然后才明白每个生命函数的作用以及该如何渲染页面。我想,在学习的过程中遇到错误其实是一件很好的事情,通过这个错误,我们能学习到更多的东西,在解决错误的过程,其实我们已经在把知识转换为实践,并且成为了自己的东西。
这次的校内实习我有一个建议,在案例完成之后,我觉得可以布置一个小作业让同学们自己完成,这可以更好地检验同学们的掌握情况。好像没有压力就没有动力,老师布置的作业肯定会让我们更有动力去完成,这也能更好地巩固所学的知识。
体会6:
这次我们实习的主题是《微信小程序开发从入门到实践》,时间从12.25到12.30,历时5天。微信小程序,简称小程序,英文名Mini Program,是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或搜一下即可打开应用。它是一种不用下载就能使用的应用,也是一项门槛非常高的创新,经过将近两年的发展,已经构造了新的小程序开发环境和开发者生态。小程序也是这么多年来中国IT行业里一个真正能够影响到普通程序员的创新成果,现在已经有超过150万的开发者加入到了小程序的开发,与我们一起共同发力推动小程序的发展,小程序应用数量超过了一百万,覆盖200多个细分的行业,日活用户达到两个亿,小程序还在许多城市实现了支持地铁、公交服务。小程序发展带来更多的就业机会,2017年小程序带动就业104万人,社会效应不断提升。微信小程序是一个正在兴起的产业,而这次实习是我们学习和了解微信小程序的重要机会,我会认真学习对待。
本课程通过案例教学,让我们可以依托新浪云建立基于云服务的在线实践平台,让每位同学都具有独立开发微信小程序+云平台的在线信息处理平台能力。让想从事微信小程序开发的同学能更快的掌握开发项目的具体实施过程,让每个参与课程的学生都能开发出想解决复杂信息化系统,以微信小程序的形式展现出来。我们的学习过程分为九章,分别是:第一章微信小程序开发流程、第二章小程序目录结构与文件、第三章我的目录、第四章修改我的信息、第五章课程模块、第六章做题模块、第七章错题与收藏、第八章经纬度测试demo、d第九章后台与数据。通过九章的学习和实践,我们通过对“豆豆云助教”这个小程序的搭建的过程的学习,对小程序的编程有了初步的了解,对增删改查有了一定的掌握。
当然,在实验的过程中,我们也遇到了各种各样的问题。因为小程序所呈现页面均由4个文件构成,分别是*.js 、*.wxml 、*.json 、*.wxss,而4个文件之间的关联性又决定了你的小程序能否实现,在实践过程中,常常会因为相应的文件没有对应起来,导致找不到目标的错误,比如忘记在开头引入公众变量const、忘了在app.json中加入相应的page路径,期间我们还引用了微信官方的样式文件,weui.wxss,但要注意的是要在使用的wxss文件开头,引入该样式,即@import “style/weui.wxss”。另一个遇到很多困难的地方是在做到第六章做题模块的时候,由于我们还是初学者,做题模块是直接将别人做好的现成模块导入到我们的程序当中,在“本地化”的过程中,我们遇到了不少问题。首先是原程序中的路径都是相对路径,而引入我们的程序中之后,相对路径就要发生变化,譬如我们在复制过来后需要在每个页面路径加上一个answer/,因为我们将文件放在了/page/answer下。
在引用的过程中,我们的api接口也相应的进行了变化,一开始我们是使用https://zjgsujiaoxue.applinzi.com/index.php/Api接口,后来申请了新浪云之后又改成了https://6.jiaoxue8.applinzi.com/index.php/Api接口。当然,遇到的最大的问题还是在搭建后台过程遇到的,在照着教程做的过程中,修改数据库连接信息的那一步,要修改两个config.sae.php文件,一开始只修改了一个,导致无法引入数据库中的数据。后来修改后又发现题库和我申请的不匹配,检查过后发现是在申请课程时候的代码填写错误,之后通过进入后台数据库,删除了对应错误课程号的信息,重新注册后成功。
对课程的建议:教学文档和教学视频的代码有一定出入,结合使用的时候容易出现错误,然后前八章的教程还是很有用的,第九章关于后台和数据库的搭建缺少视频资料,参考文档步骤也有欠缺,而且我们对后台接触的不多,刚上手遇到了不少的困难。希望之后的教学能够把后台搭建的教程完善好。
总之,这次实习的意义,对我来说已不再是完成学分、完成毕业实习的任务,而是在开启“微信小程序”大门的过程中迈出了第一步。我一定会好好地珍惜这个机会,感谢老师们和同学们在这段时间里对我的指导和教诲,我从中受益匪浅,整个的实习过程是紧张而愉快的,我的学习态度也得到了回报,一个相对完善的小程序成功诞生在我的手中。作为我在踏出社会之前的为数不多的几次实践中,这次的实践的确给予了我很多,我将继续保持认真负责的工作态度,进一步完善和充实自己,争取在以后的学习中更好的完善自己,在以后的实践中更好的运用去自己的知识。透过实习,能够加深对自我潜力认识,由于大学的学习基本上是理论的理解,而缺少潜力的熟练与加强,缺少实际情景的见证和实践活动的参与,同学之间缺乏必要的交流与比较,使得潜力缺陷都被蒙蔽起来。并且实习生活考验着我们的知识迁移和运用潜力、适应环境的潜力、应对突发事件的潜力等各方面的潜力,为我们带给了不可多得的机遇和平台。透过实习,培养新的思考维度有效发现自己潜力上的缺陷。综合运用所学理论知识、方法、技能,在实习中,巩固专业技能,培养和强化社会沟通潜力,认识社会的需要,发现自身的差距,培养应对现实的正确态度和独立分析解决问题的潜力,培养良好的职业精神,适应毕业以后的实际工作需求。
体会7:
选择“微信小程序开发”这个校内实训,是因为这门课是我们工科类本科教学中的一门重要实践课。微信小程序,是微信官方于2017年发布的一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户通过扫一扫、搜索或单击分享链接的方式即可打开应用,这也体现了“用完即走”的理念,用户不用关心是否安装太多应用的问题。应用将无处不在,随时可用,但又无需安装卸载。小程序能够实现消息通知、线下扫码、公众号关联等七大功能。其中,通过公众号关联,用户可以实现公众号与小程序之间相互跳转。微信小程序的前景十分广阔,它是依托于微信平台的小程序应用,2018 年上半年,微信注册用户已突破10亿,其中日登录人数已超过 9.02亿。在几年的时间内,微信公众平台的发展令人叹为观止,而订阅号、服务号、小程序、企业微信的发展趋势更是不可估量。微信小程序在微信强大的社交影响力支撑下,辅以高效的搜索机制,使得小程序的宣传推广轻而易举,能实现在全国范围内一搜即得,因此小程序用户将分布于全国各地。经过2017年年度调查统计,使用数字化学习的教育机构已占全部教育机构四成。而对于高校大学生,移动学习在数字化学习中占有最大比例。本小程序开发于杭州下沙高教园区,学生基数大,宣传效果较好。开发本小程序旨在吸引广大大学生使用小程序,扩大小程序在学生范围内的影响力。
这门课的教学目的是:可以让我们想从事微信平台,微信小程序开发的同学能更快的掌握开发语言和开发项目的具体实施内容,让每个参与课程的学生都能开发自己想做的内容,以小程序的形式展现出来,最终依托新浪云建立基于云服务的在线实践平台,让每个同学都具有独立开发微信和云平台的在线信息处理平台能力。相较于微信基于微信公众号的学习平台,基于微信小程序的学习平台将占有更大的优势。小程序无需安装,内存占用少,用户体验也比基于微信公众号的平台更为流畅,甚至可以添加到桌面方便使用。
该课程是以“豆豆云助教”为样板学习,我们从第一天,也就是12月25日,我们按照“微信小程序开发从入门到实践”word文档教材进行学习微信小程序的开发,从微信小程序开发流程一步一步开始,先实现了一个Hello World页面,再导入一个心理测试小程序demo,把这个demo更改为C语言习题库。在学习第二章的时候,深入了解了小程序的几个目录。第一个pages目录:pages:主要存放小程序的页面文件。为方便管理,一般每个页面对应的4个文件放置于同一文件夹,目录结构可自定。第二个utils目录:该文件夹主要用于存放全局js文件,公共用到的一些事件处理代码文件可以放到该文件夹下,用于全局调用。全局调用前需要在被调用js文件中使用module.exports = 可被调用的函数;进行声明。在调用时只需在文件中加入const https = require('文件目录');即可调用。随后我们深入了解了app.js、app.json、app.wxss。
app.js : 系统的方法处理全局文件,也就是说文件中规定的函数和数据,在整个小程序中,每一个框架页面和文件都可以使用this获取。每个小程序都会有一个app.js文件,有且只有一个,位于项目的根目录!该文件 App()函数用来注册一个小程序。接受一个 object 参数,其指定小程序的生命周期函数等。aapp.json : 该文件用来对微信小程序进行全局配置,决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。app.wxss:是对页面的整体布局。
了解完基本的小程序结构后,我们就开始一步一步复刻豆豆云助教的功能。我们先从我的页面开始,设计一个userlogin,也就是授权,然后再设计一个注册页面。在实现注册页面后,我们还需要在app.json里面写一个tabBar函数,用来实现分页,我们还要添加一个修改功能给我们的信息主页面,这样我们就需要一个bindtap函数和bindchange函数来实现相应的处理,不然就会在注册时出现问题,比如提示错误什么姓名不能为空、学号不能为空、手机号不能为空等等,实际上你已经在注册姓名文本框那里填写进了你要注册的姓名,这就是因为你没用bindtap和bindchange绑定和处理数据。接下来我们就开始实现主页面,也就是课程页面,包含练习,收藏,错题,专项练习等。这些功能我们可以借鉴驾校宝典这个小程序demo里面的程序,把相应的代码了解透彻后进行后一步。第八章就开始做测距功能,我们要选择位置、获取当前位置以及测出所选位置与自己当前所在位置之间的距离。分别建立chooseLocation和getLocation函数,再添加bindtap函数实现绑定,最后再把网上下载的button样式和可以实现带跳转带文本的list样式修改一下,就可以实现测距功能了。这样我们就基本完成了豆豆云的功能复刻,最后就要在新浪云上进行操作,首先下载wampserver,把我们的代码放进www目录下,根据自己的小组创建路径,完成代码上传。建立共享数据库,把数据库里的账号密码复制用来替换上传代码里的账号密码。后面,我们只要再去新的接口注册一下appid和courseid,更改一下接口,这样我们就完成了后台,可以实现最终效果。“小程序开发”校内实训让我受益良多,熟悉了小程序操作环境和背景,为未来接触小程序建立了坚实的基础。