Frontity CodeSanbox Template

It would be amazing to have support for codesandbox so people can try Frontity directly from their brower without having to install anything.

I have opened a repository for the codesandbox template: https://github.com/frontity/codesandbox-frontity

It can be loaded with this url: https://codesandbox.io/s/github/frontity/codesandbox-frontity

It works, but webpack isn’t catching the file changes and therefore not rebundling, so it’s pretty useless right now.

Any insight on how to make this work is welcomed :slight_smile:

Ok, maybe we can try following their guide to add templates: https://github.com/codesandbox/codesandbox-client/blob/master/contributor-docs/adding-template.md

Does somebody want to try?

I’d like to try this, @luisherranz. Right now I’m a little bit busy but I’ll take a look later to the templates guide.

2 Likes

I’ve been investigating this issue. It looks like CodeSandbox is fine, but it uses yarn instead of npm.

Yarn doesn’t behave the same way than npm when installing local packages:

  • npm install ./local-package: create a symlink.
  • yarn add ./local-package: copies the folder to the new destination.

For that reason, when you modify a file, webpack is able to pick up the changes if there is a symlink (npm) but not if the files are different (yarn).

This is a problem, not only for CodeSandbox, for anyone willing to use yarn instead of npm.

I’ve managed to make it work doing a manual symlink after the install :slight_smile:

You can check it out at in this link: https://codesandbox.io/s/github/frontity/codesandbox-frontity

2 Likes

Once the yarn problem is solved, we should submit the template to make it appear in the codensandbox menu:

2 Likes

Great! Thanks @luisherranz :blush:

1 Like