그냥 사는 이야기

Laravel 5.3 Blog System - Admin Dashboard 본문

Development/Web

Laravel 5.3 Blog System - Admin Dashboard

없다캐라 2020. 1. 23. 09:30
반응형

Bootstrap 적용

Dashboard template 의 소스를 구해서 적용해본다.

View 추가

resources/views/layouts/dashboard.blade.php
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
        <meta name="description" content="">
        <meta name="author" content="">
        <link rel="icon" href="../../favicon.ico">

        <title>Admin Dashboard</title>

        <!-- Bootstrap core CSS -->
        <link href="/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">

        <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
        <link href="../../assets/css/ie10-viewport-bug-workaround.css" rel="stylesheet">

        <!-- Custom styles for this template -->
        <link href="/css/dashboard.css" rel="stylesheet">

        <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
        <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
        <script src="../../assets/js/ie-emulation-modes-warning.js"></script>

        <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
        <!--[if lt IE 9]>
            <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
            <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
        <![endif]-->
    </head>

    <body>
        <nav class="navbar navbar-default">
            <div class="container-fluid">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="/admin/index">
                        <img alt="Brand" src="{{ '/img/brand.jpg' }}" width="60%">
                    </a>
                </div>
                <div id="navbar" class="navbar-collapse collapse">
                    <ul class="nav navbar-nav navbar-right">
                        @if (Auth::guest())
                            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
                                    Members<span class="caret"></span>
                                </a>
                                <ul class="dropdown-menu" role="menu">
                                    <li><a href="{{ url('/login') }}">Login</a></li>
                                    <li><a href="{{ url('/register') }}">Register</a></li>
                                </ul>
                            </li>
                        @else
                            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
                                    {{ Auth::user()->name }} <span class="caret"></span>
                                </a>
                                <ul class="dropdown-menu" role="menu">
                                    <li>
                                        <a href="{{ url('/logout') }}" onclick="event.preventDefault(); document.getElementById('logout-form').submit();">
                                            Logout
                                        </a>
                                        <form id="logout-form" action="{{ url('/logout') }}" method="POST" style="display: none;">
                                            {{ csrf_field() }}
                                        </form>
                                    </li>
                                </ul>
                            </li>
                        @endif
                    </ul>
                </div>
            </div>
        </nav>

        <div class="container-fluid">
            <div class="row">
                <div class="col-sm-3 col-md-2 sidebar">
                    <ul class="nav nav-sidebar">
                        <li class="active"><a href="/admin/">Overview <span class="sr-only">(current)</span></a></li>
                        <li><a href="/admin/posts/allposts">All Posts</a></li>
                        <li><a href="/admin/posts/alldrafts">Drafts</a></li>
                        <li><a href="/admin/posts/allcomments">Comments</a></li>
                        <li><a href="#">Label</a></li>
                        <li><a href="#">User</a></li>
                        <li><a href="#">Profile</a></li>
                    </ul>
                </div>
                <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
                    @yield('content')
                </div>
            </div>
        </div>

        <!-- Bootstrap core JavaScript
        ================================================== -->
        <!-- Placed at the end of the document so the pages load faster -->
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
        <script>window.jQuery || document.write('<script src="vendor/jquery/jquery.min.js"><\/script>')</script>
        <script src="/vendor/bootstrap/js/bootstrap.min.js"></script>
        <!-- Just to make our placeholder images work. Don't actually copy the next line! -->
        <script src="../../assets/js/vendor/holder.min.js"></script>
        <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
        <script src="../../assets/js/ie10-viewport-bug-workaround.js"></script>
    </body>
</html>
resources/views/admin/index.blade.php
@extends('layouts.dashboard')

@section('content')
<div class="col-sm-9 main">
    <h2 class="sub-header">Dashbord</h2>
    <div class="table-responsive">
        <p>
            wellcome admin, you can add, update, delete any posts, comments, drafts, etc ..
        </p>
        <p>
            <a href="http://www.hc-kr.com/">www.hc-kr.com</a>
        </p>
    </div>
</div>
@endsection
App/Http/Controllers/Auth/LoginController.php
protected $redirectTo = '/admin/index';
App/Http/Controllers/PostController.php
public function indexDashboard()
{
    return view('admin/index');
}
routes/web.php
Route::group(['middleware' => ['auth']], function() {
    Route::post('comment/add',  'CommentController@store');
    Route::get('admin/index',   'PostController@indexDashboard');   // 추가
});
저작자표시

'Development > Web' 카테고리의 다른 글

Laravel 5.3 Blog System - Admin Dashboard - Create, Store  (0) 2020.01.23
Laravel 5.3 Blog System - Admin Dashboard - All Posts  (0) 2020.01.23
Laravel 5.3 Blog System - Bootstrap theme view  (0) 2020.01.22
Laravel 5.3 Blog System - Post And Comments  (2) 2020.01.22
Laravel 5.3 Blog System - Setup Database  (0) 2020.01.22
'Development/Web' Related Articles more
Comments