请教前后端项目部署问题？

最近在学习前后端分离，前端使用vue.js,后端thinkphp，不是很理解项目文件部署，特来请教各位，望好心人解惑!

思路：

1. 构建一个项目文件夹demo，子目录->a1,a2


2. a1放前端项目，a2放后端项目


3. test.com通过服务器配置直接请求a1文件夹下的index.html


4. 通过前端路由跳转，完成页面之间的切换，数据从后端去获取


5. 前端请求数据地址test.com/news/p/123，通过服务器配置进入a2文件夹，异步返回数据

整个流程就是前端负责页面，后端负责数据接口，解决前后端耦合开发的困境。目前有2个问疑惑：

---1、上述思路是否有问题？
---2、如何配置服务器（apche、nginx），一个域名test.com去不同的文件夹（test.com去a1,test.com/news/p/123去找a2）