微信小程序开发入门教程(十一):博客小程序项目代码上传、发布上线及访问统计

前面几篇教程我们已经详细介绍了如何通过原生框架开发博客小程序,并基于组件化框架 WePY 对这个小程序项目进行了重构,接下来我们将这个小程序发布到线上方便别人访问。 上传代码 要发布微信小程序,首先需要上传小程序项目代码,打开微信开发者工具,进入要发布的小程序项目,点击右上角的「上传」按钮,在弹出的确认界面点击「确定」: 接下来会弹出一个表单录入框,填写小程序版本号和备注信息后点击「上...

微信小程序开发入门教程(十):组件化框架 WePY 开发入门 —— 博客文章详情页重构

上篇教程学院君介绍了如何通过小程序框架 WePY 重构博客小程序首页,这篇我们接着来重构博客小程序文章详情页,后端 API 接口还是保持不变,主要工作在微信小程序前端页面,首先我们需要在 blog-lite 项目中创建详情页页面。 创建新页面 在 PhpStorm 中打开小程序项目,在 src/pages 目录下创建 post.wpy 用于渲染博客详情页: 然后初始化 post.wpy...

微信小程序开发入门教程(九):组件化框架 WePY 开发入门 —— 博客首页文章列表重构

上篇教程,学院君已经给大家初步介绍了基于小程序组件化框架 WePY 的项目初始化和目录结构,今天开始我们将花几篇教程的篇幅通过 WePY 框架来重构之前通过原生框架开发的博客应用小程序版,并且在此基础上实现用户授权登录及点赞功能,最后将这个小程序上线,从而演示完整的小程序开发生命周期。 重构的时候,后端接口不用做任何调整,只需要开发小程序页面即可。 我们在 PHPStorm 中打开上篇教...

微信小程序开发入门教程(八):组件化框架 WePY 开发入门 —— 项目初始化和目录结构

前面几篇教程学院君简单给大家介绍了微信小程序原生框架,并通过构建一个实际项目演示了如何基于原生框架进行项目开发。今天开始,学院君要给大家介绍一种更加高效的开发方式 —— 基于官方提供的组件化框架 WePY 进行小程序项目开发,关于为什么要使用 WePY,官方给出了充分的理由: 简单来说,其实就是我们可以更方便地使用现代 JavaScript 功能特性和工具更加高效地开发微信小程序,而且...

微信小程序开发入门教程(七):原生框架开发入门 —— 博客文章详情页实现(下)

在上一篇教程中,我们通过测试数据渲染了小程序的文章详情页,这一篇教程我们将通过访问后端 API 接口来获取文章数据,以便实现文章详情页数据渲染。 提供后端 API 接口 定义路由 首先,我们需要在博客项目 blog57 的 routes/api.php 中新增一个 API 路由: Route::middleware('throttle:60,1')->prefix('v1')->grou...

微信小程序开发入门教程(六):原生框架开发入门 —— 博客文章详情页实现(上)

创建新页面 在微信开发者工具中打开小程序项目,在 pages 目录下新增 detail 目录用于存放文章详情页面,选中 detail 目录,右键弹出快捷菜单,点击「新建 Page」,输入 detail 创建详情页相关文件。 此时,项目根目录下的 app.json 配置文件中,pages 配置项会自动新增 pages/detail/detail 页面。 路由导航 在微信小程序的 WXML...

微信小程序开发入门教程(五):原生框架开发入门 —— 博客首页文章列表实现(下)

在上一篇教程中,我们通过测试数据渲染了小程序首页的文章列表,这一篇教程我们将通过访问后端 API 接口来获取文章数据,以便实现首页文章渲染、刷新和翻页操作。 提供后端 API 接口 定义路由 首先,我们需要在博客项目 blog57 的 routes/api.php 中定义一个 API 路由: Route::middleware('throttle:60,1')->prefix('v...

微信小程序开发入门教程(四):原生框架开发入门 —— 博客首页文章列表实现(上)

接下来,我们将结合具体项目实例来介绍如何通过原生框架来构建微信小程序版的博客应用。 页面功能设计 我们在上一篇教程中已经介绍过小程序的目录结构,了解了目录结构基本上也就了解了实现什么功能要怎么编写代码。以博客首页为例,需要先构思如何渲染首页页面,构思清楚之后,就可以打开根目录下的 app.json 配置文件,在 pages 配置项中新增首页目录路径: "pages":[ "pag...

微信小程序开发入门教程(三):原生框架开发入门 —— 项目初始化和目录结构

上篇教程我们介绍了微信小程序如何申请、注册和配置,并且下载了微信开发者工具,这篇教程我们就来通过微信开发者工具创建第一个微信小程序项目,并且介绍如何通过原生框架开发微信小程序。 创建第一个微信小程序项目 打开微信开发者工具,使用微信扫描二维码登录,就会进入这个入口界面: 选择小程序项目,进入初始化界面,选择项目目录,填写上一篇教程注册的小程序 App ID,最后在下拉列表选择「建立普通...

微信小程序开发入门教程(二):从零开始申请并配置一个新的微信小程序

学院君注:如果你已经申请并配置过微信小程序,可以跳过本篇教程。 1、申请小程序 我们假设你是从零开始开发第一个微信小程序,那么首先要去微信公众平台申请你的第一个小程序: 鼠标移到小程序所在方框,会显示出「查看详情」按钮,点击该按钮,即可进入微信小程序介绍页面,将页面下拉到最底部,就可以看到接入流程: 点击绿色的「前往注册」按钮,就可以进入小程序注册表单了,需要注意的是小程序和公众号...