{"id":24455,"date":"2021-05-19T13:15:00","date_gmt":"2021-05-19T10:15:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=24455"},"modified":"2021-10-18T02:15:24","modified_gmt":"2021-10-17T23:15:24","slug":"comment-creer-un-blog-avec-laravel","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/fr\/comment-creer-un-blog-avec-laravel\/","title":{"rendered":"Comment cr\u00e9er un blog avec Laravel"},"content":{"rendered":"

Laravel est le framework PHP le plus populaire. Nous savons tous que les gens pr\u00e9f\u00e8rent ce framework pour cr\u00e9er leurs applications Web. Et lors de la cr\u00e9ation d’un site Web avec Laravel, vous souhaiterez probablement cr\u00e9er un blog sur votre site Web. En g\u00e9n\u00e9ral, Laravel n’est pas une plate-forme de blogs comme WordPress o\u00f9 vous pr\u00e9parez tout le backend pour g\u00e9rer vos articles de blog. Et construire le syst\u00e8me de blog \u00e0 partir de z\u00e9ro est un travail assez long. Merci \u00e0 Canvas<\/a> qui facilite la vie des d\u00e9veloppeurs Laravel en cr\u00e9ant une plate-forme de publication sympa pour Laravel.<\/p>\n

En utilisant le package Canvas, nous pouvons facilement cr\u00e9er notre blog dans Laravel en quelques minutes seulement. Canvas a d\u00e9j\u00e0 travaill\u00e9 dur pour g\u00e9rer le backend du blog. Il vous suffit d’obtenir les donn\u00e9es et de les afficher sur le front-end correspondant \u00e0 votre conception.<\/p>\n

Cela dit, voyons comment cr\u00e9er un blog avec Laravel en utilisant le package Canvas.<\/p>\n

Commencer<\/h3>\n

Pour commencer avec Canvas, vous devez d’abord satisfaire aux exigences de base de Canvas, \u00e0 savoir l’authentification de l’utilisateur. Laravel rend la mise en \u0153uvre de l’authentification tr\u00e8s simple. Si vous avez d\u00e9j\u00e0 install\u00e9 l’authentification Laravel, ignorez cette \u00e9tape. Sinon dans votre terminal, ex\u00e9cutez les commandes ci-dessous une par une pour configurer l’authentification Laravel.<\/p>\n

composer require laravel\/ui --dev\nphp artisan ui vue --auth\nnpm install && npm run dev\n<\/code><\/pre>\n
Cr\u00e9er un blog avec Laravel en utilisant Canvas Package<\/h3>\n
Une fois l’authentification \u00e0 l’endroit, vous pouvez installer le Canvas en ex\u00e9cutant la commande ci-dessous\u00a0:<\/p>\n
composer require cnvs\/canvas<\/code><\/pre>\n
Lors de l’installation du package, vous devez publier les actifs et le fichier de configuration principal. Publiez-le \u00e0 l’aide de la commande\u00a0:<\/p>\n
php artisan canvas:install<\/code><\/pre>\n
Cette commande localiserait le fichier de configuration principal sur config\/canvas.php<\/code>. Vous pouvez contr\u00f4ler divers aspects \u00e0 l’aide de ce fichier de configuration. Mais vous avez rarement besoin de toucher \u00e0 ce fichier car tout est d\u00e9j\u00e0 d\u00e9fini aux endroits.<\/p>\n
Il cr\u00e9e \u00e9galement quelques tables dans votre base de donn\u00e9es. Ce paquet ajoute un pr\u00e9fixe ‘canvas_’ \u00e0 toutes ces tables nouvellement cr\u00e9\u00e9es.<\/p>\n
En ce qui concerne les blogs, vous devez toujours utiliser des images dans le contenu. Cr\u00e9ez donc un lien symbolique pour vous assurer que les t\u00e9l\u00e9chargements de fichiers sont accessibles publiquement \u00e0 partir du Web.<\/p>\n
php artisan storage:link<\/code><\/pre>\n
Cela signifie que vous verrez vos images t\u00e9l\u00e9charg\u00e9es dans le public\/storage<\/code>r\u00e9pertoire.<\/p>\n
Maintenant, si vous ex\u00e9cutez l’URL http:\/\/localhost:8000\/canvas,<\/a> vous serez redirig\u00e9 vers la page des statistiques. Vous pouvez rediriger vers la page de connexion si vous ne vous \u00eates pas connect\u00e9. Ici, j’utilise le localhost, vous pouvez ajuster cette URL.<\/p>\n
Sur la page des statistiques, vous obtiendrez des analyses de base de votre blog comme le nombre de vues, de visiteurs, la tendance de chaque article, etc.<\/p>\n
Depuis la section d’en-t\u00eate, vous pouvez obtenir les menus pour cr\u00e9er des articles, des balises, des sujets, des param\u00e8tres, etc. Vous devez jouer avec tous ces menus. C’est simple et facile \u00e0 comprendre.<\/p>\n
\"Comment<\/a><\/p>\n
En cliquant sur le bouton ‘New Post’, vous serez redirig\u00e9 vers une page o\u00f9 vous pourrez ajouter votre article. Vous pouvez \u00e9galement ajouter des images en vedette, des param\u00e8tres de r\u00e9f\u00e9rencement, des balises, des sujets \u00e0 l’article. Remarquez les trois points \u00e0 c\u00f4t\u00e9 du bouton Publier. En cliquant sur ces points, vous obtenez toutes ces options.<\/p>\n
\"Comment<\/a><\/p>\n
Capture d’\u00e9cran ci-dessus montrant la couleur d’arri\u00e8re-plan lorsque j’active le mode sombre. Dans votre cas, vous pouvez voir le fond blanc. Alors ne vous y trompez pas. L’utilisateur peut trouver cette fonctionnalit\u00e9 de mode sombre sur la page Param\u00e8tres.<\/p>\n
Canvas a une fonction d’enregistrement automatique afin que vous ne perdiez pas votre travail.<\/p>\n
L’interface de ce package est simple. Vous pouvez facilement vous y familiariser en un rien de temps. La prochaine chose que nous devons voir est d’afficher vos articles sur le front-end.<\/p>\n
Publication d’articles sur le site Web<\/h4>\n
Une fois que vous avez termin\u00e9 avec le backend, vous devez afficher vos articles sur le front-end. Cela n\u00e9cessite de d\u00e9finir quelques routes et m\u00e9thodes dans le fichier du contr\u00f4leur. La biblioth\u00e8que Canvas a fait ce travail difficile pour vous. Sur la page GitHub de cette biblioth\u00e8que, vous obtiendrez le code correspondant. Ajoutez les itin\u00e9raires ci-dessous dans votre routes\/web.php<\/code>fichier.<\/p>\n
\/\/ Get all published posts\nRoute::get('blog', 'BlogController@getPosts');\n\u00a0\n\/\/ Get posts for a given tag\nRoute::get('tag\/{slug}', 'BlogController@getPostsByTag');\n\u00a0\n\/\/ Get posts for a given topic\nRoute::get('topic\/{slug}', 'BlogController@getPostsByTopic');\n\u00a0\n\/\/ Find a single post\nRoute::middleware('CanvasHttpMiddlewareSession')->get('{slug}', 'BlogController@findPostBySlug');<\/code><\/pre>\n
Cr\u00e9ez un contr\u00f4leur BlogController \u00e0 l’aide de la commande\u00a0:<\/p>\n
php artisan make:controller BlogController<\/code><\/pre>\n
Vous BlogController.php<\/code>aurez le code ci-dessous.<\/p>\n
<?php\n\u00a0\nnamespace AppHttpControllers;\n\u00a0\nuse IlluminateHttpRequest;\n\u00a0\nclass BlogController extends Controller\n{\n\u00a0\u00a0\u00a0\u00a0public function getPosts()\n\u00a0\u00a0\u00a0\u00a0{\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$data = [\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'posts' => CanvasPost::published()->orderByDesc('published_at')->simplePaginate(10),\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0];\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0return view('blog.index', compact('data'));\n\u00a0\u00a0\u00a0\u00a0}\n\u00a0\n\u00a0\u00a0\u00a0\u00a0public function getPostsByTag(string $slug)\n\u00a0\u00a0\u00a0\u00a0{\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0if (CanvasTag::where('slug', $slug)->first()) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$data = [\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'posts' => CanvasPost::whereHas('tags', function ($query) use ($slug) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$query->where('slug', $slug);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0})->published()->orderByDesc('published_at')->simplePaginate(10),\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0];\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0return view('blog.index', compact('data'));\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0} else {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0abort(404);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0}\n\u00a0\n\u00a0\u00a0\u00a0\u00a0public function getPostsByTopic(string $slug)\n\u00a0\u00a0\u00a0\u00a0{\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0if (CanvasTopic::where('slug', $slug)->first()) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$data = [\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'posts' => CanvasPost::whereHas('topic', function ($query) use ($slug) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$query->where('slug', $slug);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0})->published()->orderByDesc('published_at')->simplePaginate(10),\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0];\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0return view('blog.index', compact('data'));\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0} else {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0abort(404);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0}\n\u00a0\n\u00a0\u00a0\u00a0\u00a0public function findPostBySlug(string $slug)\n\u00a0\u00a0\u00a0\u00a0{\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$posts = CanvasPost::with('tags', 'topic')->published()->get();\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$post = $posts->firstWhere('slug', $slug);\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0if (optional($post)->published) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$data = [\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'author' => $post->user,\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'post'\u00a0\u00a0 => $post,\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'meta'\u00a0\u00a0 => $post->meta,\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0];\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ IMPORTANT: This event must be called for tracking visitor\/view traffic\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0event(new CanvasEventsPostViewed($post));\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0return view('blog.show', compact('data'));\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0} else {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0abort(404);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0}\n}<\/code><\/pre>\n
Cr\u00e9er des fichiers lame<\/h4>\n
Comme d\u00e9fini dans le contr\u00f4leur, cr\u00e9ons un fichier blade blog\/index.blade.php<\/code>et blog\/show.blade.php<\/code>. Dans ce tutoriel, je ne vais pas concevoir une liste de blogs et une page de d\u00e9tail. Comme chacun de vous a un design distinct. Je vais juste imprimer des articles sur le fichier blade. Vous pouvez appliquer une correspondance de conception avec votre site Web.<\/p>\n
blog\/index.lame.php<\/strong><\/p>\n
<ul>\n\u00a0\u00a0\u00a0\u00a0@foreach($data['posts'] as $d)\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<li>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<h2><a href=\"{{url($d['slug'])}}\">{{ $d['title'] }}<\/a><\/h2>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<p>{!! $d['body'] !!}<\/p>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/li>\n\u00a0\u00a0\u00a0\u00a0@endforeach\n<\/ul><\/code><\/pre>\n
blog\/show.blade.php<\/strong><\/p>\n
@if($data['post']['featured_image'])\n\u00a0\u00a0\u00a0\u00a0<img src=\"{{ url($data['post']['featured_image']) }}\" alt=\"{{ $data['post']['featured_image_caption'] }}\" \/>\n@endif\n<h2>{{ $data['post']['title'] }}<\/h2>\n{!! $data['post']['body'] !!}<\/code><\/pre>\n
Je sugg\u00e9rerais d’imprimer la $data<\/code>variable et de v\u00e9rifier toutes les informations que cette variable contient. Vous voudrez probablement aussi utiliser d’autres d\u00e9tails de cette variable.<\/p>\n
J’esp\u00e8re que vous comprenez comment cr\u00e9er un blog avec Laravel en utilisant un package Canvas. Vous pouvez en apprendre plus sur ce package sur cnvs\/canvas<\/a>.<\/p>\n
Articles Li\u00e9s<\/h4>\n