利用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初学者头疼十四条问题大总结
Nov 12 PHP
php中计算中文字符串长度、截取中文字符串的函数代码
Aug 09 PHP
去除php注释和去除空格函数分享
Mar 13 PHP
PHP移动文件指针ftell()、fseek()、rewind()函数总结
Nov 18 PHP
php采用curl实现伪造IP来源的方法
Nov 21 PHP
初识laravel5
Mar 02 PHP
PHP数组相关函数汇总
Mar 24 PHP
php自动更新版权信息显示的方法
Jun 19 PHP
PHP7.0版本备注
Jul 23 PHP
php微信公众号开发之图片回复
Oct 20 PHP
如何在centos8自定义目录安装php7.3
Nov 28 PHP
PHP 技巧 * SVG 保存为图片(分享图生成)
Apr 02 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 mssql 日期出现中文字符的解决方法
2009/03/10 PHP
ThinkPHP简单使用memcache缓存的方法
2016/11/15 PHP
php封装db类连接sqlite3数据库的方法实例
2017/12/19 PHP
php使用pecl方式安装扩展操作示例
2019/08/12 PHP
ext 同步和异步示例代码
2009/09/18 Javascript
使用javascript实现页面定时跳转总结篇
2013/09/21 Javascript
JQuery的Ajax中Post方法传递中文出现乱码的解决方法
2014/10/21 Javascript
详解WordPress开发中get_current_screen()函数的使用
2016/01/11 Javascript
浅谈Javascript中的函数、this以及原型
2016/10/09 Javascript
微信公众号-获取用户信息(网页授权获取)实现步骤
2016/10/21 Javascript
关于 jQuery Easyui异步加载tree的问题解析
2016/12/06 Javascript
原生js实现轮播图的示例代码
2017/02/20 Javascript
Bootstrap的popover(弹出框)在append后弹不出(失效)
2017/02/27 Javascript
js仿拉勾网首页穿墙广告效果
2017/03/08 Javascript
老生常谈jacascript DOM节点获取
2017/04/17 Javascript
强大的 Angular 表单验证功能详细介绍
2017/05/23 Javascript
react-native使用react-navigation进行页面跳转导航的示例
2017/09/07 Javascript
使用nodeJs来安装less及编译less文件为css文件的方法
2017/11/20 NodeJs
vue自定义组件(通过Vue.use()来使用)即install的用法说明
2020/08/11 Javascript
[01:16]2014DOTA2 TI专访C9战队EE:中国五强中会占三席
2014/07/10 DOTA
[01:04:14]VP vs TNC 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
Python3.6简单操作Mysql数据库
2017/09/12 Python
python+pyqt实现12306图片验证效果
2017/10/25 Python
手把手教你使用Python创建微信机器人
2019/04/29 Python
Flask框架工厂函数用法实例分析
2019/05/25 Python
使用python脚本自动生成K8S-YAML的方法示例
2020/07/12 Python
高职教师岗位职责
2013/12/24 职场文书
交通安全教育制度
2014/02/02 职场文书
送达通知书
2015/04/25 职场文书
介绍信范文大全
2015/05/07 职场文书
三严三实·严以律己心得体会
2016/01/13 职场文书
一个家长教育孩子的心得体会
2016/01/15 职场文书
职业生涯规划书之大学四年
2019/08/07 职场文书
MYSQL 的10大经典优化案例场景实战
2021/09/14 MySQL
python代码实现扫码关注公众号登录的实战
2021/11/01 Python
在Centos 8.0中安装Redis服务器的教程详解
2022/03/21 Redis