Templates

[alexnm]

Right now the sandpack packages have 3 templates hardcoded:

• react (boilerplate from create-react-app)
• vue (boilerplate from vue-cli)
• vanilla (parcel based setup)

Let's talk here about how to approach templates. There are two options.

Option 1: Short-term

We continue adding to the templates folder in the sandpack-react package. There's an open issue with a bunch of templates that could be useful. However, this is not really maintainable, nor scalable

Option 2: Long-term

Fetch templates from codesandbox to ensure we're always loading the latest when it comes to cra, vue-cli, etc.

[pomber]

I was thinking that using any existing sandbox as a template would be very useful.

const code = `export default function App() {
  return <h1>Hello World</h1>
}
`;

<Sandpack
  template="https://codesandbox.io/s/csb-id-bx70k"
  files={{
    "/App.js": code,
  }}
/>;

Does it make sense?

[alexnm]

We actually have an API endpoint that retrives public sandboxes, but we didn't have time to look into integrating API calls into sandpack. Have to see if there are any potential limitations/problems.

[alexnm]

Examples:

• https://codesandbox.io/api/v1/sandboxes/csb-id-bx70k/sandpack
• https://codesandbox.io/api/v1/sandboxes/react-new/sandpack

[pomber]

Cool, that API will save me a lot of work. Thanks!