学习 Laravel - Web 开发实战入门笔记(1)
本笔记根据 LearnKu 教程边学边记而成。该教程以搭建出一个类似微博的Web 应用为最终成果，在过程中学习 Laravel 的相关知识。
准备开发环境
原教程使用官方推荐的 Homestead 开发环境。由于最近 Docker 开始流行，并且也有相应的 Laravel 对应的容器。所以本文以 Laradock 作为开发环境。
安装 Laradock
-
克隆 Laradock 仓库到本地。
git clone https://github.com/laradock/laradock.git最终文件夹结构应该像这样：
+ laradock + project-z -
配置 Laradock
复制配置文件
cd laradock cp env-example .env #复制配置文件进入 Workspace
#运行 Laradock docker-compose up -d nginx #进入 Laradock Workspace
docker-compose exec --user=laradock workspace bash
#For Git Bash
winpty docker-compose exec --user=laradock workspace bash
```
**配置国内加速镜像**
```bash
# Workspace
composer config -gl #查看composer设置
composer config -g repo.packagist composer https://mirrors.aliyun.com/composer/ #设置国内加速镜像
```
构建页面
创建应用
# Workspace
composer create-project laravel/laravel weibo --prefer-dist "5.8.*"
配置 Nginx 域名
cp nginx/sites/laravel.conf.example nginx/sites/weibo.conf
修改新复制出的配置文件里的路径为将要创建的项目路径。
修改 Host
编辑 C:/Windows/System32/Drivers/etc/hosts
增加一条 127.0.0.1 weibo.test
.env 文件
.env 文件包含了项目的一些设置，我们进行一些修改。
APP_NAME=Weibo
APP_ENV=local
APP_KEY=base64:nsvnM5l0N5cOzT/dFqfUoYlkYffhDPnKPuYU4AWMdPc=
APP_DEBUG=true
APP_URL=http://weibo.test
为了方便，我们在本地使用 sqlite 数据库。
注释掉原有 DB 相关设置，添加下面内容
DB_CONNECTION=sqlite
DB_DATABASE=/database/database.sqlite
并且创建相应数据库文件
touch database/database.sqlite
使用 Git 管理代码
cd weibo
git init
git add -A
git commit -m "Initial commit"
上传到 Gitee
git remote add origin git@gitee.com:codingbit/weibo.git
git push -u origin master
使用 Heroku 部署应用
需要先安装 heroku-cli 工具。
-
创建 Heroku App
heroku create -
配置
Procfile文件：echo web: vendor/bin/heroku-php-apache2 public/ > Procfile git add -A git commit -m "Procfile for Heroku" git push heroku buildpacks:set heroku/php -
生成 App Key
#Workspace $ php artisan key:generate --show base64:ta1aE+E8kuyDFlURbUrHEtL4HY71WtoffyNgUKldMWw=#Host heroku config:set APP_KEY=base64:ta1aE+E8kuyDFlURbUrHEtL4HY71WtoffyNgUKldMWw= -
推送到 Heroku 上
git push heroku master
上传成功，访问地址 https://cbit-weibo.herokuapp.com/ 即可看到效果。
统一代码风格
通过编辑器的 EditorConfig 插件，统一代码风格。
.editorconfig
root = true
[*]
charset = utf-8
end_of_line = lf
insert_final_newline = true
indent_style = space
indent_size = 4
trim_trailing_whitespace = true
[*.md]
trim_trailing_whitespace = false
[*.yml]
indent_size = 2
[*.{js,html,blade.php,css,scss}]
indent_style = space
indent_size = 2
静态页面
架子搭好了，开始学习创建基础静态页面。
新建分支
git checkout master
git checkout -b static-pages
移除无用视图
默认的 welcome.blade.php 视图文件，没有用，删掉。
rm resources/views/welcome.blade.php
配置路由
routes/web.php
<?php
Route::get('/', 'StaticPagesController@home');
Route::get('/help', 'StaticPagesController@help');
Route::get('/about', 'StaticPagesController@about');
get 方法有两个参数：1. 访问的URL；2. 操作的控制器及对应的方法
在 Laravel 中我们较为常用的几个基本的 HTTP 操作分别为 GET、POST、PATCH、DELETE。
- GET 常用于页面读取
- POST 常用于数据提交
- PATCH 常用于数据更新
- DELETE 常用于数据删除
其中，PATCH 和 DELETE 是不被浏览器所支持的，我们可以通过在提交表单中做一些手脚，让服务器以为这两个动作是从浏览器中发出的一样。
生成静态页面控制器
生成静态页面控制器：
php artisan make:controller StaticPagesController
添加三个方法
class StaticPagesController extends Controller
{
public function home()
{
return '主页';
}
public function help()
{
return '帮助页';
}
public function about()
{
return '关于页';
}
}
添加静态页面视图
控制器中渲染视图，需要用到 view 方法，view 方法接收两个参数，第一个参数是视图的路径名称，第二个参数是与视图绑定的数据，第二个参数为可选参数。
app/Http/Controllers/StaticPagesController.php
class StaticPagesController extends Controller
{
public function home()
{
return view('static_pages/home');
}
public function help()
{
return view('static_pages/help');
}
public function about()
{
return view('static_pages/about');
}
}
默认情况下，所有的视图文件都存放在 resources/views 文件夹下。
下面创建三个视图。
resources/views/static_pages/home.blade.php
<!DOCTYPE html>
<html>
<head>
<title>Weibo App</title>
</head>
<body>
<h1>主页</h1>
</body>
</html>
resources/views/static_pages/help.blade.php
<!DOCTYPE html>
<html>
<head>
<title>Weibo App</title>
</head>
<body>
<h1>帮助页</h1>
</body>
</html>
resources/views/static_pages/about.blade.php
<!DOCTYPE html>
<html>
<head>
<title>Weibo App</title>
</head>
<body>
<h1>关于页</h1>
</body>
</html>
使用通用视图
使用通用视图避免代码重复的问题。
resources/views/layouts/default.blade.php
<!DOCTYPE html>
<html>
<head>
<title>@yield('title', 'Weibo App') - Laravel 新手入门教程</title>
</head>
<body>
@yield('content')
</body>
</html>
Laravel 的 Blade 模板支持继承，这意味多个子视图可以共用父视图提供的视图模板。
修改视图模板。
resources/views/static_pages/home.blade.php
@extends('layouts.default')
@section('content')
<h1>主页</h1>
@stop
resources/views/static_pages/help.blade.php
@extends('layouts.default')
@section('title', '帮助')
@section('content')
<h1>帮助页</h1>
@stop
resources/views/static_pages/about.blade.php
@extends('layouts.default')
@section('title', '关于')
@section('content')
<h1>关于页</h1>
@stop
Git 代码版本控制
接着让我们将本次更改纳入版本控制中：
git add -A
git commit -m "基础页面"
提交代码
将 Git 切换到 master 分支，并合并 static-pages 分支上的修改：
git checkout master
git merge static-pages
最后将代码推送到 GitHub 和 Heroku 上：
git push # 推送到 Gitee
git push heroku master # 上线到 Heorku
