Hello World出力(Laravel11)

概要

Laravel11の環境でHello World出力ついて確認してみましょう。
事前準備は以下の記事から確認してください。

事前準備

１．RaspberryPIの本体（RPI３B以上）
２．最新OSをインストール済
３．Laravel環境を構築
４．サンプルソースをgitからダウンロード

■Raspberry PIにLaravel11をインストール

Visual Studio Codeの拡張プラグインを確認

以下の拡張プラグインをインストールする（当時：バージョン）
・Japanese Language Pack for Visual Studio Code v1.93.2024091109
・Laravel Blade Snippets v.1.36.1
・Laravel Artisan v0.0.31
・Laravel goto view v1.3.11
・PHP Debug v1.35.0
・PHP IntelliSense v1.3.3
・PHP Namespace Resolver v1.1.9
・Remote-SSH v0.115.1
・Remote-SSH:Editing Configuration Files v0.87.0
・Remote Exploer v0.4.3
・vscode-icons v12.9.0
・DotEnv v1.0.1

前回のサンプルソースを表示

RaspberryPIへSSHプロトコルで接続した画面です。

ディレクトリ構成

下記のディレクトリがLaravelプロジェクトのディレクトリ構成になります。
各ディレクトリについては使う場面で説明していきます。
まずWEBにて公開されるディレクトリは「public」です。Linux上でApacheの「/var/www/html」がこのディレクトリに該当します。

application
 -app
 -bootstrap
 -config
 -database
 -public
 -resources
 -routes
 -storage
 -tests
 -vendor
 -.env

サンプルソースの初期ページを確認

以下のコマンドをサンプルソースディレクトリで実行します。

①artisanを実行します。
/home/pi/workspace/example-app
php artisan serve --host [raspberry pi ip]
②コマンドの実行例です。

pi@RPI3B:~/workspace/example-app $ /bin/php artisan serve --host 192.168.1.65

   INFO  Server running on [http://192.168.1.65:8000].

  Press Ctrl+C to stop the server

③ブラウザを起動して次のURLを確認します。
URLをブラウザにコピーして貼り付けるとLaravelの初期ページが表示されます。
確認URL:http://192.168.1.65:8000

表示されているテキストを変更して再表示

①「public」ディレクトリのindex.phpの内容を確認します。

②「resource-views」のwelcome.blade.phpファイルを確認します。

③初期ページに表示されている「Laracasts」文字列を「Laravel TEST」に変更します。



④変更した内容を保存した後、ブラウザにてF5キーを押下します。
「Laracasts→Laravel TEST」に変更されて表示されていることが確認できます。

routesにパスを追加して画面表示

①プロジェクトのディレクトリ構成の中で「routes-web.php」を開きます。

②次のコードを追加します。

Route::get('/hello', function () {
    return 'Hello Wrold!';
});

③次のURLをブラウザに入力してアクセスします。
http://192.168.1.65:8000/hello

④以下のように「Hello World!」」が表示されます。
このようにパスを変更して別のページをアクセスすることができます。

response Helperを利用して「Hello World!」を出力

①次のようにコードを修正します。

Route::get('/hello', function () {
    return response('Hello Wrold!',404);
});

②次のURLをブラウザに入力してアクセスします。
http://192.168.1.65:8000/hello
③前回の「Hello World!」と同じ表示ではありますが、Chromeブラウザで「F12」キーを押下して次のように画面を確認するとStatus　Codeも画面へ設定が可能でした。

④Status　Codeを「200」に設定して再表示してみます。(F5キーを押下）

⑤画面を再度確認します。(F5キーを押下）
次のようにStatus　Codeが「200」に表示されていることが確認できます。

HTMLタグを追加でフォントサイズを大きく設定して表示

①次のHTMLタグを追加します。

Route::get('/hello', function () {
    return response('<h1>Hello Wrold!</h1>',200);
});

②次のURLをブラウザに入力してアクセスします。
http://192.168.1.65:8000/hello
③画面を再度確認します。(F5キーを押下）
次のように「Hello World!」フォントが大きく表示されていることが確認できます。

WEBページのContent-typeを「text/plain」に指定して表示

①次のコードをソースに追加します。

Route::get('/hello', function () {
    return response('<h1>Hello Wrold!</h1>',200)
    ->header('Content-type','text/plain');
});

②次のURLをブラウザに入力してアクセスします。
http://192.168.1.65:8000/hello

③画面を再度確認します。(F5キーを押下）
次のようにHTMLタグがそのままテキストとして表示されていることが確認できます。
Content-Typeは「text/plain; charset=UTF-8」になっていることも確認できます。

ブラウザのヘッダーにキーと値を設定して表示

①次のコードをソースに追加します。

Route::get('/hello', function () {
    return response('<h1>Hello Wrold!</h1>',200)
    ->header('Content-type','text/plain')
    ->header('headerValue','12345667890');
});

②次のURLをブラウザに入力してアクセスします。
http://192.168.1.65:8000/hello

③画面を再度確認します。(F5キーを押下）
次のように「'headerValue'キーに'1234567890'が設定されていることが確認できます。

終わりに

今回は単純に画面上にテキスト変更及びStatus Codeを設定、response Helperを利用して画面表示について知ることができました。
Laravelのフレームワークは色々便利な機能がありますね。
今日はここまでです。ありがとうございます。