Static frontend + API/Function

[NamesMT]

Hi, I'm trying to achieve a deployment of which it's similar to StaticSite where we only build and deploy the site's frontend on sst deploy, not sst dev, with the ability to link to an API/Function to host in the same Cdn and custom domain, like:

routes: {
  "/*": myStaticFrontend,
  "/api/*": myFunction.url
}

Is it possible / how clean is it to achieve in the current state of Ion?

[NamesMT]

Basically, a stack for a Client-side rendered SPA + backend on same distribution/domain

[NamesMT]

I hacked a working prototype copied from StaticSite: static-site-with-backend.ts Tested with working dev + deploy.

Image:

[jayair]

Would putting a Router in front of both the static site and API work?

[NamesMT]

It might but basically anyone that looks at the result would yell (not in a good way).
Both StaticSite and Router creates a Cloudfront distribution (Cdn), so we'd put a Cloudfront in front of another Cloudfront.

[NamesMT]

I think the best way would be refactoring StaticSite or deprecating it and creates a new one which uses Router under the hood and exposes an arg to configure the routes, this allows for a DRY-er code and always align StaticSite routing behavior with Router if we update it. Or if you want it to be simpler we could re-implement the routes arg to StaticSite.

[NamesMT]

Alternatively could be solved with an improved Router in #340.

Maybe out of topic but would be great if we could implement an Assets component or improve Bucket to support building the static frontend for a better experience when using Router.

[jayair]

Yeah we need to review this a bit. It might need a design change.