Как мне организовать бэкэнд и фронтенд моего кода?

Question

У меня есть проект, и я написал много кода для внутреннего интерфейса (Flask / Python) и много кода для внешнего интерфейса (Vue).До сих пор они были отдельными папками / репозиториями Github.

Мне было интересно, что типично для их объединения в отношении (1) репозиториев Github и (2) файловой структуры.Внешний интерфейс зависит от некоторых функций в бэкэнде, поэтому их нужно каким-то образом связать, но, поскольку для обоих аспектов проекта написано так много кода, я подумал, что объединение их под одним Github может оказаться ошеломляющимструктура репозитория / файла.

Может ли кто-нибудь предложить некоторые предложения или ресурсы?

Answer 1

Если вы хотите сохранить один репозиторий Github для внутреннего и внешнего приложения, я могу предложить следующие шаги:

1. Вы можете создать папку с именем client внутри Flaskприложения и переместите весь проект Vue в эту папку.

2. В папке клиента (приложение Vue) добавьте параметр outputDir внутри vue.config.js файл выглядит следующим образом

const path = require('path');

module.exports = {
  outputDir: path.resolve(__dirname, '../dist'),
}

Чтобы создать папку dist внутри вашего приложения Flask, перейдите в папку клиента и запустите npm run build или сборка пряжи в зависимости от вашего менеджера пакетов.

В файле run.py добавьте этот код для обслуживания Vue App

from flask import Flask, render_template
app = Flask(__name__,
            static_folder = "./dist",
            template_folder = "./dist")

@app.route('/')
def index():
    return render_template("index.html")

Конструкции могут изменяться в зависимости отв конфигурации вашего приложения Flask Application, но я думаю, что это может дать вам идею.

Ознакомьтесь с этой статьей , чтобы узнать больше.