موقع تواصل إجتماعي بإستعمال laravel الجزء الخامس

فهاد الجزء الخامس من موقع تواصل إجتماعي بإستعمال laravel غادي نكملو الملفات لي بقاونا ولي غادي يمكنو باش تكون عندنا القائمة بالإضافة لملفات css وعرض الرسائل ديال الخطأ والنجاح.

نظرة سريعة بالفيديو


1- الملف main-index.blade.php


ف view/layouts زيد مجلد جديد سميه includes فيه زيد ملف جديد سميه main-index.blade.php هادا هو الملف لي غادي يربط الصفحات ديالنا بملفات css و js وغادي تكون فيه قائمة التصفح وملف عرض الرسائل الكود ديال الملف هو :

                                    
                                        <!DOCTYPE html>
<html lang="fr">
<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">
    <link href="{{URL::to('css/bootstrap.css')}}" rel="stylesheet">
    <link href="{{URL::to('css/main.css')}}" rel="stylesheet">
    <title>Chat+</title>
</head>
<body>
    @include('layouts.includes.navbar')
    <div class="container">    
       @include('layouts.includes.alerts')
       @yield('content')
    </div>
<script src="{{URL::to('js/jquery.js')}}"></script>
<script src="{{URL::to('js/bootstrap.js')}}"></script>
<script src="{{URL::to('js/like.js')}}"></script>
@yield('script')
</body>
</html>
                                    
                                

2- الملف navbar.blade.php


دائما فالمجلد includes فيه زيد ملف جديد سميه navbar.blade.php هادا هو الملف لي غادي تكون فيه قائمة التصفح ديالنا الكود ديال الملف هو :

                                    
                                        <nav class="navbar navbar-default">
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <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="#">Chat+</a>
    </div>
    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li class="active"><a href="{{route('home')}}">Accueil <span class="sr-only">(current)</span></a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Compte <span class="caret"></span></a>
          <ul class="dropdown-menu">
            @if(!Auth::check())
            <li><a href="{{route('users.register')}}">Inscription</a></li>
            <li><a href="{{route('users.login')}}">Connexion</a></li>
            @else
            <li><a href="#">{{Auth::user()->pseudo}}</a></li>
            <li><a href="{{route('users.profile',Auth::user()->pseudo)}}">Profile</a></li>
            <li><a href="{{route('users.update')}}">Modifier mon profile</a></li>
            <li><a href="{{route('users.logout')}}">Déconnexion</a></li>
            @endif
          </ul>
        </li>
      </ul>
      @if(Auth::check())
      <ul class="nav navbar-nav">
        <li><a href="{{route('home')}}">Timeline</a></li>
        <li><a href="{{route('users.friends')}}">Amis</a></li>
      </ul>
      <form class="navbar-form navbar-left" method="post" action="{{route('users.search')}}">
        <div class="form-group">
          <input type="text" class="form-control" name="user" placeholder="Recherche">
        </div>
        <input type="hidden" name="_token" value="{{Session::token()}}"/>
        <button type="submit" class="btn btn-default">Recherche</button>
      </form>
      @endif
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav>
                                    
                                

3- الملف alerts.blade.php


دائما فالمجلد includes فيه زيد ملف جديد سميه alerts.blade.php هادا هو الملف لي غادي يعرض رسائل النجاح والفشل ملي يتسجل شي مستخدم أو يبغي يتكونيكطا وغيرها من العمليات الكود ديال الملف هو :

                                      
                                        @if(Session::has('info'))
    <div class="alert alert-info">{{Session::get('info')}}</div>
@endif
@if(Session::has('fail'))
    <div class="alert alert-danger">{{Session::get('fail')}}</div>
@endif
@if(Session::has('success'))
    <div class="alert alert-success">{{Session::get('success')}}</div>
@endif
                                      
                                    

4- الملف main.css


دائما فالمجلد public/css فيه زيد ملف جديد سميه main.css هادا ملف عبارة عن des styles لي غادي نحتاجو الكود ديال الملف هو :

                                        
                                            form{
    padding:20px;
}
.bordered{
    border:1px solid red;
}
.inline-list li{
    list-style: none;
    display: inline-block;
}
.media{
    padding:10px;
}
.panel{
    border :1px solid #17a;
}
hr{
     color: #17a;
}
                                        
                                    

5- الملف routes.php


فالمجلد app/Http وفالملف routes.php هادا ملف ديال les routes ديالنا ولي فيهم محددين les urls ديال كل صفحة عندنا ويلا بغيتي تستافد أكثر وتزيد توسع القاعدة ديال المعلومات ديالك يمكنلك تشوف documentation ديال laravel فالموقع الرسمي ديالهم www.laravel.com راه كلنا بدينا من الزيرو ومازال كنتعلموا وكلشي توصلو خص غير تكون باغي توصل الكود ديال الملف هو :

                                        
                                            <?php

/*
|--------------------------------------------------------------------------
| Application Routes
|--------------------------------------------------------------------------
|
| Here is where you can register all of the routes for an application.
| It's a breeze. Simply tell Laravel the URIs it should respond to
| and give it the controller to call when that URI is requested.
|
*/

Route::get('/',[
    'uses' => 'HomeController@index',
    'as' => 'home'
]);
/**
*inscription
*/
Route::get('/register',[
    'uses' => 'UsersController@create',
    'as' => 'users.register',
    'middleware'=>['guest']
]);
Route::post('/register',[
    'uses' => 'UsersController@store',
    'as' => 'users.register',
    'middleware'=>['guest']
]);
Route::get('/login',[
    'uses' => 'UsersController@getlogin',
    'as' => 'users.login',
    'middleware'=>['guest']
]);
Route::get('/logout',[
    'uses' => 'UsersController@logout',
    'as' => 'users.logout'
]);
Route::post('/login',[
    'uses' => 'UsersController@login',
    'as' => 'users.login',
    'middleware'=>['guest']
]);
Route::post('/search',[
    'uses' => 'SearchController@getUser',
    'as' => 'users.search'
]);
Route::get('/{username}/profile',[
    'uses' => 'ProfileController@getProfile',
    'as' => 'users.profile',
    'middleware'=>['auth']
]);
Route::get('/profile/edit',[
    'uses' => 'ProfileController@getEdit',
    'as' => 'users.update',
    'middleware'=>['auth']
]);
Route::post('/profile/edit',[
    'uses' => 'ProfileController@postEdit',
    'as' => 'users.update',
    'middleware'=>['auth']
]);
Route::get('/friends',[
    'uses' => 'FriendsController@index',
    'as' => 'users.friends',
    'middleware'=>['auth']
]);
Route::get('/{username}/add',[
    'uses' => 'FriendsController@addFriend',
    'as' => 'users.friend.add',
    'middleware'=>['auth']
]);
Route::get('/{username}/remove',[
    'uses' => 'FriendsController@removeFriend',
    'as' => 'users.friend.remove',
    'middleware'=>['auth']
]);
Route::get('/{username}/accept',[
    'uses' => 'FriendsController@acceptRequest',
    'as' => 'users.friend.accept',
    'middleware'=>['auth']
]);
Route::post('/post',[
    'uses' => 'PublicationsController@postPublication',
    'as' => 'post.add',
    'middleware'=>['auth']
]);
Route::post('/post/{postId}/reply',[
    'uses' => 'PublicationsController@postReply',
    'as' => 'post.reply',
    'middleware'=>['auth']
]);
Route::get('/post/{id}/like',[
    'uses' => 'PublicationsController@addLike',
    'as' => 'post.like',
    'middleware'=>['auth']
]);
                                        
                                    

كلمات مفاتيح :