How to separate front-end and back-end in php server?-PHP Problem-php.cn

How to separate front-end and back-end in php server?

尚

Release： 2023-02-27 15:14:02

Original

12103 people have browsed it

How to separate front-end and back-end in php server?

php code is written in HTML. There are no pure PHP files and HTML files. This is the non-separation of the front and back ends, which will greatly reduce development efficiency. So we need to separate the PHP server from the front-end to achieve front-end and back-end separation.

Recommended reading: php server

Advantages of front-end and back-end separation:

1. Build a lean team for high-quality products

2. Improve work efficiency and make division of labor clearer

3. Improve local performance

4. Enhance code maintainability

PHP server separates front-end and back-end Method:

We can use vue to achieve front-end and back-end separation of the PHP server.

Vue under Blade

Write a Laravel template file, pass in PHP variables and render.

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

Copy after login

Introduce Vue through the script tag, and then write the vue logic in the tag.

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

Copy after login

With ajax libraries like axios, the front end can be written only in the resources/views folder.

Vue under the build tool

Laravel Mix provides a pipeline that can stream compile CSS and JS.

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

Copy after login

Similar to Gulp, it also runs on Node.

npm install
npm run dev
npm run production

Copy after login

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

Copy after login

Then you can write it directly in the PHP template.

@extends('layouts.app')

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

Copy after login

In fact, the principle is still the same as the previous manual compilation. First, use the webpack translation component to generate a normal PHP template and call it to PHP.

Separation and forwarding

The back-end work here is generally:

Write Lumen code and provide services
Write Restful API documentation
Use postman for testing

The front-end work is generally:

Write Vue code
Package and compile
Use Node to forward API requests to solve cross-domain problems
Use PM2 to handle concurrent requests

The above is the detailed content of How to separate front-end and back-end in php server?. For more information, please follow other related articles on the PHP Chinese website!