Mono vs Multi Repo
How to structure your frontend and backend
Encore is not opinionated about if you have your backend and frontend code in the same repo or not. Pick the approach that fits your application best.
Monorepo
If you use a monorepo then it is often a good idea to place your backend and frontend in separate folders in the root of your repo, like so:
/my-app
├── backend
│ ├── encore.app
│ ├── package.json // Backend dependencies (go.mod for Encore.go)
│ └── ...
└── frontend
├── package.json // Frontend dependencies
└── ...
This way, you can keep your frontend and backend dependencies separate, while still having the codebases in the same repository. If you are using the Encore platform for deployment, remember to configure the "Root Directory" in app settings in the Encore platform dashboard to point to where you have your encore.app file.
Next.js + Encore Starter, separated into frontend and backend folders.
View on GitHubYou can also have a monorepo where the encore.app file is in the root of the repo, the frontend code will then be inside your Encore app. If you go this route with Encore.ts, you will most likely need two different tsconfig.json files, one for the frontend and one for the backend.
React + Encore Starter, frontend code inside the Encore app.
$ encore app create --example=ts/react-starter