利用laravel搭建一个迷你博客实战教程


Posted in PHP onAugust 13, 2017

本文主要给大家介绍的是关于利用laravel搭建一个迷你博客的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍:

一、设计与思路

在开始写第一行代码之前,一定要尽量从头到尾将我们要做的产品设计好,避免写完又改,多写不必要的代码。

  • 需求分析:我们的迷你博客应该至少包含:新增/编辑/查看/删除文章,以及文章列表展示功能。
  • 数据库分析:基于这个功能,我们只需要一张 Articles 数据表来存放文章即可。
  • 页面结构分析:应该使用模板继承建立一张基础模板包含:头部/文章列表/底部信息

二、创建路由

完成这个博客大概需要以下几条路由:

| 路由 | 功能 | | -------- | ---------------- | | 文章列表页面路由 | 返回文章列表页面 | | 新增文章页面路由 | 返回新增文章页面 | | 文章保存功能路由 | 将文章保存到数据库 | | 查看文章页面路由 | 返回文章详情页面 | | 编辑文章页面路由 | 返回编辑文章页面 | | 编辑文章功能路由 | 将文章取出更新后重新保存到数据库 | | 删除文章功能路由 | 将文章从数据库删除 |

可以看到几乎全部是对文章的数据操作路由,针对这种情况,Laravel 提供了非常方便的办法:RESTful 资源控制器和路由。

打开routes.php加入如下代码:

Route::resource('articles', 'ArticlesController');

只需要上面这样一行代码,就相当于创建了如下7条路由,且都是命名路由,我们可以使用类似route('articles.show') 这样的用法。

Route::get('/articles', 'ArticlesController@index')->name('articles.index'); 
Route::get('/articles/{id}', 'ArticlesController@show')->name('articles.show'); 
Route::get('/articles/create', 'ArticlesController@create')->name('articles.create'); 
Route::post('/articles', 'ArticlesController@store')->name('articles.store'); 
Route::get('/articles/{id}/edit', 'ArticlesController@edit')->name('articles.edit'); 
Route::patch('/articles/{id}', 'ArticlesController@update')->name('articles.update'); 
Route::delete('/articles/{id}', 'ArticlesController@destroy')->name('articles.destroy');

三、创建控制器

利用 artisan 创建一个文章控制器:

php artisan make:controller ArticlesController

四、创建基础视图

resources/views/layouts/art.blade.php

见模板index.html

五、新建文章表单

@extends('layouts.art')
@section('content')

 <form class="form-horizontal" method="post" action="{{route('blog.store')}}">
   {{ csrf_field() }}
 <div class="form-group">
 <label for="inputEmail3" class="col-sm-2 control-label">标题</label>
 <div class="col-sm-8">
  <input type="title" class="form-control" id="title" name="title">
 </div>
 </div>

 <div class="form-group">
 <label for="inputEmail3" class="col-sm-2 control-label">内容</label>
 <div class="col-sm-8">
  <textarea class="form-control" rows="5" id="content" name="content"></textarea>
 </div>
 </div>

 <div class="form-group">
 <div class="col-sm-offset-2 col-sm-10">
  <button type="submit" class="btn btn-default">创建</button>
 </div>
 </div>
</form> 
@endsection

六、文章存储

此时如果你填写新建文章表单点击提交也会跳到一个空白页面,同样的道理,因为我们后续的控制器代码还没写。

要实现文章存储,首先要配置数据库,创建数据表,创建模型,然后再完成存储逻辑代码。

1、配置数据库

修改.env文件

2、创建数据表

利用 artisan 命令生成迁移:

php artisan make:migration create_articles_talbe --create=articles

修改迁移文件

public function up() 
 {
  Schema::create('articles', function (Blueprint $table) {
   $table->increments('id');
   $table->string('title');
   $table->longText('content');
   $table->timestamps();
  });
 }
public function down() 
 {
  Schema::dropIfExists('articles');
 }

我们创建了一张 articles 表,包含递增的 id 字段,字符串title字段,长文本content字段,和时间戳。

执行数据库迁移:

php artisan migrate

登录mysql,查看数据表。

3、创建模型

利用 artisan 命令创建模型:

php artisan make:model Article

打开模型文件,输入以下代码:

app/Article.php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Article extends Model 
{
 //对应的表
 protected $table = 'articles';
 //通过model可以写入的字段
 protected $fillable = [
  'title', 'content',
 ];
}

4、存储逻辑代码

打开 ArticlesController.php 控制器,找到 store() 方法。

app/Http/Controllers/ArticlesController.php

public function store(Request $request)
 {
  //数据验证 错误处理
  $this->validate($request,[
   'title'=>'required|max:50',
   'content'=>'required|max:500',
   ]);
  // 1 orm方式写入
  $article = Article::create([
   'title'=>$request->title,
   'content'=>$request->content,
   ]);
  //2 或者
  /* $article = new Article();
   $article->title =$request->title;
   $article->content = $request->content;
   $article->save();*/

   //3 db方式写入
   //insert()方法返回值为true 和 false
   //$res = DB::table('articles')->insert(['title'=>$request->title,'content'=>$request->content]);
  return redirect()->route('blog.index');
 }

验证错误显示

@if (count($errors) > 0)
 <div class="alert alert-danger">
  <ul>
   @foreach($errors->all() as $error)
   <li>{{ $error }}</li>
   @endforeach
  </ul>
 </div>
@endif

七、文章列表展示

完成了添加文章功能后,就可以实现我们的文章列表展示页了。

打开 ArticlesController.php 找到 index() 方法,添加代码如下:

app/Http/Controllers/ArticlesController.php

use App\Article;

public function index() 
 {
  $articles = Article::orderBy('created_at','asc')->get();

  return view('articles.index', ['articles'=>$articles]);
 }

视图index.blade.php

@extends('layouts.art')
@section('content')

 <a class="btn btn-primary" href="{{route('blog.create')}}" rel="external nofollow" >添加文章</a>


 @foreach($articles as $article)
 <div class="panel panel-default">
 <div class="panel-body">
 {{$article->title}}
 <a href="{{route('blog.show',$article->id)}}" rel="external nofollow" class="btn btn-info">阅读</a>
 <a href="{{route('blog.edit', $article->id)}}" rel="external nofollow" class="btn btn-info">修改</a>

  <form action="{{ route('blog.destroy', $article->id) }}" method="post" style="display: inline-block;">
   {{ csrf_field() }}
   {{ method_field('DELETE') }}
   <button type="submit" class="btn btn-danger">删除</button>
  </form>
 </div>
 </div>
 @endforeach

 {!! $articles->render() !!}
 @endsection

八、编辑文章表单

编辑文章表单其实和之前创建的新建文章表单很类似,只是需要额外将现有的数据读取出来填在表单上。

首先我们在文章列表页的每个文章上添加一个编辑按钮:

视图:

@extends('layouts.art')
@section('content')

 <form class="form-horizontal" method="post" action="{{route('blog.update',$article->id)}}">
   {{ csrf_field() }}
  {{ method_field('PATCH') }}
 <div class="form-group">
 <label for="inputEmail3" class="col-sm-2 control-label">标题</label>
 <div class="col-sm-10">
  <input type="title" class="form-control" id="title" name="title" value="{{ $article->title }}">
 </div>
 </div>


 <div class="form-group">
 <label for="inputEmail3" class="col-sm-2 control-label">内容</label>
 <div class="col-sm-10">
  <textarea class="form-control" rows="5" id="content" name="content"> {{ $article->content }}</textarea>
 </div>
 </div>


 <div class="form-group">
 <div class="col-sm-offset-2 col-sm-10">
  <button type="submit" class="btn btn-default">修改</button>
 </div>
 </div>
</form> 
@endsection

注意这段代码中的 {{ method_field('PATCH') }} ,这是跨站方法伪造,HTML 表单没有支持 PUT、PATCH 或 DELETE 动作。所以在从 HTML 表单中调用被定义的 PUT、PATCH 或 DELETE 路由时,你将需要在表单中增加隐藏的 _method 字段来伪造该方法,详情参考 官方文档。

控制器

//展示修改模板
public function edit($id) 
 {
  $article = Article::findOrFail($id);
  return view('art.edit',['article'=>$article]);
 }
//执行修改
public function update(Request $request, $id) 
 {
  $this->validate($request, [
   'title' => 'required|max:50',
   'content'=>'required|max:500',
  ]);

  $article = Article::findOrFail($id);
  $article->update([
   'title' => $request->title,
   'content' => $request->content,
  ]);

   return redirect()->route('blog.index');
 }

九、删除文章

删除按钮

<form action="{{ route('blog.destroy', $article->id) }}" method="post" style="display: inline-block;">
   {{ csrf_field() }}
   {{ method_field('DELETE') }}
   <button type="submit" class="btn btn-danger">删除</button>
  </form>

控制器:

public function destroy($id) 
 {
  $article = Article::findOrFail($id);
  $article->delete();
  return back();
 }

十、结语

本次实验通过一个很简单的迷你博客对 Laravel RESTful 资源控制器和路由,视图,orm进行了强化练习。

好了,以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

PHP 相关文章推荐
PHP面向对象分析设计的经验原则
Sep 20 PHP
PHP+ajax 无刷新删除数据
Feb 20 PHP
php mail to 配置详解
Jan 16 PHP
phpmailer中文乱码问题的解决方法
Apr 22 PHP
php获取当月最后一天函数分享
Feb 02 PHP
twig模板获取全局变量的方法
Feb 05 PHP
PHP后台微信支付和支付宝支付开发
Apr 28 PHP
php实现有序数组旋转后寻找最小值方法
Sep 27 PHP
实例说明js脚本语言和php脚本语言的区别
Apr 04 PHP
PHP基础之输出缓冲区基本概念、原理分析
Jun 19 PHP
PHP isset()及empty()用法区别详解
Aug 29 PHP
PHP 图片处理
Sep 16 PHP
利用laravel+ajax实现文件上传功能方法示例
Aug 13 #PHP
Laravel5.5新特性之友好报错以及展示详解
Aug 13 #PHP
php数据序列化测试实例详解
Aug 12 #PHP
PHP新特性之字节码缓存和内置服务器
Aug 11 #PHP
PHP基于MySQLI函数封装的数据库连接工具类【定义与用法】
Aug 11 #PHP
如何修改Laravel中url()函数生成URL的根地址
Aug 11 #PHP
PHP基于迭代实现文件夹复制、删除、查看大小等操作的方法
Aug 11 #PHP
You might like
php报错502badgateway解决方法
2019/10/11 PHP
Jquery 获得服务器控件值的方法小结
2010/05/11 Javascript
jQuery的实现原理的模拟代码 -5 Ajax
2010/08/07 Javascript
同一页面多个商品倒计时JS 基于面向对象的javascript
2012/02/16 Javascript
jquery 插件学习(六)
2012/08/06 Javascript
实测jquery data()如何存值
2013/08/18 Javascript
js中定义一个变量并判断其是否为空的方法
2014/05/13 Javascript
js 通过cookie实现刷新不变化树形菜单
2014/10/30 Javascript
jQuery知识点整理
2015/01/30 Javascript
js库Modernizr的介绍和使用
2015/05/07 Javascript
jquery.validate 自定义验证方法及validate相关参数
2016/01/18 Javascript
全面解析Bootstrap布局组件应用
2016/02/22 Javascript
javascript实现用户点击数量统计
2016/12/25 Javascript
vue 项目如何引入微信sdk接口的方法
2017/12/18 Javascript
基于JavaScript实现简单扫雷游戏
2021/01/02 Javascript
[01:06:59]完美世界DOTA2联赛PWL S2 Magma vs FTD 第一场 11.29
2020/12/02 DOTA
Python实现全角半角转换的方法
2014/08/18 Python
Python入门篇之函数
2014/10/20 Python
python简单实现基于SSL的IRC bot实例
2015/06/15 Python
python3 模拟登录v2ex实例讲解
2017/07/13 Python
Selenium控制浏览器常见操作示例
2018/08/13 Python
python 递归深度优先搜索与广度优先搜索算法模拟实现
2018/10/22 Python
python 在threading中如何处理主进程和子线程的关系
2020/04/25 Python
Pycharm 2020.1 版配置优化的详细教程
2020/08/07 Python
解决pytorch下出现multi-target not supported at的一种可能原因
2021/02/06 Python
Amaze UI 文件选择域的示例代码
2020/08/26 HTML / CSS
StubHub智利:购买和出售您的门票
2016/11/23 全球购物
Kathmandu澳洲户外商店:新西兰户外运动品牌
2017/11/12 全球购物
应届大学生简历中的自我评价
2014/01/15 职场文书
给市场的环保建议书
2014/05/14 职场文书
2014年国庆节演讲稿
2014/09/19 职场文书
2014年局领导班子自身建设情况汇报
2014/11/21 职场文书
2015年计划生育责任书
2015/05/08 职场文书
2016年国庆节宣传标语
2015/11/25 职场文书
2019各种保证书范文
2019/06/24 职场文书
Win11右下角图标点了没反应怎么办?Win11点击右下角图标无反应解决方法汇总
2022/07/07 数码科技