Tutoriel pour apprendre à créer une application Laravel Les articles (front-end

Tutoriel pour apprendre à créer une application Laravel Les articles (front-end) Par Maurice Chavelli Date de publication : 28 novembre 2017 Dernière mise à jour : 28 novembre 2017 Les éléments essentiels d'un blog sont assurément les articles. Nous allons donc voir cet aspect. Les articles sont accessibles à tous les visiteurs. Seuls les rédacteurs et les administrateurs peuvent en rédiger. Nous allons voir comment sont gérés les articles au niveau du front-end. Avec ces considérations : • affichage des articles avec pagination ; • affichage des articles par tag ; • recherche dans les articles ; • affichage des commentaires ; • création et modification des commentaires. Commentez Tutoriel pour apprendre à créer une application Laravel par Maurice Chavelli I - Les sommaires........................................................................................................................................................3 II - Affichage d'un article..............................................................................................................................................5 III - Les tags.................................................................................................................................................................7 IV - La recherche.........................................................................................................................................................9 V - Les commentaires............................................................................................................................................... 10 V-A - Affichage..................................................................................................................................................... 10 V-B - Soumission..................................................................................................................................................11 V-C - Suppression................................................................................................................................................13 V-D - Modification.................................................................................................................................................14 VI - Remerciements...................................................................................................................................................17 - 2 - Copyright ® 2017 Laravel. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts. http://maurice-chavelli.developpez.com/tutoriels/creer-application/gerer-article-front-end/ Tutoriel pour apprendre à créer une application Laravel par Maurice Chavelli I - Les sommaires Les articles sont accessibles à tous les visiteurs en cliquant sur BLOG dans le menu avec cet aspect : On a alors les sommaires des articles qui apparaissent avec une pagination qui limite la génération à deux articles à la fois. C'est la méthode indexFront du contrôleur BlogController qui est chargée de cet affichage : 1. /** 2. * Display a listing of the resource. 3. * 4. * @return Response 5. */ 6. public function indexFront() 7. { 8. $posts = $this->blog_gestion->indexFront($this->nbrPages); 9. $links = $posts->setPath('')->render(); 10. 11. return view('front.blog.index', compact('posts', 'links')); 12. } Le repository est injecté dans le constructeur : 1. /** 2. * Create a new BlogController instance. 3. * - 3 - Copyright ® 2017 Laravel. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts. http://maurice-chavelli.developpez.com/tutoriels/creer-application/gerer-article-front-end/ Tutoriel pour apprendre à créer une application Laravel par Maurice Chavelli 4. * @param App\Repositories\BlogRepository $blog_gestion 5. ... 6. * @return void 7. */ 8. public function __construct( 9. BlogRepository $blog_gestion, 10. ...) 11. { 12. ... 13. $this->blog_gestion = $blog_gestion; 14. $this->nbrPages = 2; 15. 16. ... 17. } C'est la méthode indexFront du repository BlogRepository qui est appelée : 1. /** 2. * Get post collection. 3. * 4. * @param int $n 5. * @return Illuminate\Support\Collection 6. */ 7. public function indexFront($n) 8. { 9. $query = $this->queryActiveWithUserOrderByDate(); 10. 11. return $query->paginate($n); 12. } Le nombre de pages à afficher est passé en paramètre. On fait appel dans le repository à une fonction privée : 1. /** 2. * Create a query for Post. 3. * 4. * @return Illuminate\Database\Eloquent\Builder 5. */ 6. private function queryActiveWithUserOrderByDate() 7. { 8. return $this->model 9. ->select('id', 'created_at', 'updated_at', 'title', 'slug', 'user_id', 'summary') 10. ->whereActive(true) 11. ->with('user') 12. ->latest(); 13. } On récupère ici les articles actifs classés par dates et leurs auteurs. Le contrôleur envoie ensuite tout ça, accompagné des liens de pagination à la vue : - 4 - Copyright ® 2017 Laravel. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts. http://maurice-chavelli.developpez.com/tutoriels/creer-application/gerer-article-front-end/ Tutoriel pour apprendre à créer une application Laravel par Maurice Chavelli Les articles sont générés dans une boucle : 1. @foreach($posts as $post) 2. <div class="box"> 3. <div class="col-lg-12 text-center"> 4. <h2>{{ $post->title }} 5. <br> 6. <small>{{ $post->user->username }} {{ trans('front/blog.on') }} {!! $post->created_at . ($post->created_at != $post->updated_at ? trans('front/blog.updated') . $post->updated_at : '') !!}</small> 7. </h2> 8. </div> 9. <div class="col-lg-12"> 10. <p>{!! $post->summary !!}</p> 11. </div> 12. <div class="col-lg-12 text-center"> 13. {!! link_to('blog/' . $post->slug, trans('front/blog.button'), ['class' => 'btn btn-default btn-lg']) !!} 14. <hr> 15. </div> 16. </div> 17. @endforeach II - Affichage d'un article Lorsqu'on clique sur le bouton En lire plus on affiche l'article : C'est la méthode show du contrôleur BlogController qui est chargée de cet affichage : 1. /** 2. * Display the specified resource. 3. * 4. * @param Illuminate\Contracts\Auth\Guard $auth 5. * @param string $slug 6. * @return Response 7. */ 8. public function show( 9. Guard $auth, 10. $slug) 11. { 12. $user = $auth->user(); 13. - 5 - Copyright ® 2017 Laravel. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts. http://maurice-chavelli.developpez.com/tutoriels/creer-application/gerer-article-front-end/ Tutoriel pour apprendre à créer une application Laravel par Maurice Chavelli 14. return view('front.blog.show', array_merge($this->blog_gestion->show($slug), compact('user'))); 15. } On a besoin de connaître l'utilisateur actuel pour une bonne gestion des commentaires. C'est la méthode show du repository BlogRepository qui est appelée avec transmission du slug de l'article : 1. /** 2. * Get post collection. 3. * 4. * @param string $slug 5. * @return array 6. */ 7. public function show($slug) 8. { 9. $post = $this->model->with('user', 'tags')->whereSlug($slug)->firstOrFail(); 10. 11. $comments = $this->comment 12. ->wherePost_id($post->id) 13. ->with('user') 14. ->whereHas('user', function($q) { $q->whereValid(true); }) 15. ->get(); 16. 17. return compact('post', 'comments'); 18. } Ici on récupère l'article, accompagné de son auteur et des tags. On charge aussi les commentaires correspondants et on envoie tout ça au contrôleur qui lui les envoie dans la vue : Voici le code de l'affichage hors commentaires : 1. <div class="row"> 2. <div class="box"> 3. <div class="col-lg-12"> 4. <hr> 5. <h2 class="text-center">{{ $post->title }} 6. <br> 7. <small>{{ $post->user->username }} {{ trans('front/blog.on') }} {!! $post->created_at . ($post->created_at != $post->updated_at ? trans('front/blog.updated') . $post->updated_at : '') !!}</small> 8. </h2> 9. <hr> 10. {!! $post->summary !!}<br> 11. {!! $post->content !!} 12. <hr> 13. @if($post->tags->count()) 14. <div class="text-center"> 15. @if($post->tags->count() > 0) 16. <small>{{ trans('front/blog.tags') }}</small> 17. @foreach($post->tags as $tag) - 6 - Copyright ® 2017 Laravel. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts. http://maurice-chavelli.developpez.com/tutoriels/creer-application/gerer-article-front-end/ Tutoriel pour apprendre à créer une application Laravel par Maurice Chavelli 18. {!! link_to('blog/tag?tag=' . $tag->id, $tag->tag, ['class' => 'btn btn-default btn-xs']) !!} 19. @endforeach 20. @endif 21. </div> 22. @endif 23. </div> 24. </div> 25. </div> III - Les tags Lorsqu'on clique sur un bouton de tag, on doit afficher tous les articles qui correspondent à ce tag : C'est la méthode tag du contrôleur BlogController qui est chargée de cet affichage : 1. /** 2. * Get tagged posts 3. * 4. * @param Illuminate\Http\Request $request 5. * @return Response 6. */ 7. public function tag(Request $request) 8. { 9. $tag = $request->input('tag'); 10. $posts = $this->blog_gestion->indexTag($this->nbrPages, $tag); 11. $links = $posts->setPath('')->appends(compact('tag'))->render(); - 7 - Copyright ® 2017 Laravel. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts. http://maurice-chavelli.developpez.com/tutoriels/creer-application/gerer-article-front-end/ Tutoriel pour apprendre à créer une application Laravel par Maurice Chavelli 12. $info = trans('front/blog.info-tag') . '<strong>' . $this->blog_gestion->getTagById($tag) . '</strong>'; 13. 14. return view('front.blog.index', compact('posts', 'links', 'info')); 15. } L'index du tag est récupéré dans la requête qu'on injecte dans la méthode. Pour récupérer les articles, on utilise la méthode indexTag du repository BlogRepository : 1. /** 2. * Get post collection. 3. * 4. * @param int $n 5. * @param int $id 6. * @return Illuminate\Support\Collection 7. */ 8. public function indexTag($n, $id) 9. { 10. $query = $this->queryActiveWithUserOrderByDate(); 11. 12. return $query->whereHas('tags', function($q) use($id) { $q->where('tags.id', $id); }) 13. ->paginate($n); 14. } Cette méthode ressemble beaucoup à celle qu'on a vue pour l'affichage des articles (indexFront) puisqu'on fait appel à la même fonction privée queryActiveWithUserOrderByDate. La différence réside dans le fait qu'on va limiter les articles à ceux qui possèdent le tag. On a également besoin dans la vue du nom du tag pour la barre d'information : C'est la méthode getTagById du repository BlogRepository qui nous le donne : 1. /** 2. * Get tag name by id. 3. * 4. * @param int $tag_id 5. * @return string 6. */ 7. public function getTagById($tag_id) 8. { 9. return uploads/s1/ creer-une-application-les-articles-front-end.pdf

  • 21
  • 0
  • 0
Afficher les détails des licences
Licence et utilisation
Gratuit pour un usage personnel Attribution requise
Partager
  • Détails
  • Publié le Mar 18, 2022
  • Catégorie Administration
  • Langue French
  • Taille du fichier 0.6972MB