[ Laravel从入门到精通 ] 测试系列 —— 通过测试驱动开发构建待办任务项目(二):前端功能和浏览器测试篇

在上篇教程中,学院君已经完成了待办任务项目后端 API 接口的编写和功能测试,现在,我们开始编写 Vue 组件来实现前端的交互界面。 编写前端 Vue 组件 首先在 resources/js/components 目录新增一个 Vue 组件 TasksComponent.vue,并编写模板代码和脚本代码如下:...

[ Laravel 5.8 文档 ] 测试系列 —— 浏览器测试

简介 Laravel Dusk 提供了优雅的、易于使用的浏览器自动测试 API。默认情况下,Dusk 不强制你在机器上安装 JDK 或 Selenium,取而代之地,Dusk 基于独立安装的 ChromeDriver。不过,你可以使用任意其他兼容 Selenium 的驱动。 注:Selenium 是一套 Web 应用自动化测试系统,运行 Selenium 测试就像你在浏览器中操作一样;...

[ Laravel 5.8 文档 ] 前端开发 —— Blade 模板引擎

简介 Blade 是由 Laravel 提供的非常简单但功能强大的模板引擎,不同于其他流行的 PHP 模板引擎,Blade 在视图中并不约束你使用 PHP 原生代码。所有的 Blade 视图最终都会被编译成原生 PHP 代码并缓存起来直到被修改,这意味着对应用的性能而言 Blade 基本上是零开销。Blade 视图文件使用 .blade.php 文件扩展并存放在 resources/vi...

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

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

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

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

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

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

[ Laravel 从入门到精通 ] 数据库和 Eloquent 应用 —— 结合 Bootstrap + Vue 组件实现异步分页功能

通过前面的系列教程,我们已经介绍完了 Laravel 框架支持的所有对数据库相关基础功能。在日常开发中,对数据库查询结果进行分页也是一个非常常见的需求,我们可以基于之前介绍的查询方法和前端 HTML 视图实现分页功能,不过从 Laravel 5.3 开始,Laravel 框架就已经为我们提供了非常完整的分页解决方案,包括后端 API 和前端视图。不管你使用查询构建器还是 Eloquent...

[ Laravel 从入门到精通 ] 处理用户请求:基于 Laravel + Vue 组件实现文件异步上传

我们在上一篇教程中已经演示了如何通过 Request 请求实例获取各种文本输入数据,但是还有一种输入数据我们没有涉及到,那就是文件上传。我们可以通过 Request 请求实例提供的 file 方法获取用户上传文件,并将其保存到指定目录从而完成文件上传,接下来,我们将从前端到后端实现一个完整的用户上传文件功能,包括视图、路由、控制器部分代码。 定义文件上传路由 首先我们在 routes/w...

[ Laravel 从入门到精通 ] 前端入门:在 Laravel 项目中编写第一个 Vue 组件

和 CSS 框架一样,Laravel 不强制你使用什么 JavaScript 客户端框架,但是开箱对 Vue.js 提供了良好的支持,如果你更熟悉 React 的话,也可以将默认的脚手架代码替换成 React,实现细节参考官方文档。 学院拥抱的是 Vue.js 框架,所以后续前端相关教程都会基于 Vue.js 编写,有关 Vue.js 的入门教程,可以阅读官方文档,值得一提的是,Vue....

[ Laravel 从入门到精通 ] Blade 模板引擎进阶篇:模板继承 & 组件引入

除了基本的数据渲染及控制结构指令之外,Blade 还提供了模板继承功能,从而允许视图模板之间继承、编辑及引入。 通过 @yield 和 @section/@show 在布局文件中定义内容 在理解 Blade 模板继承的时候,我们可以类比类的继承机制:在父类中定义抽象方法或公共方法,然后在子类中实现抽象方法或重写公共方法。在视图文件中,这个「父类」一般对应布局文件,不同的功能模块往往有不同...