Code前端首页关于Code前端联系我们

开发小程序需要哪些技术和工具?

terry 2年前 (2023-09-22) 阅读数 77 #移动小程序

要开发小程序,我们需要下载合适的开发工具。我个人推荐微信官方开发工具。毕竟它是官方工具。首先贴出官方开发工具下载地址:https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html小程序开发需要哪些技术和工具支持?

如何安装就不用我说了。下载后,双击安装。安装后,需要扫描二维码登录。扫描二维码登录后的界面如下。 小程序开发需要哪些技术和工具支持?

可以顺便输入项目名称。很多刚接触小程序开发的人都会有疑问。不注册小程序可以直接开发吗?在这里我们明确告诉您,无需注册小程序即可学习开发小程序。只需点击并使用测试帐户即可体验,如上图所示。
以下是小程序开发工具界面小程序开发需要哪些技术和工具支持?

此时我们的武器就装备好了,接下来我们就开始装弹了。
接下来我将引导你从头开始你的第一个简单的小程序。
刚开始,我们的小程序比较简单,主要包含以下功能

  • 两个页面:首页、个人中心页
  • 底部选项卡的实现
  • 设置顶部标题

小程序开发需要哪些技术和工具支持?

一、代码目录小程序开发需要哪些技术和工具支持?

2。展开
图片说明:该目录是用来存放我们的一些图片资源的,比如项目底部的选项卡图标,就放在这里。
pages:这是我们编写小程序的主要代码目录。我们目前有两个页面,主页和个人中心页。
app.json:我们小程序的一些全局配置都在这里。例如,这是我们在底部配置的两个选项卡。

小程序开发的三个、三个火枪手
我们在开发小程序的时候,需要创建三个相关的文件,比如我们创建一个首页索引。索引下必须创建以下三个文件 小程序开发需要哪些技术和工具支持?

这三个文件是开发小程序不可缺少的三剑客

  • index.wxml:定义首页的大体外观。例如,当我们建造一栋大楼时,这里的代码决定了大楼的外观、多高、多宽、多少层等。我们的建筑物,要贴什么瓷砖,要刷什么颜色。
  • index.js:用来处理我们首页的一些事件,使首页具备一定的能力。例如,我们大楼内有游乐园、电影院等。这些事件由js处理。
<!--index.wxml-->
<view style="color:blue; ">
  我是传说中的首页
</view>

这是index.wxml,这里我们只是简单展示一下该段落。
默认值用于index.wxss 和index.js。如果没有什么的话,我就不在这里发帖了。您可以下载源代码来查看。
四、查看app.json中配置了什么

作者:编程<em>小</em>石头
链接:https://zhuanlan.zhihu.com/p/67117027
来源:知乎
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

// app.json
{
  // 设置我们小程序的页面:首页,个人中心
  "pages": [
    "pages/index/index",
    "pages/me/me"
  ],
  // 设置标题栏字体颜色等信息
  "window": {
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "30天入门小程序01",
    "navigationBarTextStyle": "black"
  },
  // 底部模块tab
 "tabBar": {
   "list": [{
     "pagePath": "pages/index/index",
     "text": "首页",
     "iconPath": "/images/tab1n.png",
     "selectedIconPath": "/images/tab1y.png"
   },
   {
      "pagePath": "pages/me/me",
      "text": "我的",
      "iconPath": "/images/tab2n.png",
      "selectedIconPath": "/images/tab2y.png"
   }]
 }
}

代码不会发布在个人中心。您只需下载源代码并查看即可。

版权声明

本文仅代表作者观点,不代表Code前端网立场。
本文系作者Code前端网发表,如需转载,请注明页面地址。

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

热门