Help us understand the problem. What is going on with this article?

Slim -phpフレームワークを触ったメモ

More than 1 year has passed since last update.

学習しても、どんどん忘れちゃうので...
復習がてらPHPのフレームワークで遊びたく...
bladeとwebpackも使いたく......レンタルサーバーで遊びたく...
調べてたら凄くいい記事があったのでslimを触って見た。

使用状況 -v

  • Mojave v10.14.2
  • Composer v1.8.0
  • PHP v7.1.19
  • Slim v3
  • yarn v1.12.3

ざっくり階層

├── cache
│   └── ************.php
├── composer.json
├── composer.lock
├── Controller
│   └── SampleController.php
├── node_modules/
├── package.json
├── public
│   └── index.php
├── resources
│   └── views
│        └── welcome.blade.php
├── routes
│   └── 省略
├── views
│   └── web.php
├── vendor/
├── webpack.mix.js
└── yarn.lock

slimをインストール

フォルダ作って

setup.sh
$ mkdir slim
$ cd slim/
$ mkdir public resources routes Controller cache
$ mkdir resources/views

ファイル作って

setup.sh
$ touch Controller/SampleController.php public/index.php resources/views/sample.blade.php routes/web.php

slimインストール

setup.sh
composer require slim/slim "^3.0"

ファイルに書き込み

public/index.php
<?php

require __DIR__ . '/../vendor/autoload.php';
require __DIR__ . '/../Controller/SampleController.php';
require __DIR__ . '/../routes/web.php';
Controller/SampleController.php
<?php

use Slim\Container;
use Slim\Http\Request;
use Slim\Http\Response;

class SampleController
{
    private $app;

    public function __construct(Container $app)
    {
        $this->app = $app;
    }

    public function index(Request $request, Response $response)
    {
        $name = $request->getAttribute('name');
        $array = ['test' => "Hello, $name"];
        return $this->app->view->render($response, 'sample', $array);
    }
}
routes/web.php
<?php

$config = [
    'settings' => [
        'displayErrorDetails' => true, 
        'renderer'            => [
            'blade_template_path' => __DIR__ . '/../resources/views',
            'blade_cache_path'    => __DIR__ . '/../cache', 
        ],
    ],
];

$app = new \Slim\App($config);

$container = $app->getContainer();

$container['view'] = function ($container) {
    return new \Slim\Views\Blade(
        $container['settings']['renderer']['blade_template_path'],
        $container['settings']['renderer']['blade_cache_path']
    );
};

$app->get('/hello/{name}', SampleController::class . ':index');

$app->run();
views/sample.blade.php
{{$test}}

テンプレートエンジンの bladeインストール

setup.sh
composer require rubellum/slim-blade-view

PHP built-in serverを起動してローカル環境確認

setup.sh
php -S localhost:8080 -t public public/index.php

確認先
http://localhost:8080/hello/test

webpack面倒なのでlaravelmixインストール

package.json 作って、

setup.sh
touch package.json

ファイルに記入。
ほぼ、laravelからのコピペで、yarnを使うのでちょっと書き換え。

package.json
{
    "private": true,
    "scripts": {
        "dev": "yarn run development",
        "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
        "watch": "yarn run development -- --watch",
        "watch-poll": "yarn run watch -- --watch-poll",
        "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
        "prod": "yarn run production",
        "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
    },
    "devDependencies": {
        "axios": "^0.18",
        "bootstrap": "^4.0.0",
        "cross-env": "^5.1",
        "jquery": "^3.2",
        "laravel-mix": "^4.0.7",
        "lodash": "^4.17.5",
        "popper.js": "^1.12",
        "resolve-url-loader": "^2.3.1",
        "sass": "^1.15.2",
        "sass-loader": "^7.1.0",
        "vue": "^2.5.17"
    }
}

yarnをインストール

yarnを設定してlaravelmixをインストールして、ホームディレクトリにwebpack.mix.jsをコピペ。

setup.sh
$ yarn
$ laravel-mix --save-dev
$ cp node_modules/laravel-mix/setup/webpack.mix.js ./

コンパイル用のjsとsassのフォルダとファイルを作成

setup.sh
$ mkdir resources/js resources/sass
setup.sh
$ touch resources/js/app.js resources/sass/app.scss

webpack.mix.jsに排出先を書き込み

webpack.mix.js
const mix = require("laravel-mix");

mix.js("resources/js/app.js", "public/js").sass(
    "resources/sass/app.scss",
    "public/css"
);

おしまい。
既存のサイトをフレームワークにしたりして遊ぶ。

あとがき

PHP built-in serverでcss、js、画像も表示させる

publicフォルダにrouter.phpを作ってローカルでデザイン確認

public/router.php
<?php

// define environment
$_SERVER["FUEL_ENV"] = 'development';

// static files
if (preg_match('/\.(?:png|jpg|jpeg|gif|css|js).?[0-9]{0,10}$/',
               $_SERVER["REQUEST_URI"])
    or strpos($_SERVER["REQUEST_URI"], 'assets/fonts'))
{
    return false;
}

// requests including '.json'
if (strpos($_SERVER['REQUEST_URI'], '.json'))
{
    $_SERVER["PATH_INFO"] = preg_replace('/\?.+$/', '',
                                          $_SERVER['REQUEST_URI']);
}

require_once __DIR__.'/index.php';

ローカルでデザイン確認

setup.sh
php -S localhost:8080 -t public public/router.php

レンタルサーバーにアップロードしてみる

フォルダやファイル丸見えなので...
publicフォルダに.htaccessを作る

public/.htaccess
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^ index.php [QSA,L]

publicフォルダをurlから消す為にホームディレクトリに.htaccessを作る。

/.htaccess
RewriteEngine On
RewriteRule ^(.*) /public/$1

memo

反省点
フレームワークも、まだまだ勉強すること沢山だな....

参考にさせて頂いたサイト:ありがとうございます。


noboo
忘れっぽい.... なんちゃってWEBデザイナー のメモ。
https://www.digitalbath.jp
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした