Maison  >  Article  >  développement back-end  >  Comment séparer le front-end et le back-end dans le serveur php ?

Comment séparer le front-end et le back-end dans le serveur php ?

尚
original
2019-10-21 10:52:5612012parcourir

Comment séparer le front-end et le back-end dans le serveur php ?

Le code PHP est écrit en HTML. Il n'y a pas de fichiers PHP purs et de fichiers HTML. Il s'agit de la non-séparation du front-end et du back-end, ce qui réduira considérablement l'efficacité du développement. . Nous devons donc séparer le serveur PHP du front-end pour parvenir à une séparation front-end et back-end.

Lecture recommandée : Serveur PHP

Avantages de la séparation front-end et back-end :

Construisez une équipe réduite pour. produits de haute qualité

2. Améliorer l'efficacité du travail et rendre la division du travail plus claire

3. Améliorer les performances locales

4. Améliorer la maintenabilité du code

Séparer le front-end et le back-end pour le serveur PHP Méthode :

Nous pouvons utiliser vue pour réaliser la séparation front-end et back-end du serveur PHP.

Vue sous Blade

Écrivez un fichier modèle Laravel, transmettez les variables PHP et effectuez le rendu.

<html>
    <body>
        <h1>{{ $hello }}</h1>
    </body>
</html>

Introduisez Vue via la balise script, puis écrivez la logique de vue dans la balise.

<script src="js/vue.min.js"></script>

Avec les bibliothèques ajax comme axios, le front-end ne peut être écrit que dans le dossier resources/views.

Vue sous l'outil de construction

Laravel Mix fournit un pipeline qui peut compiler en continu CSS et JS.

mix.js('resources/assets/js/app.js', 'public/js')
   .sass('resources/assets/sass/app.scss', 'public/css');

Semblable à Gulp, il fonctionne également sur Node.

npm install
npm run dev
npm run production

Enregistrez le composant dans app.js.

// app.js
Vue.component('example', require('./components/Example.vue'));

Ensuite, vous pouvez l'écrire directement dans le modèle PHP.

@extends('layouts.app')

@section('content')
    <example></example> // 这里是使用vue组件的
@endsection

En fait, le principe est toujours le même que la compilation manuelle précédente. Tout d'abord, utilisez le composant de traduction webpack pour générer un modèle PHP normal et appelez-le en PHP.

Séparation et transfert

Le travail back-end ici est généralement :

  • Écrire le code Lumen et fournir des services

  • Rédiger la documentation de l'API Restful

  • Utiliser Postman pour tester

Le travail front-end est généralement :

  • Écrire le code Vue

  • Emballer et compiler

  • Utiliser Node pour transmettre les requêtes API à résoudre problèmes inter-domaines

  • Utilisez PM2 pour gérer les requêtes simultanées

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