前后台分离开发

1. 前后台分离开发介绍

前端开发主要分为两种方式：前后台混合开发和前后台分离开发。前后台混合开发存在沟通成本高、分工不明确、不便管理和维护等问题。因此，目前主流开发模式为前后台分离开发。

在前后台分离模式下，后端开发者需具备基础的前端能力。开发流程包括需求分析、接口定义、前后台并行开发、测试，以及最终的前后台联调测试。

2. 前端工程化

2.1 前端工程化介绍

传统使用HTML、CSS和JS开发存在效率低、组件复用性差、资源管理混乱等问题。前端工程化通过模块化、组件化、规范化和自动化，提升开发效率并降低难度。

前端工程化的核心在于标准化工具、技术和流程。Vue官方提供的脚手架Vue-cli是实现前端工程化的重要工具。

3. NodeJS安装

Vue-cli依赖NodeJS环境。安装NodeJS的步骤包括下载安装包、选择安装目录、验证环境变量、配置npm全局路径、切换npm镜像，以及安装Vue-cli。安装完成后，即可使用Vue-cli进行前端项目开发。

4. Vue项目创建

4.1 图形化界面创建

Vue项目可以通过命令行或图形化界面创建。图形化界面更适合初学者，创建过程需要联网且可能耗时较长。创建完成后，项目目录结构可通过VS Code查看，代码主要存放在src目录下。

4.2 运行Vue项目

通过VS Code的图形化界面运行Vue项目，默认端口为8080。项目运行后可通过浏览器访问本地服务。如果默认端口被占用，可在vue.config.js中修改端口号。

此外，可通过设置VS Code的NPM脚本窗口配置，方便管理脚本任务。

代码审查完整指南来了！

了解更多

springboot葵花宝典

查看原文：前后台分离开发

文章来源：

springboot葵花宝典

扫码关注公众号