Learning Laravel, the first thing you want to learn is how the main page is loaded. Usually, you would expect this to be in the index.php or index.html file, however, Laravel's Framework is a little smarter than that. Here we are going to show you different ways you can view your HTML pages by creating routes.
The first file you want to take a look at is the routes/web.php: http://www.example.com
Here is one example:Route::get('/', function () {
return view('welcome');});
This code is simply defining root '/' as the 'welcome' template, therefore, to see the HTML for the welcome page, you will need go to the resources/views/welcome.blade.php
NOTE: you can also name this template as: resources/views/welcome.php
Open the welcome.blade.php and you will see the HTML for the home page
Here are other ways you can define the routing blade template:
About us page pointing to the about.blade.php file: http://www.example.com/aboutRoute::get('/about', function () { return view('about');});resources/views/about.blade.php
No template, just return text or variable: http://www.example.com/helloRoute::get('/hello', function () { return "Hello World";});
Show JSON using an array: http://www.example.com/JSONRoute::get('/JSON', function () { return ['foo' => 'bar'];});
IMPORTANT: Its important to note that the routing URL is case sensitive. In the example above, if you tried http://www.example.com/json or http://www.example.com/Json it would not work.
So far, we've been working with pre-defined set of variables for our templates, however, one of the reasons we use php its for dynamic capabilities and flexibility for websites. Lets pass variables through the URL as a parameter. Lets say we want to load the about us page template at /resources/views/pages.blade.php using a URL parameter. http://example.com/?page=contact - you could use this code in the web.php file:Route::get('/', function () {
$page = request('page');
return $page;
});
Another way you can retrieve the URL parameter as a variable is using this sample code:
Route::get('/', function () { $page = request('page'); return $page;});
To pass URL parameters to the blade template you can you this for example: http://example.com/?pages=contact
web.php:
Route::get('/', function () {
$pages = request('pages');
Return View('pages', [
'pages' => $pages
]);
});
You ca also inline it shorter like this:
Route::get('/', function () { Return View('pages', [ 'pages' => request('pages') ]);});
pages.blade.php
<!DOCTYPE HTML><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Pages</title> </head> <body> <h1><?= $pages; ?></h1> </body></html>
This is a very simple way to pass parameters as variables, however, it is NOT SECURED!!!!! In a test development environment this would be OK. I production, you will need to escape the parameters. echoing variables directly from GET URL parameters is very dangerous because we are echoing whatever the user provides as unmodified. To secure your website, you can use htmlspecialchars:
using htmlspecialchars() <h1><?= htmlspecialchars($pages, ENT_QUOTES); ?></h1>
Laravel Blade Escaped - Laravel makes it simple with its blade template engine, all you have to do is add double curly braces to the variable:<h1>{{ $pages }}</h1>
Laravel Blade Unescaped - There are going to be rare circumstances when you will need to echo GET parameters unescaped, for this, Laravel provides a way to print unescaped variables, WARNING!!!! use caution when using this feature in production environments: A good example where you would use this is when you are fetching variables from a database which is plain HTML, you wouldn't want to escape it and you wanted it rendered and interpreted.<h1>{!! $pages !!} - Blade Unescaped</h1>
Another way you can pass URL variables is using this example, in this example, you will see the PageId variable inthe OUTPUT of the / (web.php)
Route::get('/page/{PageId}', function ($PageId) { return $PageId;});
Using a wild card {$foo} You can alos use an array from a database to output the into the blade template, you can use this example: http://example.com/page/contact
Route::get('/page/{PageId}', function ($PageId) { $pages = [ 'contact' => 'This is the Contact us pages', 'about' => 'This is the About us pages' ]; Return View('pages', [ 'pages' => $pages[$PageId] ?? 'NOT IN THE ARRAY' // DEFAULT, if not define, it will error out ]);});
If the page does not exits, the pratical thing to do is to throw a 404 page error, you can do this with the following:
Route::get('/page/{PageId}', function ($PageId) { $pages = [ 'contact' => 'This is the Contact us pages', 'about' => 'This is the About us pages' ]; // SHOW 404 PAGE: if(! array_key_exists($PageId, $pages)){ abort(404, 'Page is not found'); } Return View('pages', [ 'pages' => $pages[$PageId] ]);});
This is how the files looked like at the end of this tutorial:
routes/web.php:
<?php
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Route::get('/', Function () {
Return View('welcome');
});
Route::get('/hello', function () {
return "Hello World";
});
Route::get('/JSON', function () {
return ['foo' => 'bar'];
});
// http://myapp.test/?page=contact
Route::get('/', function () {
$page = request('page');
return $page;
});
Route::get('/', function () {
$pages = request('pages');
Return View('pages', [
'pages' => $pages
]);
});
Route::get('/', function () {
Return View('pages', [
'pages' => request('pages')
]);
});
//https://laracasts.com/series/laravel-6-from-scratch/episodes/7?autoplay=true
Route::get('/page/{PageId}', function ($PageId) {
$pages = [
'contact' => 'This is the Contact us pages',
'about' => 'This is the About us pages'
];
// SHOW 404 PAGE:
if(! array_key_exists($PageId, $pages)){
abort(404, 'Page is not found');
}
Return View('pages', [
'pages' => $pages[$PageId]
]);
});
resources/views/welcome.blade.php:
<!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">
<!-- 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">
@if (Route::has('login'))
<div class="top-right links">
@auth
<a href="{{ url('/home') }}">Home</a>
@else
<a href="{{ route('login') }}">Login</a>
@if (Route::has('register'))
<a href="{{ route('register') }}">Register</a>
@endif
@endauth
</div>
@endif
<div class="content">
<div class="title m-b-md">
myAPP
</div>
<div class="links">
<a href="https://laravel.com/docs">Docs</a>
<a href="https://laracasts.com">Laracasts</a>
<a href="https://laravel-news.com">News</a>
<a href="https://blog.laravel.com">Blog</a>
<a href="https://nova.laravel.com">Nova</a>
<a href="https://forge.laravel.com">Forge</a>
<a href="https://vapor.laravel.com">Vapor</a>
<a href="https://github.com/laravel/laravel">GitHub</a>
</div>
</div>
</div>
</body>
</html>
resources/views/pages.blade.php:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>{{$pages}}</title>
</head>
<body>
<a href="http://myapp.test/?pages=contactss">http://myapp.test/?pages=contactss</a>
<h1><?= $pages; ?> PHP Unescaped</h1>
<h1><?= htmlspecialchars($pages, ENT_QUOTES); ?> PHP htmlspecialchars</h1>
<h1>{{$pages}} - Blade Escaped</h1>
<h1>{!! $pages !!} - Blade Unescaped</h1>
<hr>
<p><a href="http://myapp.test/page/contact">http://myapp.test/page/contact: </a>{{ $pages }}</p>
<p><a href="http://myapp.test/page/notInArray">http://myapp.test/page/notInArray: </a>{{ $pages }}</p>
</body>
</html>
Hope this helps.
Webune Team