Maison  >  Article  >  cadre php  >  Développement Laravel : Comment utiliser Laravel Nova et AdminBro pour générer une interface de gestion backend ?

Développement Laravel : Comment utiliser Laravel Nova et AdminBro pour générer une interface de gestion backend ?

WBOY
WBOYoriginal
2023-06-15 18:01:291304parcourir

Laravel est un framework d'application Web PHP populaire doté de fonctionnalités et d'outils riches pour aider les développeurs à créer des applications Web plus rapidement et plus facilement. Laravel Nova et AdminBro sont deux frameworks open source qui peuvent nous aider à générer rapidement de belles interfaces de gestion backend. Cet article vous expliquera comment les utiliser pour réaliser un développement rapide et mettre rapidement votre application en ligne.

1. Comprendre Laravel Nova et AdminBro

Laravel Nova est un panneau de gestion backend magnifique et facile à utiliser développé par Taylor Otwell et son équipe. Il fournit des fonctions puissantes, telles que : la gestion des ressources, le filtrage et le tri, la personnalisation. tableaux de bord et plus encore. De plus, en utilisant plusieurs composants, vous pouvez facilement personnaliser le style et l'apparence de Nova.

AdminBro est un panneau d'administration backend extensible pour Node.js et Typescript. Il utilise React comme bibliothèque d'interface utilisateur, avec une conception réactive et une facilité d'utilisation. Les développeurs peuvent utiliser AdminBro pour développer leur propre panneau d'administration. l'apparence et le comportement peuvent être personnalisés selon les besoins.

2. Installez et configurez Laravel Nova

Avant de commencer, vous devez vous assurer que la dernière version de Laravel est installée dans votre projet. Dans votre projet, utilisez composer pour mettre à jour et installer la dernière version de Laravel Nova.

composer require laravel/novacomposer require laravel/nova

安装过程可能需要一段时间,而且您需要登录到Laravel Nova的官方网站来注册您的Nova应用并注册授权。

完成后,您需要将Nova添加到路由文件中。这可以使用以下语句来实现:

Route::get('/nova', function () { return redirect('/nova/login');});

你也可以将此语句添加到您的路由文件中,这样管理面板将只对授权用户可用。

Route::middleware(['auth'])->group(function () { Route::get('/nova', function () { return redirect('/nova/login'); }); Nova::routes();});

在这里,您可以使用Nova::routes()方法来指定哪些路由将被nova使用。设置完成后,您现在可以访问您新增的/Admin路由,并成功登录后进入Nova控制面板。

三、安装和配置AdminBro

与Laravel Nova相比,AdminBro可以在Node.js环境中运行。 它是一种插件化架构,支持各种拓展,例如各种输入值的强类型输入、自定义预览、过滤、排序等功能。

安装AdminBro是很容易的,首先你需要安装两个必要的依赖。

npm install admin-bro

npm install @admin-bro/express

Le processus d'installation peut prendre un certain temps et vous devez vous connecter au site officiel de Laravel Nova pour enregistrer votre application Nova et vous inscrire pour obtenir une autorisation.

Une fois terminé, vous devez ajouter Nova à votre fichier de routage. Ceci peut être réalisé en utilisant l'instruction suivante :

Route::get('/nova', function () { return redirect('/nova/login');});

Vous pouvez Ajoutez également cette déclaration à votre fichier de routage afin que le panneau d'administration ne soit disponible que pour les utilisateurs autorisés.

Route::middleware(['auth'])->group(function () { Route::get('/nova', function () { return redirect('/nova/login'); }); Nova::routes();});

Ici, vous pouvez utiliser la méthode Nova::routes() pour spécifier quelles routes seront utilisées par nova. Une fois la configuration terminée, vous pouvez maintenant accéder à votre itinéraire /Admin nouvellement ajouté et vous connecter avec succès au panneau de configuration Nova.

3. Installez et configurez AdminBro

Par rapport à Laravel Nova, AdminBro peut s'exécuter dans l'environnement Node.js. Il s'agit d'une architecture de plug-in qui prend en charge diverses extensions, telles que la saisie fortement typée de diverses valeurs d'entrée, l'aperçu personnalisé, le filtrage, le tri et d'autres fonctions.

Installer AdminBro est très simple, vous devez d'abord installer deux dépendances nécessaires.

npm install admin-bro

npm install @admin-bro/express🎜🎜Ensuite, vous devez configurer AdminBro sur l'application Express puis sur le routeur Activez AdminBro où vous pouvez définir des chemins de routage et des gestionnaires. 🎜
const AdminBro = require('admin-bro')
const AdminBroExpress = require('@admin-bro/express')
const express = require('express')

const adminBro = new AdminBro()
const router = AdminBroExpress.buildRouter(adminBro)

const app = express()
app.use(adminBro.options.rootPath, router)

app.listen(8080, () => { console.log('Server running')})
🎜Après avoir activé AdminBro dans votre application Express, vous devez créer un objet de configuration AdminBro qui contient toutes les entités. 🎜
const Cars = require('./entities/cars')
const Users = require('./entities/users')

const adminBroOptions = {
  resources: [{
    resource: Cars,
    options: {
      properties: {
        name: { isTitle: true },
        gearbox: { components: { list: AdminBro.bundle('./path/to/custom/components/list') } },
      },
    },
  }, Users]
}

const adminBro = new AdminBro(adminBroOptions)
🎜Ici, nous avons créé un code auquel notre entité est attachée. Vous pouvez utiliser le programme comme modèle pour ajouter des entités, des propriétés et des composants personnalisés. 🎜🎜4. Gérez vos données avec Laravel Nova et AdminBro🎜🎜Maintenant que Laravel Nova et AdminBro sont installés dans notre application et que nous les avons configurés, nous pouvons les utiliser pour créer un panneau d'administration personnalisé. Bien que ces cadres soient très similaires à certains égards, ils sont légèrement différents à d’autres égards. 🎜🎜1. Gestion des ressources : Laravel Nova fournit un gestionnaire de ressources simple mais puissant qui vous permet de gérer facilement et simplement les ressources, telles que : les articles, les auteurs, les commentaires, les commandes, à l'aide de l'ORM (Object Relational Mapping) pratique de Laravel. AdminBro peut également effectuer des opérations similaires, mais cela nécessite l'utilisation de nouvelles classes d'entités et sources de données, ce qui peut prendre plus de temps. 🎜🎜2. Champs et propriétés : le panneau d'administration de Laravel Nova et AdminBro vous permet d'ajouter facilement des champs de saisie, d'affichage et de formatage en installant des plugins ou des composants personnalisés. Les deux frameworks prennent en charge la création de champs, mais Nova possède davantage de composants de champ. En revanche, les composants personnalisés d'AdminBro vous permettent de gérer plus directement certains composants, tels que les sélecteurs et les boutons radio. 🎜🎜3. Personnalisation de la vue : Laravel Nova utilise Blade comme moteur de modèle par défaut. Vous pouvez donc utiliser le système de modèles de base de Laravel pour définir des vues. Parallèlement, Nova peut également utiliser Vue pour développer des composants personnalisés. Étant donné qu'AdminBro utilise React comme bibliothèque d'interface utilisateur par défaut, vous devez utiliser React pour développer vos vues personnalisées. 🎜🎜Conclusion🎜🎜Laravel Nova et AdminBro sont tous deux d'excellents frameworks qui peuvent aider les développeurs à créer plus rapidement des panneaux d'administration magnifiques et faciles à utiliser dans les applications Web. Ils fonctionnent légèrement différemment, mais vous pouvez décider quel framework utiliser en fonction de vos besoins. Désormais, il vous suffit de suivre les étapes ci-dessus pour configurer et utiliser ces deux frameworks dans votre application, garantissant ainsi une amélioration maximale de l'efficacité de votre apprentissage et de votre développement et une mise en ligne plus rapide de votre application. 🎜

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn