Netlify Build from the result of two repos

Support
,
1

We have a repository for a VueJS application that can be configured in various different ways for different customers.

We’re therefore thinking of using Github Actions to create a build pipeline that takes the source code from the VueJs application’s Github repository and applies the appropriate configuration from a separate repository to create the customer-specific versions.

We’d then want to build the application - i.e run

npm run build

on the output of that process and have Netlify deploy the result to a specific target site.
i.e. each combination of config + app results in a separate Netlify site.

Can anyone point me to any documentation or provide some experience on achieving this kind of requirement?

Any help greatly appreciated!

2

While you can use Netlify API to create new websites, I’m not sure if you can do it via GitHub actions. Read about it here: Netlify API documentation

This might be an example config:

 var settings = {
    url: "https://api.netlify.com/api/v1/sites",
    method: "POST",
    timeout: 0,
    headers: {
      Authorization: "Bearer " + token,
      "Content-Type": "application/json",
    },
    data: JSON.stringify({
      name: sitename,

      repo: {
        provider: "github",
        id: GitRepoID,
        repo: USRNAME/REPO,
        private: true,
        branch: "master",
        deploy_key_id: deploy_key_idd,
      },
    }),
  };

However, I’m not sure if this can be integrated with GitHub Actions. I have never used them, so can’t comment on it.

3

It feels like the challenge here is that in Netlify there is a coupling between a Github repo and a site. Whereas what we need to do is to produce an output that combines more than one repo that is then deployed to a CDN.

4

Sadly, the combining part can’t happen on Netlify. You’d need to have one final repo to deploy. Netlify can only build the one repo that you provide it and publish its output.

Maybe you can use something like a Git submodule, though I’m not so sure.

5

Thanks for the reply, I’ll do some more digging

6

Hey @ross.coundon :wave:t2:

Sounds like you have a ‘core’ spa that lives in its own repo then n number of other repos that apply facades to the SPA and ship it as a customer-specific version. Here’s what I’d recommend in that case.

For starters, you can make your own build script. If you make a file called ./build.js then tell netlify to use a build command like node ./build.js, it’ll run that script as your “build” — it’s all very flexible. Additionally, since you can write your own build script, there’s nothing stopping you from using GitHub’s API to access other private repos and pull in code/files from them during build-time. Here’s a layout I’d recommend for you:

While I don’t know your architecture, I’ll give you the Gatsby.js analog since I know it well. That would give me a ‘core’ app and, let’s say 2 client/customer repositories. The idea here is that each client repository is empty except for a gatsby-config.js file that needs to override the core config.

In your “core” repository, have a ./buildCustomerApp.js file that uses the GitHub SDK to pull down the gatsby-config.js file from a repository whose name I specify as an ENV var… maybe process.env.FACADE_REPO_NAME. Once it pulls the file down, it replaces the gatsby-config.js that comes with the ‘core’ repo (either by full file replace or even json merge, since Gatsby’s config files are just js objects). Finally, the script runs the gatsby build (which should still take advantage of gatsby build caching, yay!)

Great! Now all you have to do is generate multiple Netlify Sites from that single ‘core’ repository, which Netlify lets you do. You can do the “New Site From Git” for the same site as many times as you’d like. The key here being that each site you generate, you set a different FACADE_REPO_NAME environment variable. Then you end up with each site pulling the code from the ‘core’ repo but the build-script pulling the specific configuration from each client repository at build time.

Hope that makes sense and gives you an idea for how to move forward. Happy to chat more!

–
Jon

1 Like
8

This is perfect, thank you @jonsully

I’ve drawn a picture of how I’ve understood the process for anyone else who visits this thread (and for my own understanding) I’ll be trying this out today. Thanks again for such a thorough response.

image
image1120×800 17.5 KB

1 Like
9

@jonsully - just to report back, it only bleedin’ worked! Thanks so much!

1 Like
10

Great! Really glad to hear it :slight_smile: Technically that model is what we call “shadowing” in Gatsby-land and similar to Netlify’s own concept of “shadowing” (with respect to URLs and redirects) — so theoretically you should be able to ‘overwrite’ any file in the core repo with a customized version in any of the output repos — just replacing the files recursively from the root etc…
All that to say, it’s an extendable pattern that you should be able to use to pretty great lengths! :smiley:

–
Jon

1 Like