Saturday, June 3, 2017

Laravel From Scratch 4

.
.
BLADE TEMPLATING & COMPILING

1)CREATE VIEW LAYOUT

create file: lsapp/resources/views/layouts/app.blade.php

edit content:
<!doctype html>
<html lang="{{config('app.locale')}}">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"
<meta name="viewport" content="device-width,initial-scale=1">
<title>{{config('app.name','LSAPP')}}</title>
</heade>
<body>
@yield('content')
</body>
</html>


2) EDIT VIEW PAGE

edit file: lsapp/resources/views/pages/index.blade.php

edit content:
@extends('layouts.app')

@section('content')
<h1>Welcome To Laravel</h1>
<p>This is the Laravel application from the "Laravel From Scratch" Youtube series</p>
@endsection


edit file: lsapp/resources/views/pages/about.blade.php

edit content:
@extends('layouts.app')

@section('content')
<h1>About</h1>
<p>This is the about page</p>
@endsection


edit file: lsapp/resources/views/pages/services.blade.php

edit content:
@extends('layouts.app')

@section('content')
<h1>Services</h1>
<p>This is the services page</p>
@endsection


browse: /index
browse: /about
browse: /services



3) ADD PAGE DATA TO PAGE CONTROLLER USING COMPACT

edit file: lsapp/resources/views/pages/index.blade.php

edit content:
@extends('layouts.app')

@section('content')
<h1>{{$title}}</h1>
<p>This is the Laravel application from the "Laravel From Scratch" Youtube series</p>
@endsection


edit file: lsapp/resources/views/pages/about.blade.php

edit content:
@extends('layouts.app')

@section('content')
<h1>{{$title}}</h1>
<p>This is the about page</p>
@endsection


edit file: lsapp/app/Http/Controllers/PagesController.php

file content:
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class PagesController extends Controller
{
public function index(){
$title = 'Welcome To Laravel';
return view('pages.index',compact('title'));
}
public function about(){
return view('pages.about');
}
public function services(){
return view('pages.services');
}
}



4) ADD PAGE DATA TO PAGE CONTROLLER USING WITH

edit file: lsapp/app/Http/Controllers/PagesController.php

file content:
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class PagesController extends Controller
{
public function index(){
$title = 'Welcome To Laravel';
return view('pages.index')->with('title',$title);
}
public function about(){
$title = 'About Us';
return view('pages.about')->with('title',$title);
}
public function services(){
return view('pages.services');
}
}



note:
-compact() is a PHP Function.
-compact() creates an array from existing variables given as string arguments to it.
-with() is a Laravel method.
-with() allows you to pass variables to a view.



5) ADD PAGE ARRAY DATA TO PAGE CONTROLLER USING WITH

edit file: lsapp/resources/views/pages/services.blade.php

edit content:
@extends('layouts.app')

@section('content')
<h1>{{$title}}</h1>
<p>This is the services page</p>
@endsection



edit file: lsapp/app/Http/Controllers/PagesController.php

file content:
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class PagesController extends Controller
{
public function index(){
$title = 'Welcome To Laravel';
return view('pages.index')->with('title',$title);
}
public function about(){
$title = 'About Us';
return view('pages.about')->with('title',$title);
}
public function services(){
$data=array(
'title'=>'Our Services'
);
return view('pages.services')->with($data);
}
}





6) ADD PAGE NESTED ARRAY DATA TO PAGE CONTROLLER USING WITH

edit file: lsapp/resources/views/pages/services.blade.php

edit content:
@extends('layouts.app')

@section('content')
<h1>{{$title}}</h1>
@if(count($services)>0)
@foreach($services as $service)
<ul>
<li>{{$service}}</li>
</ul>
@endforeach
@endif
@endsection



edit file: lsapp/app/Http/Controllers/PagesController.php

file content:
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class PagesController extends Controller
{
public function index(){
$title = 'Welcome To Laravel';
return view('pages.index')->with('title',$title);
}
public function about(){
$title = 'About Us';
return view('pages.about')->with('title',$title);
}
public function services(){
$data=array(
'title'=>'Our Services',
'services'=>['Web Design','Programming','SEO']
);
return view('pages.services')->with($data);
}
}




7) ADD STYLING TO VIEW LAYOUT

to add link to css file
create file: lsapp/resources/views/layouts/app.blade.php

edit content:
<!doctype html>
<html lang="{{config('app.locale')}}">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"
<meta name="viewport" content="device-width,initial-scale=1">
<link rel="stylesheet" href="{{asset('css/app.css')}}">
<title>{{config('app.name','LSAPP')}}</title>
</heade>
<body>
@yield('content')
</body>
</html>



8) USING NODE TO COMPILE STYLING CODES
time:10.25


.

.

2 comments:

  1. The associative array
    $data = array(
    'services'=> ['web design', 'programming', 'SEO']
    )
    Didn't work for me on Laravel 5.8
    But 'title'=> 'service'
    Worked..

    I parsed it same way as you did

    return view('pages.services')->with($data);

    ReplyDelete

Labels