フロントにおけるLaravel Laravel.hiroshima

by Haruki Tazoe

Slide 1

Slide 1 text

ϑϩϯτʹ͓͚ΔLaravel 2019/11/24 Laravel.hiroshima vol.2

Slide 2

Slide 2 text

Laravel.hiroshima ޿ౡͰLaravelΛ΋ͬͱ੝Γ্͍͛ͨͱ͍͏ؾ࣋ ͔ͪΒൃ଍ͨ͠ษڧձίϛϡχςΟͰ͢ɻ • ಺༰͸࠲ஊձɺ΋͘΋͘ձɺLTձͳͲ… • ࠓճͰ2ճ໨

Slide 3

Slide 3 text

Laravel.hiroshima ͜ͷษڧձ͸ϘϥϯςΟΞϕʔεͰߦ͓ͬͯΓɺ ஌ࣝͷγΣΞɾॿ͚߹͍Ͱ੒Γཱ͍ͬͯ·͢ɻ ࢀՃͷࡍ͸͝ཧղɾ͝ڠྗΛ͓ئ͍͍ͨ͠· ͢ɻ

Slide 4

Slide 4 text

Laravelͱ͸

Slide 5

Slide 5 text

2011೥6݄ʹϦϦʔε͞ΕͨɺΦʔϓϯιʔεͷ PHPϑϨʔϜϫʔΫɻ ιʔείʔυ͸GithubʹϗεςΟϯά͞Ε͍ͯ ͯɺGithubͰͷελʔ֫ಘ਺͕PHPϑϨʔϜ ϫʔΫͷதͰ΋࠷΋ଟ͍ɻ

Slide 6

Slide 6 text

ϑϩϯτʹ͓͚ΔLaravel

Slide 7

Slide 7 text

1.BladeςϯϓϨʔτ

Slide 8

Slide 8 text

BladeςϯϓϨʔτͱ͸ Blade͸γϯϓϧͳ͕ΒύϫϑϧͳLaravelͷς ϯϓϨʔτΤϯδϯͰ͢ɻଞͷਓؾͷ͋ΔPHP ςϯϓϨʔτͱ͸ҟͳΓɺϏϡʔͷதʹPHPΛ ௚઀هड़͢Δ͜ͱΛڐ͍ͯ͠·͢ɻ

Slide 9

Slide 9 text

BladeςϯϓϨʔτͱ͸ BladeϏϡʔʹ͸.blade.phpϑΝΠϧ֦ுࢠΛ ͚ͭɺ௨ৗ͸resources/viewsσΟϨΫτϦͷத ʹઃஔ͠·͢ɻ

Slide 10

Slide 10 text

ͳʹ͕ศརͳͷʁ

Slide 11

Slide 11 text

2.ςϯϓϨʔτͷܧঝ

Slide 12

Slide 12 text

2-1.ϨΠΞ΢τఆٛ

Slide 13

Slide 13 text

αϯϓϧίʔυ αϯϓϧΞϓϦ - @yield(‘title’) @section(‘sidebar’) ͕͜͜ϝΠϯͷαΠυόʔ @show

@yield(‘content’)

Slide 14

Slide 14 text

@section͸໊લ͕ࣔ͢ͱ͓Γʹίϯςϯπͷη ΫγϣϯΛఆٛ͠ɺҰํͷ@yield͸ࢦఆͨ͠η Ϋγϣϯͷ಺༰Λදࣔ͢ΔͨΊʹ࢖༻͠·͢ɻ

Slide 15

Slide 15 text

2-2.ϨΠΞ΢τ֦ு

Slide 16

Slide 16 text

ࢠͷϏϡʔΛఆٛ͢Δʹ͸ɺʮܧঝʯ͢ΔϨΠ Ξ΢τΛࢦఆ͢ΔɺBlade@extendsΛ࢖༻͠· ͢ɻBladeϨΠΞ΢τΛ֦ு͢ΔϏϡʔ͸ɺ @sectionΛ࢖༻͠ɺϨΠΞ΢τͷηΫγϣϯʹ ಺༰Λૠೖ͠·͢ɻ·ͨɺϨΠΞ΢τͰηΫ γϣϯΛදࣔ͢Δʹ͸@yieldΛ࢖༻͠·͢ɻ

Slide 17

Slide 17 text

αϯϓϧίʔυ @extends('layouts.app') @section('title', 'Page Title') @section('sidebar') @@parent

͜͜͸ϝΠϯͷαΠυόʔʹ௥Ճ͞ΕΔ

@endsection @section('content')

͕͜͜ຊจͷίϯςϯπ

@endsection

Slide 18

Slide 18 text

sidebarηΫγϣϯͰ͸ɺϨΠΞ΢τͷαΠυ όʔͷ಺༰Λίϯςϯπʹ্ॻ͖͢ΔͷͰ͸ͳ ͘௥Ճ͢ΔͨΊʹ@@parentΛ࢖༻͍ͯ͠·͢ɻ @@parent͸ϏϡʔΛϨϯμ͢Δͱ͖ʹɺϨΠ Ξ΢τͷ಺༰ʹஔ͖׵ΘΓ·͢ɻ

Slide 19

Slide 19 text

3.σʔλදࣔ

Slide 20

Slide 20 text

αϯϓϧίʔυ Route::get('greeting', function () { return view('welcome', ['name' => 'Samantha']); }); Hello, {{ $name }}. BladeςϯϓϨʔτʹ౉͢ʹ͸…

Slide 21

Slide 21 text

Bladeͷ{{ }}ه๏͸XSS߈ܸΛ๷͙ͨΊɺࣗಈత ʹPHPͷhtmlspecialcharsؔ਺Λ௨͞Ε·͢ɻ Ϗϡʔʹ౉͞Εͨม਺ͷ಺༰Λදࣔ͢Δ͚ͩʹ ݶΒͣɺPHPؔ਺ͷ݁ՌΛecho͢Δ͜ͱ΋Ͱ͖ ·͢ɻ The current UNIX timestamp is {{ time() }} .

Slide 22

Slide 22 text

σʔλΛΤεέʔϓͨ͘͠ͳ͍৔߹͸ɺҎԼͷ ߏจΛ࢖༻͍ͯͩ͘͠͞ɻ Hello, {!! $name !!}.

Slide 23

Slide 23 text

4.੍ޚߏจ

Slide 24

Slide 24 text

4-1.Ifจ

Slide 25

Slide 25 text

αϯϓϧίʔυ @if (count($records) === 1) ̍Ϩίʔυ͋Δʂ @elseif (count($records) > 1) ෳ਺Ϩίʔυ͋Δʂ @else Ϩίʔυ͕ͳ͍ʂ @endif

Slide 26

Slide 26 text

ifจͷߏจʹ͸ɺ@ifɺ@elseifɺ@elseɺ@endif Λ࢖༻͠·͢ɻ͜ΕΒͷ࢖͍ํ͸PHPͷߏจͱ ಉ͡Ͱ͢ɻ

Slide 27

Slide 27 text

@issetͱ@empty΋ɺಉ໊ͷPHPؔ਺ͷศརͳ γϣʔτΧοτͱͯ͠࢖༻Ͱ͖·͢ɻ @isset($records) // $records͸ఆٛࡁΈͰnullͰͳ͍ @endisset @empty($records) // $records͕ʮۭʯͩ @endempty

Slide 28

Slide 28 text

4-2.Switchจ

Slide 29

Slide 29 text

αϯϓϧίʔυ @switch($i) @case(1) ࠷ॳͷέʔε @break @case(2) ̎൪Ίͷέʔε @break @default σϑΥϧτͷέʔε @endswitch

Slide 30

Slide 30 text

@switchɺ@caseɺ@breakɺ@defaultɺ @endswitchΛ࢖༻͠ɺSwitchจΛߏ੒Ͱ͖· ͢ɻ

Slide 31

Slide 31 text

4-3.܁Γฦ͠

Slide 32

Slide 32 text

αϯϓϧίʔυ @for ($i = 0; $i < 10; $i++) ݱࡏͷ஋͸ɿ {{ $i }} @endfor @foreach ($users as $user)

͜Ε͸ {{ $user->id }} ϢʔβʔͰ͢ɻ

@endforeach @forelse ($users as $user)

@empty

Ϣʔβʔͳ͠

@endforelse @while (true)

ແݶϧʔϓத

@endwhile

Slide 33

Slide 33 text

5.ϑΥʔϜ

Slide 34

Slide 34 text

5-1.CSRFϑΟʔϧυ

Slide 35

Slide 35 text

ΞϓϦέʔγϣϯͰHTMLϑΥʔϜΛఆٛ͢Δ ৔߹ɺCSRFอޢϛυϧ΢ΣΞ͕ϦΫΤετΛݕ ࠪͰ͖ΔΑ͏ʹ͢ΔͨΊɺӅ͠CSRFτʔΫϯ ϑΟʔϧυΛؚΊΔඞཁ͕͋Γ·͢ɻ͜ΕΛ @csrfΛ࢖༻ͯ͠ߦ͍·͢ɻ @csrf ...

Slide 36

Slide 36 text

5-2.MethodϑΟʔϧυ

Slide 37

Slide 37 text

HTMLϑΥʔϜͰ͸ɺPUTɺPATCHɺDELETEϦ ΫΤετΛ࡞੒Ͱ͖ͳ͍ͨΊɺݟ্͔͚ͷHTTP ಈࢺΛࢦఆ͢ΔͨΊͷ_methodϑΟʔϧυΛ௥ Ճ͢Δඞཁ͕͋Γ·͢ɻ@methodͰ͜ͷϑΟʔ ϧυΛੜ੒Ͱ͖·͢ɻ @method('PUT') ...

Slide 38

Slide 38 text

5-3.όϦσʔγϣϯΤϥʔ

Slide 39

Slide 39 text

@error͸ɺࢦఆͨ͠ଐੑͷόϦσʔγϣϯΤ ϥʔϝοηʔδ͕͋Δ͔Λ؆୯ʹ൑ఆ͢ΔͨΊ ʹ࢖༻͠·͢ɻ@errorͷதͰΤϥʔϝοηʔδ Λදࣔ͢ΔͨΊʹɺ$messageม਺ΛΤίʔ͢ Δ͜ͱ΋ՄೳͰ͢ɻ

Slide 40

Slide 40 text

αϯϓϧίʔυ Post Title @error('title')

@enderror

Slide 41

Slide 41 text

6.αϒϏϡʔͷಡΈࠐΈ

Slide 42

Slide 42 text

Bladeͷ@includeΛ࢖͑͹ɺϏϡʔͷத͔Β؆ ୯ʹଞͷBladeϏϡʔΛऔΓࠐΊ·͢ɻಡΈࠐΈ ݩͷϏϡʔͰඞཁͳม਺͸ɺऔΓࠐΈઌͷ ϏϡʔͰ΋ར༻ՄೳͰ͢ɻ