livewire加tailwindcss写了一个博客欢迎star

酝酿了很久才给自己做了个小博客,主要是太懒了今天推明天,明天推后天,推到了现在,
livewire 写前后端不分离的项目是真的快,爽,就是 tailwindcss 组件库太少了,
很多样式需要自己写,就这一点不太好。后续将继续优化这个项目

下面分享几个遇到的一些小问题

  1. wire:click="save('参数不能是中文')" 

  2. socket-client.io 目前最新版是4.x,使用最新版的话会出现websocket 连接不上,请 npm install socket-client.io@2.*

  3. 定义查询字段时,要排除空字符,不然url后面总会带上?xxx= 正确使用方式如下:
public $search = '';
protected $queryString = [
    'search' => ['except' => ''],
];

这是 demo
github

环境要求

php : "^7.3|^8.0",

部署

  • npm install -g laravel-echo-server –save
  • composer install
  • cp .env.example .env
  • php artisan key:generate
  • php migrate
  • php artisan db:seed
  • php artisan queue:work –sleep=3 –tries=3
  • npm install
  • npm run dev
  1. laravel-echo-server.json 已经在项目的根目录,修改 authHost
  2. cd 你的项目目录 laravel-echo-server start

命令

php artisan msg:clear 清除聊天数据以及缓存

关于

这篇博客主要技术栈使用一下核心特别感谢作者写了这么多好用的轮子,这篇博客仅做技术交流,大家喜欢的话,希望能给一个star

以下为使用的技术栈

  1. livewire
  2. tailwindcss
  3. laravel-echo
  4. dcat-admin
  5. Aplinejs

模块

  1. 文章

    文章添加删除编辑
    评论,添加删除,回复,点赞
    搜索,按标题,内容,以及标签查询

  2. 标签

    标签的增删改查

  3. 用户

    登录,注册,退出,忘记密码,头像上传,个人中心,2次认证,github授权登录
    账号管理,删除账号,删除其他设备登录信息

  4. 聊天

    支持私聊
    已读,未读消息数量提示
    用户正在输入提示

效果图

  1. 首页

livewire加tailwindcss写了一个博客欢迎star

  1. 文章详情
    livewire加tailwindcss写了一个博客欢迎star

  2. 登录

livewire加tailwindcss写了一个博客欢迎star

  1. 聊天

livewire加tailwindcss写了一个博客欢迎star

本作品采用《CC 协议》,转载必须注明作者和本文链接
Mr.pan
《L05 电商实战》
从零开发一个电商项目,功能包括电商后台、商品 & SKU 管理、购物车、订单管理、支付宝支付、微信支付、订单退款流程、优惠券等
《G01 Go 实战入门》
从零开始带你一步步开发一个 Go 博客项目,让你在最短的时间内学会使用 Go 进行编码。项目结构很大程度上参考了 Laravel。
讨论数量: 4

大佬牛逼🐂

3年前 评论
pan_zoe (楼主) 3年前

可以。在技术逐渐趋同的情况下,尽量通过设计做出差异化。找个wordpress抄一下设计。

3年前 评论
pan_zoe (楼主) 3年前

聊天室多开几个页面会怎样?

3年前 评论
pan_zoe (楼主) 3年前

分页体验不太好,还要滑到上面看

3年前 评论
pan_zoe (楼主) 3年前

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!