精华内容
下载资源
问答
  • 如何创建一个小程序
    千次阅读
    2017-05-29 18:41:55

    要在微信小程序上开发一个功能模块,通常需要先创建一个新的页面,方法很简单,示例如下:

    例如,需要新建一个名称为one的页面,只需要在项目的根目录下的app.json文件下的pages数组中新建一行:"pages/one/one"。

    {
      "pages":[
        "pages/index/index",
        "pages/logs/logs",
        "pages/canvas/canvas",
        "pages/one/one"
      ],
      "window":{
        "backgroundTextStyle":"light",
        "navigationBarBackgroundColor": "#fff",
        "navigationBarTitleText": "WeChat",
        "navigationBarTextStyle":"black"
      }
    }
    

    重新运行程序代码后,即可在pages目录下发现一个名为one的文件夹,里面会自动生成一个小程序页面所需要的四个文件。

    文件类型必填作用
    js页面逻辑
    wxml页面结构
    wxss页面样式表
    json页面配置
    注意:为了方便开发者减少配置项,官方规定描述页面的这四个文件必须具有相同的路径与文件名。

    把小程序页面比作一个人的话,那么组成它的各个文件的作用可比喻如下:

    one.js管的是这个页面的“大脑”,它是用JavaScript编写的,负责将数据进行处理后发送给视图层,同时接受视图层的事件反馈。例如:获取数据、更新数据、页面的跳转等;

    one.wxml管的是这个页面的“”长相“”,即用户看到的是什么样子的页面是由它决定的。例如:定义页面的整体布局以及页面内容的显示效果文本框、按钮、视图、照片等;

    one.wxss管的是这个页面的“化妆品”,它决定了小程序页面平时如何见人?例如:页面的长宽高、组件边距、颜色边框、鼠标经过的效果等;

    one.json管的是这个页面“性格”,它负责对本页面的窗口表现进行配置,例如:页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。


    一个拥有网页开发基础的学者只要明白了如何定义一个小程序的页面,再对其页面组成的使用加以熟悉,很快就可以上手小程序的开发。

    还在等什么?赶紧试试吧!

    后续我会陆续分享一些小程序的学习心得给大家,欢迎多多关注~~~


    更多相关内容
  • 在HBuilderX上面新建微信小程序项目

    千次阅读 2021-08-01 12:55:51
    文章目录、前期准备()微信开发者工具(二)HbuilderX二、创建项目步骤()HBuilderX创建小程序工程(二)、配置小程序AppID(三)、运行项目到微信小程序 、前期准备 ()微信开发者工具 小程序开发工具...

    一、前期准备

    (一)微信开发者工具

    小程序开发工具是腾讯官方发布的用于开发微信小程序的IDE软件,可以从微信官方网站下载到这个工具,建议下载稳定版本的软件。

    下载安装文件后,执行默认安装即可,初次启动需要扫码才能登陆该软件

    【重要】为了保证微信开发者工具与HbuilderX配合使用,必须开放小程序的服务端口。这样将来HbuilderX可以把uni-app项目编译成小程序项目,通过安全端口调用小程序工具执行项目。
    在这里插入图片描述
    在这里插入图片描述

    (二)HbuilderX

    HBuilderX工具是目前国产化软件中,开发前端和移动端项目最优秀的IDE之一,甚至比JetBrains出品的WebStorm还要好用。开发UNI-APP框架的移动端项目,必然首选HBuilderX。

    HBuilderX下载地址:链接: https://pan.baidu.com/s/1FPCEVHBtYQWWgIMnYgNiBg 密码: rpmf

    下载安装包后直接安装即可,完成安装后,必须在HBuilerX中配置微信开发者工具的路径。首先在偏好设置中找到运行配置,然后在微信开发者工具路径中填写本机中文件的路径,使用MAC的同学可以参照我下面的截图。(windows的不一样,可参考其他教程)
    在这里插入图片描述在这里插入图片描述

    二、创建项目步骤

    (一)HBuilderX创建小程序工程

    在HBuilderX上,创建项目,类型选择uni-app(U).
    例如,新建一个项目,叫做work-online。
    在这里插入图片描述

    (二)、配置小程序AppID

    manifest.json文件中填写你自己注册下来小程序AppID
    在这里插入图片描述

    (三)、运行项目到微信小程序

    首先,必须启动本机上的微信开发者工具,并且扫码登陆
    HBuilderX中选择运行微信小程序。
    在这里插入图片描述
    在微信开发者工具中即可看到hello页面,说明利用HBuilderX创建微信小程序项目没有问题。
    在这里插入图片描述

    展开全文
  • 微信小程序创建步骤

    千次阅读 2022-04-28 23:23:41
    下载完成安装后,使用微信登录,点击小程序,开始创建小程序。AppID在小程序平台获取。 注:后端服务最好选择不使用云服务(自己初始化云环境),因为会带来很多没有用的文件格式,模板选择不使用模板。 获取...

    下载完成安装后,使用微信登录,点击小程序,开始创建小程序。AppID在小程序平台获取。

     

    注:后端服务最好选择不使用云服务(自己初始化云环境),因为会带来很多没有用的文件格式,模板选择不使用模板。

    获取AppID如图,点击开发管理后再点击开发设置,最后直接复制,避免不必要的错误。

    初始化云环境:点击云开发

    找到环境设置,复制环境ID

    如图在app.js中初始化云开发环境,输入环境ID

    onLaunch方法:小程序已启动就会执行。

    // app.js
    App({
        onLaunch(){
            console.log('小程序开始启动啦')
            wx.cloud.init({
                env:'输入云开发环境ID'//云开发环境id
            })
        }
    })

    云数据库创建:

    在app.json中创建文件夹格式如图

    (注:页面和页面之间用“,”隔开,最后一页不用。)

    点击云开发,然后点击数据库

     

    数据库创建集合

    添加数据

    数据库权限改为所有用户可读 

     

    展开全文
  • 微信小程序创建一个空白页面

    千次阅读 2018-06-05 13:41:42
    小程序创建一个空白页面还是比较简单的。pages文件夹下就是一个个页面组件想要新增页面组件则找到app.json里面的pages数组,然后添加一组数据即可得到一个页面组件了。然后就会生成一堆文件,在里面就可以编写代码了...

    小程序创建一个空白页面还是比较简单的。

    pages文件夹下就是一个个页面组件

    想要新增页面组件则找到app.json里面的pages数组,然后添加一组数据即可得到一个页面组件了。


    然后就会生成一堆文件,在里面就可以编写代码了。


    展开全文
  • 如何自己搭建一个小程序(步骤详解)

    万次阅读 多人点赞 2021-03-15 15:53:05
    今天分享一下小程序创建步骤,只要按照步骤操作,不懂技术也能自己搭建一个属于自己的小程序; NO·1 注册公众号 划重点:申请小程序前,建议先注册一个公众号;因为使用已认证过的公众号主体做辅助认证,可以免...
  • 次使用Eclipse:编写简单的Java小程序

    千次阅读 多人点赞 2020-04-02 21:05:03
    通过前部分的学习,了解了Java的安装和配置,那么从现在开始,要开始自己着手编写Java程序,学习一门编程语言,学会编写的第一个程序一般都是写一个输出“hello World!”语句的小程序来表示自己开始学习这门语言。...
  • 企业、政府、媒体、其他组织主体可以注册50个小程序,个体户和个人类型主体可注册5个小程序。 温馨提示: 1、主体注册次数不占公众号次数限制; 2、个人类型主体身份证和管理员绑定的微信号独立计算(不与组织类型...
  • 微信小程序创建项目、项目结构分析
  • 在微信公众平台上,小程序名称、头像只能设置一个小程序账号注册时,已经说明了,每个邮箱仅能申请一个小程序   所以,一个小程序账号只能发布一个小程序,如果想要发布最新版本的会把之前的版本覆盖掉;...
  • 本文通过开发一个简单的游戏,来带领大家实操一下开发游戏的基本流程。快来和博主一起操作吧!!!
  • 基于mpvue创建微信小程序项目

    千次阅读 2021-08-28 11:38:51
    开发工具:visual studio code,简称“VS Code” 1.创建项目执行命令:vue init mpvue/mpvue-quickstart my-project;...显示以下界面说明微信小程序创建成功, 备注:开发的时候在开发工具中进行开发,开发效
  • 做任何程序开发要首先找到其官方文档,我们先来看看其有哪些官方文档。...知道了文档的位置,下面我们来介绍下如何做一个微信小程序开发: 第一步: 下载微信小程序开发者工具并安装,下载路径: https://mp.weix...
  • 创建微信小程序

    万次阅读 2020-03-17 21:26:27
    创建微信小程序。 这篇博客包括两内容 1.创建微信小程序 2.查看微信小程序的Appid以及生成密钥 1.创建微信小程序 (1).https://mp.weixin.qq.com/cgi-bin/wx微信小...
  • 微信小程序云开发创建数据库表 1.进入小程序后点击云开发,开启云开发功能。 2.开启云开发功能后会进入云开发控制台后点击左上角的数据库,后点击下面的“+”创建数据表。表名随便取,你开心就好,我的表名叫...
  • 零基础做一个微信答题小程序(二)

    千次阅读 2022-03-31 15:09:20
    在上一节里,我们了解了如何设计答题小程序中的题库——表格,并且知道了如何从题库中随机抽取指定数量的不重复的题目编号。这一节,我们将分享一下如何利用这些题目编号,获取到指定的题目信息,然后将题目呈现出来...
  • 核酸检测小程序实战教程

    万次阅读 多人点赞 2022-09-12 10:33:28
    我们本次教程就以这实际生活场景为例,结合微搭低代码工具来制作款核酸检测小程序小程序一共分为在线预约和我的预约两版块。在线预约可以增加受检人,选择预约地点,预约日期。我的预约可以查看自己已经生成...
  • 微信小程序如何创建npm(超详细)

    千次阅读 多人点赞 2020-09-17 17:09:53
    打开小程序开发工具,创建一个新的小程序,如下图所示: 第三步 在本地找到你新建的小程序的根目录,并且进入,然后打开cmd ,如下图所示: 第四步 安装好Node.js,输入npm init ,如下图所示: 第五步 ...
  • 从零开始,开发一个电商微信小程序[前端+后端(c#)]

    万次阅读 多人点赞 2020-10-20 15:04:17
    本文主要讲解如何快速搭建一个自己的小程序(小程序+后台API)。 1、前言:随着微信小程序的迅速发展,用户...(2)创建小程序 (3)编写小程序api,访问数据库的数据 (4)小程序调用后端api (5)在iis上发布自己的接口 ......
  • 如何注册微信小程序

    千次阅读 2022-07-15 17:09:54
    从免费注册开始一步一步教你如何创建属于自己的微信小程序·
  • 一:创建小程序全局函数 1:在微信开发工具中增加一个JS文档, 放入全局全局函数 代码说明 1:全局函数只能放var定义的变量下,本例的var 变量为myFunction 格式为: var myFunction={ 在这里编写你的全局函数 } 你...
  • 很多粉丝朋友想要了解如何用微信建立打卡小程序,本文小编就为大家介绍做打卡签到小程序方法。 做打卡签到小程序可以,快速发起群打卡,考勤打卡,培训打卡,支持每日打卡。助你养成好习惯:早起、早睡、学习、运动...
  • 在app.json里面的pages里直接写入你需要创建文件的名字,就可以直接在目录里面生成 没写入之前: 写入之后:写入直接按ctrl+s保存自动生成四文件 ...
  • 微信小程序云开发入门详细教程

    千次阅读 多人点赞 2021-11-03 22:43:49
    、认识小程序云开发 1.云开发简介 小程序云开发是微信团队联合腾讯云推出的专业的小程序开发服务。 开发者可以使用云开发快速开发小程序、小游戏、公众号网页等,并且原生打通微信开放能力。 开发者无需搭建...
  • C# 创建Windows窗体应用程序(WinForm程序

    万次阅读 多人点赞 2019-06-10 09:57:09
    1)WinForm?Windows窗体应用程序 WinForm 是 Windows Form 的简称,是基于 .NETFramework 平台的... C# WinForm 编程需要创建「Windows窗体应用程序」项目。 .NET 提供了大量 Windows 风格的控件和事件,我们...
  • 小程序是下一个被确定为互联网新品种的程序,信已经成为不可缺少的交流工具,小程序依附于微信,用户搜索起来也会更方便,其实这就是小程序发展的前景和优势。 提示:以下是本篇文章正文内容,下面案例可供参考 一...
  • 微信小程序开发之路(3)— 添加一个Button按钮点击事件 一、前言 之前文章我们设置的都是静态的页面,我们接下来需要增加一个点击Button按钮点击事件。 二、增加一个Button按钮 将pages/hello/hello.wxml文件修改为...
  • 微信小程序是越来越火,参与其中的开发者也越来越多,但是很多朋友都是只懂小程序前端开发,或者是只懂 PHP 开发,...从零开始创建一个微信小程序并且写好页面; 从零开始创建一个 MySQL 数据库; 从零开始写 PHP 后...
  • uniapp快速搭建小程序项目 完整过程

    千次阅读 2022-04-18 14:23:42
    先看看效果! 1. 注册小程序开发者(已注册的可以跳过) 进入官网 ... 选择小程序 ->... ...使用uniapp开发就需要用到两个工具,HBuilderX 以及 微信开发者...使用HBuilderX新建一个uniapp项目,文件 -> 新建 -> 项目
  • 钉钉小程序的开发入门【亲自调试】
  • 1.2 创建一个小程序——Hello WXapplet 事不宜迟,我们马上开始创建一个微信小程序——Hello WXapplet。 在安装开发者工具的电脑上运行“微信Web开发者工具”,通过开发者的微信扫码进入后,即可得到如图1-9所...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 2,454,185
精华内容 981,674
热门标签
关键字:

如何创建一个小程序