通过 Livewire 在 Laravel 项目中实现基于 PHP 的全栈开发(二):组件创建和渲染的底层实现

前言 昨天在发布完 Livewire 入门教程后,分享到 v2ex 和朋友圈引来各种评论,大多数人持有的态度都是「这玩意没啥用」,我想这部分人大多是已经非常熟悉Laravel + Vue/React 进行前后端开发了,而目前无论就性能和先天基因来说,Livewire 确实都是不如原生 Vue/React 组件的,就像 Weex、React Native 一直致力于通过 JavaScrip...

基于 Laravel + Swoole + Vue 组件实现支持高并发的实时弹幕功能(上)

前面我们已经介绍完了 Swoole 的所有功能特性以及集成到 Laravel 框架的注意事项,接下来学院君带大家来做一些实践小项目练练手,在实践篇里,我们将完成两个项目,一个是简单的弹幕功能,一个是在线聊天室,首先我们来实现弹幕功能。 弹幕服务后端实现 随着哔哩哔哩之类的弹幕视频网站和在线直播视频的兴起,弹幕功能越来越常见,所谓弹幕其实就是视频界面上满天飞评论,就像下面这种: 这样一来...

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

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

[ Laravel 5.8 文档 ] 前端开发 —— 使用进阶:通过 Laravel Mix 编译前端资源

简介 Laravel Mix 提供了一套流式 API,使用一些通用的 CSS 和 JavaScript 预处理器为 Laravel 应用定义 Webpack 构建步骤。通过简单的方法链,你可以流式定义资源管道。例如: mix.js('resources/js/app.js', 'public/js') .sass('resources/sass/app.scss', 'public...

[ Laravel 5.8 文档 ] 前端开发 —— 快速入门:JavaScript & CSS 脚手架

简介 Laravel 并不强制你使用什么 JavaScript 框架或者 CSS 预处理器,不过也确实提供了对很多应用而言都很有用的 Bootstrap 和 Vue 的一些基本脚手架。默认情况下,Laravel 使用 NPM 来安装这些前端包。 CSS Laravel Mix提供了干净、优雅的 API 用于编译 SASS 或 Less,SASS 和 Less 都是在原生 CSS 的基础上...

[ Laravel 从入门到精通 ] 用户认证与授权系列 —— 通过 Passport 实现 API 请求认证:移动端应用篇(密码授权令牌)

注:虽然教程的名字叫移动应用篇,但是完全适用于同一个公司不同系统间的认证,包括不同 Web 网站间认证。 虽然我们在上一篇教程中做好了 Passport 后端初始化配置,但是注册的相关路由和初始化的数据库数据并没有用到,从这一篇教程开始,我们将基于 Passport 实现一些更复杂的 API 授权认证,会逐步用到这些路由和数据库记录。 我们在上一篇教程中已经介绍了单页面应用的 API ...

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

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

[ Laravel 从入门到精通 ] 前端入门:CSS 预编译语言 Sass 快速入门教程

CSS 预编译语言概述 CSS 作为一门样式语言,语法简单,易于上手,但是由于不具备常规编程语言提供的变量、函数、继承等机制,因此很容易写出大量没有逻辑、难以复用和扩展的代码,在日常开发使用中,如果没有完善的编码规范,编写的 CSS 代码会非常冗余且难以维护。 为了解决上述问题,出现了很多 CSS 预编译语言,CSS 预编译语言是基于 CSS 语言的语法扩展,除了能解决上述缺乏语言特性带...

[ Laravel 从入门到精通 ] 前端入门:在 Laravel 项目中使用 Bootstrap 框架

Laravel 如何引入 Bootstrap 如官方文档所言,Laravel 并不强制你使用 CSS 框架,但是开箱提供了对 Bootstrap 的支持,在 resources/js/bootstrap.js(在 Laravel 5.7 之前的版本位于 resources/assets/js/bootstrap.js)中,我们可以看到对 bootstrap js库的引入: try { ...

基于 Laravel + Vue 构建 API 驱动的前后端分离应用系列(二十八) —— 通过 Vuex + Vue Router 导航守卫在前端实现认证路由保护

我们已经在上一篇教程中实现了通过 Vue 组件实现用户登录,但是现在有个问题,就是用户在没有登录的情况下也可以访问需要认证的页面,比如新增咖啡店页面: 虽然在提交表单数据到后台 API 时不会成功,但是这会给用户造成困扰,所以,我们需要对这种需要认证页面的访问请求进行拦截,我们以前在开发非单页面应用时,会在访问这种页面时从后端进行判断,比如经过 auth 中间件进行过滤,如果需要认证则...