微信课程表小程序(0基础教你用,从入门到发布)

简介: 1.效果图:2.准备工具:3.下载代码4.部署项目1.打开微信小程序:2.AppID查看方式:3.拿出你的小手机扫码、 5.修改课程 6.项目发布

1.效果图:





2.准备工具:


微信开发者工具:微信小程序开发网站


根据自己电脑系统下载对应的版本:



3.下载代码


链接:https://pan.baidu.com/s/11Dy2_0MUreyynIeIQNOdsg  


提取码:ht8u


4.部署项目


首先 先把压缩包解压,记住这个路径。


1.打开微信小程序:



点击黑框:



注意看黑框所包围的东西 这些是重点


这里的目录:就是你刚刚解压文件的路径


后端服务选择腾讯云开发(wx小程序会免费给你送服务器)


2.AppID查看方式:


1.百度搜索如图文字:



3.拿出你的小手机扫码、


没账号就注册一个(记住是小程序账号)


3.登录成功后,在开发设置这里就能找到ID了


5.修改课程


将课程改成属于自己班的:


找到tsj.js并点击打开




黑框是课程时间,对应的代码是:


你们上课时间是多少,就把数字改成多少

    course_time:[
      ['8:40',''],
      ['','10:00'],
      ['10:30',''],
      ['','11:50'],
      ['14:00',''],
      ['','15:20'],
      ['15:50',''],
      ['','17:10'],
      ['18:30',''],
      ['','19:50'],
      ['20:00',''],
      ['','21:20'],
  ],

课程表内容修改:


id负责展示的颜色,id不同 颜色不同


isToday:就是代表星期几,1就是代表周一,2代表周二,一次推类。


classNumber:代表占几个课时,说白了就是长方形的高度。


name:课程的名字


address:教室的号码



  [     //第一周 
        { "id":2,"isToday": 1, "jie": 3, "classNumber": 2, "name": "操作系统" ,"address":"5409" },
        { "id":3,"isToday": 1, "jie": 5, "classNumber": 2, "name": "毛概","address":"6202" },
        { "id":4,"isToday": 2, "jie": 1, "classNumber": 2, "name": "Matlab" ,"address":"2306" },
        { "id":2,"isToday": 2, "jie": 5, "classNumber": 2, "name": "操作系统" ,"address":"5409" },
        {"id":7,"isToday": 2, "jie": 3, "classNumber": 2, "name": "数学建模","address":"1215"},
        { "id":6,"isToday": 3, "jie": 1, "classNumber": 2, "name": "计算机网络" ,"address":"5102" },
       { "id":3,"isToday": 3, "jie": 5, "classNumber": 2, "name": "毛概" ,"address":"6202" },
       { "id":5,"isToday": 4, "jie": 5, "classNumber": 2, "name": "数据库原理及应用" ,"address":"2306" },
         { "id":1,"isToday": 5, "jie": 1, "classNumber": 2, "name": "算法设计与分析" ,"address":"5506" },
        { "id":6,"isToday": 5, "jie": 3, "classNumber": 2, "name": "数据库原理及应用" ,"address":"5102" },
   ],
      [      //第二
     { "id":1,"isToday": 1, "jie": 7, "classNumber": 2, "name": "算法设计与分析","address":"2306" },
        { "id":2,"isToday": 1, "jie": 3, "classNumber": 2, "name": "操作系统" ,"address":"5409" },
        { "id":3,"isToday": 1, "jie": 5, "classNumber": 2, "name": "毛概","address":"6202" },
        {"id":7,"isToday": 2, "jie": 3, "classNumber": 2, "name": "数学建模","address":"未知"},
        { "id":4,"isToday": 2, "jie": 1, "classNumber": 2, "name": "Matlab" ,"address":"2306" },
        { "id":2,"isToday": 2, "jie": 5, "classNumber": 2, "name": "操作系统" ,"address":"5409" },
        { "id":6,"isToday": 3, "jie": 1, "classNumber": 2, "name": "计算机网络" ,"address":"5102" },
       { "id":3,"isToday": 3, "jie": 5, "classNumber": 2, "name": "毛概" ,"address":"6202" },
       { "id":5,"isToday": 4, "jie": 5, "classNumber": 2, "name": "计算机网络" ,"address":"2304" },
         { "id":1,"isToday": 5, "jie": 1, "classNumber": 2, "name": "算法设计与分析" ,"address":"5506" },
        { "id":6,"isToday": 5, "jie": 3, "classNumber": 2, "name": "数据库原理及应用" ,"address":"5102" },],

修改标题:


如图黑框的就是标题


 


打开这个文件:



需要啥内容改一下就行:



修改下图的名称:



找到黑框的的内容 改一下就行


6.项目发布


点击上传按钮:



点击上传即可:



打开微信小程序网站:


登录好后,打开版本管理


点击提交审核


审核成功后点击发布就行


成品如图:

相关文章
|
29天前
|
存储 JSON 小程序
微信小程序入门之新建并认识小程序结构
微信小程序入门之新建并认识小程序结构
46 1
ly~
|
2月前
|
存储 供应链 小程序
除了微信小程序,PHP 还可以用于开发哪些类型的小程序?
除了微信小程序,PHP 还可用于开发多种类型的小程序,包括支付宝小程序、百度智能小程序、抖音小程序、企业内部小程序及行业特定小程序。在电商、生活服务、资讯、工具、娱乐、营销等领域,PHP 能有效管理商品信息、订单处理、支付接口、内容抓取、复杂计算、游戏数据、活动规则等多种业务。同时,在企业内部,PHP 可提升工作效率,实现审批流程、文件共享、生产计划等功能;在医疗和教育等行业,PHP 能管理患者信息、在线问诊、课程资源、成绩查询等重要数据。
ly~
74 6
|
23天前
|
小程序 JavaScript API
微信小程序开发之:保存图片到手机,使用uni-app 开发小程序;还有微信原生保存图片到手机
这篇文章介绍了如何在uni-app和微信小程序中实现将图片保存到用户手机相册的功能。
357 0
微信小程序开发之:保存图片到手机,使用uni-app 开发小程序;还有微信原生保存图片到手机
|
29天前
|
XML 小程序 JavaScript
小程序入门之项目配置说明和数据绑定
小程序入门之项目配置说明和数据绑定
37 1
|
3月前
|
小程序 前端开发 Java
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0 是一款基于 SpringBoot、MybatisPlus 和 uniapp 的简易聊天软件,兼容 H5、小程序和 APP,提供丰富的注释和简洁代码,适合初学者。主要功能包括登录注册、消息发送、好友管理及群组交流。
100 0
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
|
29天前
|
小程序 前端开发 JavaScript
小程序入门之认识view和text组件
小程序入门之认识view和text组件
40 0
|
30天前
|
小程序 前端开发 数据可视化
微信商城小程序WeiMall
微信商城小程序WeiMall
29 0
|
2月前
|
小程序 前端开发 API
微信小程序 - 调用微信 API 回调函数内拿不到 this 问题(解决方案)
本文讨论了在微信小程序中调用API回调函数时无法获取到`this`上下文的问题,并提供了解决方案。在回调函数中,使用一个变量(如`that`)来保存当前的`this`引用,然后在回调内部使用这个变量来访问当前页面的数据和方法。
|
3月前
|
移动开发 小程序 前端开发
|
3月前
|
JSON 小程序 JavaScript
超详细微信小程序开发学习笔记,看完你也可以动手做微信小程序项目
这篇文章是一份全面的微信小程序开发学习笔记,涵盖了从小程序介绍、环境搭建、项目创建、开发者工具使用、文件结构、配置文件、模板语法、事件绑定、样式规范、组件使用、自定义组件开发到小程序生命周期管理等多个方面的详细教程和指南。