Use encore client in separate Frontend repo to fetch data from a PR environment

Feedback & Ideas
,
1

Since we have our backend and frontend in separate repositories, we often have to spend some time to populate our local backend databases to correspond to whichever frontend feature or component we are developing. This is not too much work and can sometimes even be beneficial as it helps you think about dependencies.

However, it becomes problematic when we’re reviewing PR:s. Currently, the reviewer of a frontend PR requires that the reviewer has a similar enough local backend database to the author of the PR. Even if we share database dumps, this means that the reviewer may need to reset their local database, which could be impractical if they’re working on a new backend feature.

SO - I’ve been thinking. I think the PR environments created by Encore are perfect for this. Then, the person populating the db could just temporarily open backend PR (triggering a PR env deploy), populate that db instead of the local db and then link/mention the backend PR number in the frontend PR.

The only thing that really prevents us from doing this now is knowing how to set up the client for this. The requirements are something like this.

  1. If frontend is in local dev mode → render component that lets user input BASE_URL or PR number
  2. Upon submission of new BASE_URL or PR number, update the client

I noticed there’s already this snippet as part of the client

/**
 * PreviewEnv returns a BaseURL for calling the preview environment with the given PR number.
 */
export function PreviewEnv(pr: number | string): BaseURL {
    return Environment(`pr${pr}`)
}

But I’m not sure what the right way to use it would be - so would love some help/feedback on how we could set this up and if there are any changes needed to the client before this could be done.

2

Hey @jakob, posting a reply in this thread so that it’s publically visible even though it’s an old thread.

The local testing use case should be well handled by the Infrastructure Namespaces functionality, documented here: Infrastructure Namespaces — Encore Docs

You could simply run encore namespace switch --create pr:123 to create a new local namespace to avoid resetting the local database.

If you still have questions about testing against a PR env (that haven’t been answered on Slack already, let me know!).

3

Thanks - are you intending to start using this forum again or do you prefer questions on Slack?

4

Our ambition is to have more activity here as it aids knowledge sharing and discoverability.
We’ll definitely keep using Slack for synchronous conversations and more urgent questions.