小程序入门——详细教程

这篇具有很好参考价值的文章主要介绍了小程序入门——详细教程。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

小程序入门——详细教程,小程序

                                                   🎬 艳艳耶✌️:个人主页

                                                  🔥 个人专栏 :《Spring与Mybatis集成整合》《Vue.js使用》

                                                   ⛺️ 生活的理想,为了不断更新自己 ! 
 

小程序入门——详细教程,小程序

1.微信小程序 入门

1.1什么是小程序?

2017年度百度百科十大热词之一

微信小程序(wei xin xiao cheng xu),简称小程序,英文名Mini Program,是一种不需要下载安装即可使用的应用( 张小龙对其的定义是无需安装,用完即走,实际上是需要安装的,只不过小程序的体积特别小, 下载速度很快,用户感觉不到下载的过程 )

限制:同一个分包中的页面享有共同的预下载大小限额 2M,限额会在工具中打包时校验。

2017年1月9日0点,万众瞩目的微信第一批小程序正式低调上线。

1.2小程序可以干什么?

  • 同App进行互补,提供同app类似的功能,比app操作更加简洁的轻应用
  • 通过扫一扫或者在微信搜索即可下载
  • 用户使用频率不高,但又不得不用的功能软件,目前看来小程序是首选
  • 连接线上线下
  • 开发门槛低, 成本低

前期准备:

微信开发者工具下载地址:

https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

微信小程序开发文档:

微信开放文档微信开发者平台文档https://developers.weixin.qq.com/miniprogram/dev/index.html

2.注册微信小程序

开发小程序的第一步,需要拥有一个小程序帐号,通过这个帐号你就可以管理你的小程序。

如果你还没有微信公众平台的账号,请先进入微信公众平台首页,点击 “立即注册” 按钮进行注册。注册的账号类型可以是订阅号、服务号、小程序以及企业微信,选择 “小程序” 即可。

接着填写账号信息,需要注意的是,填写的邮箱必须是未被微信公众平台注册、未被个人微信号绑定的邮箱,而且每个邮箱仅能申请一个小程序。

激活邮箱之后,选择主体类型为 “个人类型”,并按要求登记主体信息。主体信息提交后不可修改,该主体将成为你使用微信公众平台各项服务和功能的唯一法律主体与缔约主体,在后续开通其他业务功能时不得变更或修改。
 

微信小程序的正式号和测试号有以下几点区别:

  • 使用限制:测试号只能用于在开发测试阶段使用,而正式号则可以发布上线供用户使用。
  • 功能限制:测试号的功能相对比较受限,如不支持微信支付、部分接口调用等功能,而正式号可以尽可能地满足开发者的需求。
  • 可操作性差异:测试号的操作相对更容易,无需经过严格的审核流程和申请手续,而正式号需要经过微信官方的审核才能上线使用。
  • 用户量限制:测试号的用户数有一定的限制,而正式号没有限制,可以随时增加用户量。

通过测试号可以帮助开发者快速验证小程序的基本功能,调试问题,优化用户体验。当开发完成后可以申请正式号,并经过微信官方的审核上线,让更多的用户使用和体验小程序提供的服务。

小程序入门——详细教程,小程序

进入小程序注册页 根据指引填写信息和提交相应的资料,就可以拥有自己的小程序帐号。

小程序入门——详细教程,小程序

在这个小程序管理平台,你可以管理你的小程序的权限,查看数据报表,发布小程序等操作。

一切 OK 就可以直接进入小程序的管理平台了。如果直接跳转失败,也可以从微信公众平台上手动登录。填写小程序的基本信息,包括名称、图标、描述等。提交成功之后,再添加开发者。开发者默认为管理员,我们也可以从这里新增绑定开发者,这是管理员才有权限的操作。

然后在左侧导航栏点击 “设置”,找到开发设置,获得小程序的 AppID。

3.安装微信开发者工具

3.1下载微信开发者工具

可以在微信开放文档中选择对应版本,然后下载对应的安装包

小程序入门——详细教程,小程序

3.2登录微信开发者工具

首次启动开发者工具,则需要微信账号扫码登录

登录微信开发者工具

小程序入门——详细教程,小程序

4.第一个小程序的创建

新建项目选择小程序项目,选择代码存放的硬盘路径,填入刚刚申请到的小程序的 AppID,给你的项目起一个好听的名字,勾选 "不使用云服务" (注意: 你要选择一个空的目录才可以创建项目),点击新建,你就得到了你的第一个小程序了,点击顶部菜单编译就可以在微信开发者工具中预览你的第一个小程序
小程序入门——详细教程,小程序

5.目录结构介绍 

  1. js文件:页面脚本文件,存放页面数据、事件处理函数等。——处理用户操作
  • app.js文件:整个项目的入口文件,通过调用App()函数启动项目。
  • 页面.js文件:页面入口文件,调用Page()函数,创建并运行页面。
  • 普通.js文件:普通功能模块文件,用来封装公共的函数或属性供页面使用
  1. json文件:当前页面配置文件,配置窗口的外观、表现等。
  2. wxml文件:页面的模板结构文件。(WXML模板类网页HTML)
  3. wxss文件:当前页面的样式表文件。(WXSS:一套样式语言,用于描述WXML局部或全局的组件样式,类网页CSS)

小程序入门——详细教程,小程序

整个项目的目录结构分析

  • pages:【文件夹】存放所有小程序的页面
  • index文件—首页文件
  • logs文件—日志文件
  • utils:【文件夹】用来存放工具性质模块[如:格式化时间的自定义模块]
  • app.js:项目入口文件
  • app.json:项目全局配置文件 
  • pages——页面路径[在此输入“pages/list/list”则工具自动创建新页面、替换其中数组的顺序可修改项目的首页]
  • window——全局定义所有页面样式
  • style——全局定义小程序组件所使用的样本
  • sitemapLocation——指明sitemap.json的位置

                                                   今日分享到此结束! 小程序入门——详细教程,小程序文章来源地址https://www.toymoban.com/news/detail-741464.html

到了这里,关于小程序入门——详细教程的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Git入门详细教程

    Git官网 Git是一个开源的 分布式版本控制系统 ,用于跟踪文件的变化和协作开发。它允许多个开发者在同一项目中共同工作,并能够有效地管理代码的版本和历史记录。Git可以帮助开发团队更好地协作,追踪代码变更,并且可以在需要时轻松地回滚到之前的版本。 版本控制是

    2024年01月19日
    浏览(50)
  • Selenium入门详细教程+实例演示

    目录 1.Selenium概述    1.1什么是Selenium    1.2Selenium的优势    1.3Selenium WebDriver原理 2.Selenium环境搭建 3.Selenium 简单示例 4.八大元素定位    4.1定位方式    4.2定位方式的用法 5.Selenium API    5.1WebDriver 常用 API    5.2WebElement 常用 API    5.3代码示例 6.元素等待机制    6.1硬性等待

    2024年02月13日
    浏览(42)
  • 2022Matlab小白入门详细教程

    本文适合哪些对象? 有一点点的编程基础的,想要学习Matlab的小白。 正在学习Matlab,基础也没搞明白的人。 大学生、研究生想要打数学建模相关竞赛,需要使用到该语言的人 最后一句 :基础内容其实并不对,不要被外部的一些机构,书籍等误导,请对本文的所有内容完全

    2023年04月08日
    浏览(47)
  • React 超详细入门教程

    React 是一个用于构建用户界面的 JavaScript 库,主要用于构建 UI,而不是一个 MVC 框架,但可以使用 React 作为 MVC 架构的 View 层轻易的在已有项目中使用,它是一个用于构建用户界面的 JavaScript 库,起源于 Facebook 的内部项目,用来架设 Instagram 的网站,于 2013 年 5 月开源。 Rea

    2024年01月17日
    浏览(42)
  • ActiveMQ详细入门教程系列

    两个系统或两个客户端之间进行消息传送,利用高效可靠的消息传递机制进行平台无关的数据交流,并基于数据通信来进行分布式系统的集成。通过提供消息传递和消息排队模型,它可以在分布式环境下扩展进程间的通信。 消息中间件,总结起来作用有三个: 异步化提升性

    2024年02月15日
    浏览(48)
  • python入门教程(非常详细)

    Python是一种高级、解释性的脚本语言,其简单易学、灵活、强大等特点,使其成为了当代最流行的编程语言之一。如果您是想学习Python编程的新手,以下是详细的Python入门教程,以帮助您快速掌握Python编程基础。   1. 安装Python   首先,您需要从Python官网(https://www.python.org/d

    2024年02月16日
    浏览(48)
  • Nginx超详细入门教程

    目录 一、nginx配置文件介绍 二、nginx的核心功能  1)反向代理 1正向代理 2反向代理 3准备工作  2)负载均衡 3)负载均衡策略 4)动静分离 三、Nginx的高可用性 1)准备两台虚拟机并都安装nginx 2)需要在每一个nginx服务器上安装keepalived 3)修改keepalived的配置文件内容  4)将

    2024年02月08日
    浏览(40)
  • 新手入门Jenkins自动化部署入门详细教程

    在实际开发中,我们经常要一边开发一边测试,当然这里说的测试并不是程序员对自己代码的单元测试,而是同组程序员将代码提交后,由测试人员测试; 或者前后端分离后,经常会修改接口,然后重新部署; 这些情况都会涉及到频繁的打包部署; 手动打包常规步骤: 1.提

    2024年02月13日
    浏览(53)
  • 瑞萨MCU入门教程(非常详细的瑞萨单片机入门教程)

    得益于瑞萨强大的MCU、强大的软件开发工具(e² studio),也得益于瑞萨和RA生态工作室提供的支持,我们团队编写了《ARM嵌入式系统中面向对象的模块编程方法》,全书37章,将近500页: 讲解面向对象编程在单片机开发中的使用 结合FSP软件包实例分析外设驱动 讲解如何使用RASC配

    2024年02月08日
    浏览(47)
  • HTML零基础快速入门(详细教程)

    HTML代码有以下特点: html代码是通过标签来组织的,而标签是由尖括号 组织的,也可被叫作元素(element)。 大部分标签是成对存在的,称之为双标签,少数标签是单独存在的,称之为单标签。 双标签, html 为开始标签, /html 为结束标签,开始标签和结束标签之间的是标签

    2024年02月05日
    浏览(43)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包