【Laravel】MVC 모델의 View에 대해 이해한다
7206 단어 라라벨
환경
PHP 7.3.24
라라벨 6.20.30
MAMP
view(뷰)란?
여기서 말하는 view란 Laravel의 MVC 모델의 V에 해당하는 것입니다.
HTTP 요청에 대한 응답을 화면에 표시하는 것을 말합니다.
요점은 화면의 표시 부분을 만드는 것이 됩니다. Laravel에서는 view를 blade 파일이라고 불리는 HTML과 같은 형식으로 기술해 갑니다.
Blade 파일의 특징
· resources/views 디렉토리에 블레이드 파일 만들기
· 확장자는 .blade.php・블레이드 파일의 기술의 베이스는 HTML
· 블레이드 파일에 PHP가 직접 작성할 수 있습니다.
· 지시어라는 기능이 있습니다.
【보충】디렉티브란?
지시어는 프로그램 중에 컴파일러에 지시를 전달하는 등의 문장을 말합니다.
directive의 일본어 번역은 「지령, 명령」이라고 하는 의미가 있습니다.
지시어 ... 컴파일시 컴파일러에 제공되는 보충 정보.
대부분은 프로그램의 첫 번째 줄에 설명합니다.
이 파일은
· UTF-8입니다.
· HTML 파일입니다.
· * * 클래스를 가져 오십시오.
인용 소스 : 지시어란?
view 상속
view에서는 부모 뷰와 아이 뷰를 작성해 공통하고 있는 코드는 1 개의 파일에 정리해 기술합니다.
공통된 코드는 부모 뷰에 기술해, 그 이외의 고유의 코드를 아이 뷰에 기술해 갑니다.
@ extends
아이 뷰의 파일중에서 어느 부모 뷰 파일을 상속할까를 선언하는 지시어입니다.
@section,@endsection
하위 뷰 고유의 (비공통) 코드를 @section에서 @endsection으로 둘러싸고 하위 뷰의 고유 코드를 정의하는 지시문입니다.
@yield
부모 뷰 파일의 어느 부분에 아이 뷰의 고유 코드를 읽어들일지를 지정하는 지시어입니다.
view를 사용해보기
1. 라우팅 뷰 만들기
우선은 루트 URL(톱 페이지)에 액세스했을 경우, 어느 Blade 파일을 보도록 할까를 지정합니다.routes/web.php 안에 기술해 갑니다.
web.phpRoute::get('/', function () {
return view('top');
});
이번에는 톱 페이지에서 top.blade.php에 액세스하도록 설정했습니다.
2. 상위 뷰(공통 코드) 만들기
상위 뷰의 파일명은 common.blade.php로 하고, 파일의 내용은 헤더와 꼬리말의 기술이 있는 파일로 합니다.
common.blade.php<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>サンプル</title>
</head>
<!-- ヘッダー -->
<header>
<p>THIS IS HRADER!</p>
</header>
<!-- メイン -->
<body>
<!-- 子ビュー固有のコードを読み込む -->
@yield('child')
</body>
<!-- フッター -->
<footer>
<p>THIS IS FOOTER!</p>
</footer>
</html>
<!-- CSS -->
<style>
* {
margin: 0;
padding: 0;
text-align: center;
line-height: 50px;
font-size: 20px;
}
header,
footer {
color: #000;
width: 100%;
font-weight: bold;
}
header {
background-color: rgb(255, 250, 156);
}
footer {
background-color: rgb(161, 178, 253);
position: absolute;
bottom: 0;
}
</style>
하위 뷰 만들기
top.blade.php 를 아이 뷰의 파일 한편 톱 페이지로서 작성해 갑니다.
top.blade.php<!-- 親ビューを継承 -->
@extends('common')
<!-- 子ビュー固有のコード -->
@section('child')
<p>bodyは子ビューで作りました！</p>
@endsection
화면 표시
상위 뷰에서 만든 머리글과 바닥글, 자식 뷰에서 만든 body 부분이 제대로 표시되는 것을 확인할 수 있었습니다!
참고
지시어란?
【Laravel 입문】뷰와 Blade와 상속
Laravel의 컴포넌트 클래스/Blade 컴포넌트 태그를 사용하여 뷰 작성
Reference
이 문제에 관하여(【Laravel】MVC 모델의 View에 대해 이해한다), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/MiyakeNatsuho/items/b86c05e680220ac0ee40
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
여기서 말하는 view란 Laravel의 MVC 모델의 V에 해당하는 것입니다.
HTTP 요청에 대한 응답을 화면에 표시하는 것을 말합니다.
요점은 화면의 표시 부분을 만드는 것이 됩니다. Laravel에서는 view를 blade 파일이라고 불리는 HTML과 같은 형식으로 기술해 갑니다.
Blade 파일의 특징
· resources/views 디렉토리에 블레이드 파일 만들기
· 확장자는 .blade.php・블레이드 파일의 기술의 베이스는 HTML
· 블레이드 파일에 PHP가 직접 작성할 수 있습니다.
· 지시어라는 기능이 있습니다.
【보충】디렉티브란?
지시어는 프로그램 중에 컴파일러에 지시를 전달하는 등의 문장을 말합니다.
directive의 일본어 번역은 「지령, 명령」이라고 하는 의미가 있습니다.
지시어 ... 컴파일시 컴파일러에 제공되는 보충 정보.
대부분은 프로그램의 첫 번째 줄에 설명합니다.
이 파일은
· UTF-8입니다.
· HTML 파일입니다.
· * * 클래스를 가져 오십시오.
인용 소스 : 지시어란?
view 상속
view에서는 부모 뷰와 아이 뷰를 작성해 공통하고 있는 코드는 1 개의 파일에 정리해 기술합니다.
공통된 코드는 부모 뷰에 기술해, 그 이외의 고유의 코드를 아이 뷰에 기술해 갑니다.
@ extends
아이 뷰의 파일중에서 어느 부모 뷰 파일을 상속할까를 선언하는 지시어입니다.
@section,@endsection
하위 뷰 고유의 (비공통) 코드를 @section에서 @endsection으로 둘러싸고 하위 뷰의 고유 코드를 정의하는 지시문입니다.
@yield
부모 뷰 파일의 어느 부분에 아이 뷰의 고유 코드를 읽어들일지를 지정하는 지시어입니다.
view를 사용해보기
1. 라우팅 뷰 만들기
우선은 루트 URL(톱 페이지)에 액세스했을 경우, 어느 Blade 파일을 보도록 할까를 지정합니다.routes/web.php 안에 기술해 갑니다.
web.phpRoute::get('/', function () {
return view('top');
});
이번에는 톱 페이지에서 top.blade.php에 액세스하도록 설정했습니다.
2. 상위 뷰(공통 코드) 만들기
상위 뷰의 파일명은 common.blade.php로 하고, 파일의 내용은 헤더와 꼬리말의 기술이 있는 파일로 합니다.
common.blade.php<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>サンプル</title>
</head>
<!-- ヘッダー -->
<header>
<p>THIS IS HRADER!</p>
</header>
<!-- メイン -->
<body>
<!-- 子ビュー固有のコードを読み込む -->
@yield('child')
</body>
<!-- フッター -->
<footer>
<p>THIS IS FOOTER!</p>
</footer>
</html>
<!-- CSS -->
<style>
* {
margin: 0;
padding: 0;
text-align: center;
line-height: 50px;
font-size: 20px;
}
header,
footer {
color: #000;
width: 100%;
font-weight: bold;
}
header {
background-color: rgb(255, 250, 156);
}
footer {
background-color: rgb(161, 178, 253);
position: absolute;
bottom: 0;
}
</style>
하위 뷰 만들기
top.blade.php 를 아이 뷰의 파일 한편 톱 페이지로서 작성해 갑니다.
top.blade.php<!-- 親ビューを継承 -->
@extends('common')
<!-- 子ビュー固有のコード -->
@section('child')
<p>bodyは子ビューで作りました！</p>
@endsection
화면 표시
상위 뷰에서 만든 머리글과 바닥글, 자식 뷰에서 만든 body 부분이 제대로 표시되는 것을 확인할 수 있었습니다!
참고
지시어란?
【Laravel 입문】뷰와 Blade와 상속
Laravel의 컴포넌트 클래스/Blade 컴포넌트 태그를 사용하여 뷰 작성
Reference
이 문제에 관하여(【Laravel】MVC 모델의 View에 대해 이해한다), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/MiyakeNatsuho/items/b86c05e680220ac0ee40
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
view에서는 부모 뷰와 아이 뷰를 작성해 공통하고 있는 코드는 1 개의 파일에 정리해 기술합니다.
공통된 코드는 부모 뷰에 기술해, 그 이외의 고유의 코드를 아이 뷰에 기술해 갑니다.
@ extends
아이 뷰의 파일중에서 어느 부모 뷰 파일을 상속할까를 선언하는 지시어입니다.
@section,@endsection
하위 뷰 고유의 (비공통) 코드를 @section에서 @endsection으로 둘러싸고 하위 뷰의 고유 코드를 정의하는 지시문입니다.
@yield
부모 뷰 파일의 어느 부분에 아이 뷰의 고유 코드를 읽어들일지를 지정하는 지시어입니다.
view를 사용해보기
1. 라우팅 뷰 만들기
우선은 루트 URL(톱 페이지)에 액세스했을 경우, 어느 Blade 파일을 보도록 할까를 지정합니다.routes/web.php 안에 기술해 갑니다.
web.phpRoute::get('/', function () {
return view('top');
});
이번에는 톱 페이지에서 top.blade.php에 액세스하도록 설정했습니다.
2. 상위 뷰(공통 코드) 만들기
상위 뷰의 파일명은 common.blade.php로 하고, 파일의 내용은 헤더와 꼬리말의 기술이 있는 파일로 합니다.
common.blade.php<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>サンプル</title>
</head>
<!-- ヘッダー -->
<header>
<p>THIS IS HRADER!</p>
</header>
<!-- メイン -->
<body>
<!-- 子ビュー固有のコードを読み込む -->
@yield('child')
</body>
<!-- フッター -->
<footer>
<p>THIS IS FOOTER!</p>
</footer>
</html>
<!-- CSS -->
<style>
* {
margin: 0;
padding: 0;
text-align: center;
line-height: 50px;
font-size: 20px;
}
header,
footer {
color: #000;
width: 100%;
font-weight: bold;
}
header {
background-color: rgb(255, 250, 156);
}
footer {
background-color: rgb(161, 178, 253);
position: absolute;
bottom: 0;
}
</style>
하위 뷰 만들기
top.blade.php 를 아이 뷰의 파일 한편 톱 페이지로서 작성해 갑니다.
top.blade.php<!-- 親ビューを継承 -->
@extends('common')
<!-- 子ビュー固有のコード -->
@section('child')
<p>bodyは子ビューで作りました！</p>
@endsection
화면 표시
상위 뷰에서 만든 머리글과 바닥글, 자식 뷰에서 만든 body 부분이 제대로 표시되는 것을 확인할 수 있었습니다!
참고
지시어란?
【Laravel 입문】뷰와 Blade와 상속
Laravel의 컴포넌트 클래스/Blade 컴포넌트 태그를 사용하여 뷰 작성
Reference
이 문제에 관하여(【Laravel】MVC 모델의 View에 대해 이해한다), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/MiyakeNatsuho/items/b86c05e680220ac0ee40
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
Route::get('/', function () {
return view('top');
});
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>サンプル</title>
</head>
<!-- ヘッダー -->
<header>
<p>THIS IS HRADER!</p>
</header>
<!-- メイン -->
<body>
<!-- 子ビュー固有のコードを読み込む -->
@yield('child')
</body>
<!-- フッター -->
<footer>
<p>THIS IS FOOTER!</p>
</footer>
</html>
<!-- CSS -->
<style>
* {
margin: 0;
padding: 0;
text-align: center;
line-height: 50px;
font-size: 20px;
}
header,
footer {
color: #000;
width: 100%;
font-weight: bold;
}
header {
background-color: rgb(255, 250, 156);
}
footer {
background-color: rgb(161, 178, 253);
position: absolute;
bottom: 0;
}
</style>
<!-- 親ビューを継承 -->
@extends('common')
<!-- 子ビュー固有のコード -->
@section('child')
<p>bodyは子ビューで作りました！</p>
@endsection
지시어란?
【Laravel 입문】뷰와 Blade와 상속
Laravel의 컴포넌트 클래스/Blade 컴포넌트 태그를 사용하여 뷰 작성
Reference
이 문제에 관하여(【Laravel】MVC 모델의 View에 대해 이해한다), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/MiyakeNatsuho/items/b86c05e680220ac0ee40텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
