初心者向けに『Laravel』解説の追加動画を撮影中で、

これは公開してもいいかなと思ったので無料公開することにしました。

動画はこちら。

動画を見ていただきつつ、補足解説をしていきたいと思います。

Laravel フロントエンドの分離

『Laravel』 5.8までは、
Bootstrapが内蔵されていたのですが、

『Laravel』6.xからフロント側が分離されて、

『Laravel-ui』というパッケージに変わりました。

インストール方法は『composer』を使って、

// Laravel最新
composer require laravel/ui --dev

// Laravel 6.x
composer require laravel/ui "1.x" --dev

としてあげるとインストールすることができます。

『Laravel/ui』には大きく3つの選択肢があります。

• Bootstrap
• Vue
• React

プログラミング初心者の場合はまずは『Bootstrap』がいいかなと思います。

Bootstrapの関連記事

もんプロ～問題発見と解決のためのプログラミング〜

【レスポンシブサイト】のつくり方をめっちゃわかりやすく書いてみた【Bootstrap4...

https://coinbaby8.com/how-to-make-responsive-site.html

『レスポンシブサイト』の作り方を知りたいんだけど・・どれくらい難しいんだろう・・できたら簡単につくりたいんだけど・・こんなお悩みにお応えさせていただきます。そもそも『レスポンシブサイト』って何？『レスポンシブサイト』を一言で言えば、パソコンでもスマホでもいい感じに表示されるサイトと言っていいのかなと思います。2000年頃は、ホームページといえばパソコンの事だけ考えていればよかったんですが、2008年に『iPhone3G』が発売されて以来、スマホを持つ人が年々少しずつ増えていきました。『iPhone3G』の頃はまだ『...

最近勢いが増している『SPA』を作る場合は、『Vue/React』どちらかになるかなと。

SPA・・シングルページアプリケーション

また、いずれかをインストールするときに、–authとオプションをつけることで、
認証機能も同時にインストールすることができます。

php artisan ui bootstrap --auth 

アオキ

ログイン機能があっさりつくれちゃう・・なんて便利な機能なんでしょう。

Laravel フロントエンド 3つの必須ツール

動画の中で3つの必須ツールを紹介しています。

• Node.js/npm
• webpack
• babel

他にもたんまりあるんですが、まずは3つを押さえておくといいかなと。

フロントエンドが進化しすぎてブラウザ表示ができない場合があるので、

新しい書き方 -> 古い書き方 にコンパイルして(babel)、

たくさんのファイル -> 一つのファイル にがっちゃんこ(webpack)して、

それらを1つの管理ツール(npm)でまとめちゃうことで、

作り手としてもつくりやすく、
使い手としても読み込み時間が短くストレスフリーになるという、

ウィンウィンな環境にはなります。

とりあえず『Node.js』をインストールしておもむろに、

npm install
npm run dev

という魔法のコマンドを打つことで、

あれよあれよとフロント側のパッケージがどーんとインストールされて、
いろいろとよしなにやってくれるというのが体感できるのではと思います。

アオキ

最近のフロント側の開発では必須と言ってもいいと思います。

Laravel フロントエンド 認証の補足

『PHP/Laravel』初心者向け動画でもご説明しているのですが、

『Laravel』標準の認証機能だと、1つの管理画面しか作成されないのですが、

ファイルをいくつかつくったり、いじったりすることで、

使う側と管理側それぞれに管理画面を持たせることもできたりします。

『マルチログイン』と呼ばれたりもして、
過去にリサーチしていた記事もあるのでご紹介しておきます。

関連記事

もんプロ～問題発見と解決のためのプログラミング〜

 

1 Share

7 Users

25 Pockets

【Laravel】マルチログイン(ユーザーと管理者など)機能を設定してみた【体験談】

https://coinbaby8.com/laravel-multi-login.html

2020/7/8追記この記事はLaravel 5.5 でやや古いです。最新版(Laravel 8.x)を使って設定した内容をUdemy講座にしていますので、ぜひご参考にされてください。以下 Laravel 5.5 実施時の情報になります。インターネット上で写真や情報をやりとりできるような『Webアプリ』や『Webサービス』では、使う人(ユーザー)がログインして、自分専用の管理画面から記事を投稿したり、写真をアップできるようになっています。PHPのてんこもりフレームワーク『Laravel(ララベル)』では、使う人(ユーザー)がログインだけの機能であれば、ものの1分で...

最近流行りの『SPA』をつくるなら、
この辺りの機能も『フロント側』でつくることになるかなと思うのですが、

『SPA』はまだ『SEO』が弱いという情報もあったりするし、
管理画面でいえば『SPA』化させる必要はないのかなと思ったりもするので、

引き続き、
『Laravel』のフロント側パッケージ『Blade(ブレード)』の出番も多いのかなと思っています。

アオキ

もちろんつくるアプリ次第にはなってくると思います。

Laravel フロントエンド を解説してみて

『フロントエンド』は進化が激しく、
来年にはまだ状況が変わっているかもですが、

昨今の環境をできるだけわかりやすく解説することで、

少しでも『Laravel』にとっつきやすくなって、

自在に『webアプリ』がつくれるようになる人が増えればいいなと思っています。

アオキ

軽めのwebアプリならつくれるようになるところまで解説していきたいと思い、がっつり動画の追加撮影を頑張っております。

関連記事

もんプロ～問題発見と解決のためのプログラミング〜

 

1 User

1 Pocket

【PHP/Laravel】初心者向けの動画をリリースしました【Udemy】

https://coinbaby8.com/udemy-php.html

2022/09/21追記 Laravel9対応しました。こちらの記事投稿から早3ヶ月。ようやく、ようやく、『Udemy』向け動画を全て撮影し終わりました。こちらからご覧いただけます。定価9,600円ですが、クーポン経由で大幅割引されます。(新規登録やタイミングで価格変動するようです。)最新クーポン情報はこちら動画85本でリリースし、リリース後に『Laravel動画』をたっぷり追加し現在約120本。時間にして約11時間。11時間といっても、途中からコード入力時は早送りをかけていたり、不要な間が空かないようにズバズバと編集をかけていたりするの...

アオキ

Youtubeでもどんどん情報発信していきますので、ぜひチャンネル登録お願いしますm(_ _ )m

PHPフレームワーク Laravel Webアプリケーション開発 バージョン8.x対応

created by Rinker

• Amazon
• 楽天市場
• Yahooショッピング

『Laravel』ではこんな記事も読まれています。