Frontity CodeSanbox Template

👨‍💻 Framework Development » Framework Design
1

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:

2

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?

3

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
4

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.

5

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
6

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

2 Likes
7

Great! Thanks @luisherranz :blush:

1 Like
8

Closed in favor of Frontity template in codesandbox UI.

9