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.

Related example
encoredev/nextjs-starter

Next.js + Encore Starter, separated into frontend and backend folders.

View on GitHub

You 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.

Related example
encoredev/examples/react-starter

React + Encore Starter, frontend code inside the Encore app.

$ encore app create --example=ts/react-starter