Laravel5.7从零开始(一)

安装

这是为初学者提供了一个全面的 Laravel 视频教程,是你开始 Laravel 学习之旅的好地方。本文参(chao)照(xi) Laracasts 英文视频教程,只为想学习 Laravel 的小伙伴们一个引导,致敬 Laracasts 提供高质量视频。

服务器要求

Laravel 对系统有一些要求。请确保你的服务器或者开发环境满足下面的要求:

  • PHP >= 7.1.3
  • OpenSSL PHP 扩展
  • PDO PHP 扩展
  • Mbstring PHP 扩展
  • Tokenizer PHP 扩展
  • XML PHP 扩展
  • Ctype PHP 扩展
  • JSON PHP 扩展

安装 Laravel

Laravel 使用 Composer来管理项目依赖。因此,在使用 Laravel 之前,请确保你的机器已经安装了 Composer

Composer 安装就不多写了,官网下载:戳这里
安装方法百度一大堆,如果还是不清楚的小白欢迎加企鹅群:312621686

Laravel 安装器创建项目

首先,通过使用 Composer 安装 Laravel 安装器:

1
composer global require "laravel/installer"

安装完成后,laravel new 命令会在你指定的目录创建一个全新的 Laravel项目。例如,laravel new myfirstsite 将会创建一个名为 myfirstsite 的目录,并已安装好所有的 Laravel依赖项:

1
laravel new myfirstsite

composer 安装项目可能需要翻墙,如果没有梯子可以使用国内镜像:composer中国镜像

Composer 创建项目

你也可以在终端中运行 create-project 命令来安装 Laravel 项目:

1
composer create-project --prefer-dist laravel/laravel myfirstsite

本地开发环境推荐

本地PHP开发环境有很多,这里我推荐两个给大家,没有好与坏,自己用得习惯才是最好的:
MacOS: Valet 中文安装教程
Windows: Laragon

网站根目录

安装完 Laravel 之后,你必须将 web 服务器根目录指向 public 目录。该目录下的 index.php 文件将作为所有进入应用程序的 HTTP 请求的前端控制器。

目录权限

安装完Laravel 后,MacOS、Linux系统你可能需要给这两个文件配置读写权限:storage 目录和 bootstrap/cache 目录应该允许 Web 服务器写入,否则 Laravel 程序将无法运行。

总结

本节主要讲解 Laravel 服务器要求、两种创建Laravel项目方式、本地开发环境推荐、及网站根目录位置及MacOS、Linux系统目录权限问题。中间有不懂的可以自行百度解决,也欢迎加入企鹅群(312621686)进行交流。

源码地址:戳这里


基本路由

在学习新框架时,您的首要任务之一是确定如何处理路由。或者换句话说,当我访问浏览器中的首页URL时,浏览器中展现欢迎页面!

所有的 Laravel 路由都在 routes 目录中的路由文件中定义,这些文件都由框架自动加载。routes/web.php 文件用于定义 web 界面的路由。这里面的路由都会被分配给 web 中间件组,它提供了会话状态和 CSRF 保护等功能。定义在 routes/api.php 中的路由都是无状态的,并且被分配了 api 中间件组。

今天我们先从基本的web界面路由开始,打开 routes/web.php

1
2
3
Route::get('/', function () \{
return view('welcome');
});

构建最基本的路由只需要一个 URI 与一个 闭包,这里提供了一个非常简单优雅的定义路由的方法,向浏览器展示 welcome 页面信息。

welcome 试图在 resources/views 文件夹下定义,简单修改一下看是否改变:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">

<title>Laravel</title>

<!-- Fonts -->
<link href="https://fonts.googleapis.com/css?family=Nunito:200,600" rel="stylesheet" type="text/css">

<!-- Styles -->
<style>
html, body {
background-color: #fff;
color: #636b6f;
font-family: 'Nunito', sans-serif;
font-weight: 200;
height: 100vh;
margin: 0;
}

.full-height {
height: 100vh;
}

.flex-center {
align-items: center;
display: flex;
justify-content: center;
}

.position-ref {
position: relative;
}

.top-right {
position: absolute;
right: 10px;
top: 18px;
}

.content {
text-align: center;
}

.title {
font-size: 84px;
}

.links > a {
color: #636b6f;
padding: 0 25px;
font-size: 13px;
font-weight: 600;
letter-spacing: .1rem;
text-decoration: none;
text-transform: uppercase;
}

.m-b-md {
margin-bottom: 30px;
}
</style>
</head>
<body>
<div class="flex-center position-ref full-height">
<div class="content">
<div class="title m-b-md">
Hello Laravel
</div>

<div class="links">
<a href="https://laravel.com/docs">Documentation</a>
<a href="https://laracasts.com">Laracasts</a>
<a href="https://laravel-news.com">News</a>
<a href="https://nova.laravel.com">Nova</a>
<a href="https://forge.laravel.com">Forge</a>
<a href="https://github.com/laravel/laravel">GitHub</a>
</div>
</div>
</div>
</body>
</html>

基本使用

在web路由页面创建 aboutnews 路由:

1
2
3
4
5
6
7
Route::get('/about', function () {
return view('about');
});

Route::get('/news', function () {
return view('news');
});

resources/views 下创建 about.blade.phpnews.blade.php 试图:

  • about.blade.php
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">

<title>Laravel</title>

<!-- Fonts -->
<link href="https://fonts.googleapis.com/css?family=Nunito:200,600" rel="stylesheet" type="text/css">

<!-- Styles -->
<style>
html, body {
background-color: #fff;
color: #636b6f;
font-family: 'Nunito', sans-serif;
font-weight: 200;
height: 100vh;
margin: 0;
}

.full-height {
height: 100vh;
}

.flex-center {
align-items: center;
display: flex;
justify-content: center;
}

.position-ref {
position: relative;
}

.top-right {
position: absolute;
right: 10px;
top: 18px;
}

.content {
text-align: center;
}

.title {
font-size: 84px;
}

.links > a {
color: #636b6f;
padding: 0 25px;
font-size: 13px;
font-weight: 600;
letter-spacing: .1rem;
text-decoration: none;
text-transform: uppercase;
}

.m-b-md {
margin-bottom: 30px;
}
</style>
</head>
<body>
<div class="flex-center position-ref full-height">


<div class="content">
<div class="title m-b-md">
假装写代码的晚黎
</div>

<div class="links">
<a href="/">Home</a>
<a href="/about">about</a>
<a href="/news">News</a>
</div>
</div>
</div>
</body>
</html>
  • news.blade.php
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">

<title>Laravel</title>

<!-- Fonts -->
<link href="https://fonts.googleapis.com/css?family=Nunito:200,600" rel="stylesheet" type="text/css">

<!-- Styles -->
<style>
html, body {
background-color: #fff;
color: #636b6f;
font-family: 'Nunito', sans-serif;
font-weight: 200;
height: 100vh;
margin: 0;
}

.full-height {
height: 100vh;
}

.flex-center {
align-items: center;
display: flex;
justify-content: center;
}

.position-ref {
position: relative;
}

.top-right {
position: absolute;
right: 10px;
top: 18px;
}

.content {
text-align: center;
}

.title {
font-size: 84px;
}

.links > a {
color: #636b6f;
padding: 0 25px;
font-size: 13px;
font-weight: 600;
letter-spacing: .1rem;
text-decoration: none;
text-transform: uppercase;
}

.m-b-md {
margin-bottom: 30px;
}
</style>
</head>
<body>
<div class="flex-center position-ref full-height">


<div class="content">
<div class="title m-b-md">
Larametrics
</div>
<p>
Larametrics is an open-source self-hosted metrics and notifications platform for Laravel apps created by Andrew Schmelyun. It’s simple to get started and only takes a few minutes to get started. The official Getting Started documentation describes Larametrics as follows:

What exactly does that mean? Think of it as a simple version of sentry.io or rollbar.com. Consisting of a series of watchers keeping an eye on model changes, log entries, and route requests, Larametrics alerts you through email or Slack when one of your notification triggers is met.

The documentation describes a few notification examples:

Email me when a notice or info message is logged
Alert me through Slack and email when an error is logged
Let me know when an Admin model is created or deleted
Tell me when someone visits the /auth/login route
</p>

<div class="links">
<a href="/">Home</a>
<a href="/about">about</a>
<a href="/news">News</a>
</div>
</div>
</div>
</body>
</html>

总结

这节简单的介绍了 Laravel 框架的基本路由使用,需要在web浏览器中看见我们想要呈现的页面,需要两个步骤:

  1. routes/web.php 定义web页面路由
  2. resources/views 下创建对应路由的视图文件

源码地址:戳这里


Blade模板

在构建视图时,不仅限于基本的PHP。你可以使用 Laravel 提供的强大模板引擎。我们将在以后更多地讨论和使用 Blade 模板引擎。现在,让我们利用它来创建一个布局文件,以减少页面的重复性和复杂性。

Blade 简介

BladeLaravel 提供的一个简单而又强大的模板引擎。和其他流行的 PHP 模板引擎不同,Blade 并不限制你在视图中使用原生 PHP 代码。所有 Blade 视图文件都将被编译成原生的 PHP 代码并缓存起来,除非它被修改,否则不会重新编译,这就意味着 Blade 基本上不会给你的应用增加任何负担。Blade 视图文件使用 .blade.php 作为文件扩展名,被存放在 resources/views 目录。

Blade 的两个主要优点是 模板继承区块 。为方便入门,让我们先通过一个简单的例子来上手。

定义布局

在上一节基本路由中我们创建了 about.blade.php 视图和 news.blade.php 视图,这两个视图和基本基本的 welcome.blade.php 视图 90% 代码重复,下面我们创建一个布局。
undefined

继承布局和区块

  • welcome.blade.php
1
2
3
4
5
6
7
@extends('layout')

@section('title', 'Laravel')

@section('content')
Hello Laravel
@endsection
  • about.blade.php
1
2
3
4
5
6
7
@extends('layout')

@section('title', '关于我')

@section('content')
假装写代码的晚黎
@endsection
  • news.blade.php
1
2
3
4
5
6
7
@extends('layout')

@section('title', 'Laravel News')

@section('content')
Laravel News
@endsection

总结

本节简单的介绍了 Blade 模板引擎的两大基本特性: 继承区块@yield 指令在没有数据的情况下第二个参数可以指定默认值:@yield('title', 'Laravel News') ,同时这个指令在生成 HTML代码的时候不会产生换行。

源码地址:戳这里


视图渲染数据

我们经常需要将数据库中的数据显示在视图上。也可能是配置文件固定数据展示,下面让我们来看看视图渲染数据。为了简洁展示数据,删掉 layout.blade.php 中多余的代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">

<title>@yield('title', 'Laravel')</title>
</head>
<body>
<div class="flex-center position-ref full-height">


<div class="content">
@yield('content')

<div class="links">
<a href="/">Home</a>
<a href="/about">about</a>
<a href="/news">News</a>
</div>
</div>
</div>
</body>
</html>

然后我们在路由向视图传递数据:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
Route::get('/', function () {
$codes = [
'php',
'java',
'javascript',
'C',
'python'
];


// return view('welcome', ['codes' => $codes]);

// return view('welcome', compact('codes'));

// return view('welcome')->withCodes($codes);

// return view('welcome')->with(compact('codes'));

return view('welcome', [
'codes' => [
'php',
'java',
'javascript',
'C',
'python'
]
]);
});

在视图文件中渲染数据:

1
2
3
4
5
6
7
8
9
10
11
@extends('layout')

@section('title', 'Laravel')

@section('content')
<ul>
@foreach($codes as $code)
<li>{{ $code }}</li>
@endforeach
</ul>
@endsection

Blade 语句会自动调用 PHPhtmlspecialchars 函数防止 XSS 攻击。

显示未转义数据

默认情况下,Blade 语句会自动调用 PHP 的 htmlspecialchars 函数防止 XSS 攻击。不想转义的话,可以使用以下语法:

1
2
3
4
5
6
7
8
9
10
11
12
@extends('layout')

@section('title', 'Laravel')

@section('content')
<ul>
@foreach($codes as $code)
{{-- <li>{{ $code }}</li> --}}
<li>{!! $code !!}</li>
@endforeach
</ul>
@endsection

Blade 也能在视图中定义注释。但是,和 HTML 的注释不同的是,Blade 注释不会被包含在应用程序返回的 HTML 内。

总结

本节主要讲解视图数据渲染,重点理解 Laravel 框架在传递数据的5中方式,数据转义。

源码地址:戳这里


控制器

为了替代在路由文件中以闭包的形式定义所有的请求处理逻辑,我们使用控制器类来组织这些行为。控制器能将相关的请求处理逻辑组成一个单独的类,控制器被存放在 app/Http/Controllers 目录下。

前几节我们通过 路由 -> 视图,当我们逻辑、获取数据过多时放在路由里面就不合适了,现在我们以 路由 -> 控制器 -> 视图 的方式来代替上节的代码。

创建控制器

通过 Artisan 命令工具里的 make:controller 创建一个 PagesController

1
php artisan make:controller PagesController

添加三个方法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class PagesController extends Controller
{
public function home()
{
$codes = [
'php',
'java',
'javascript',
'C',
'python',
'<h1>React</h1>'
];

return view('welcome')->with(compact('codes'));
}

public function about()
{
return view('about');
}

public function news()
{
return view('news');
}
}

修改路由

1
2
3
Route::get('/', 'PagesController@home');
Route::get('/about', 'PagesController@about');
Route::get('/news', 'PagesController@news');

总结

理解 路由 -> 控制器 -> 视图 方式创建视图,这是最基本的逻辑方式,新人学习 Laravel 按照这个思维来写代码,不管以后多复杂的代码逻辑都是按照这个来衍生。

源码地址:戳这里