WIP/RFC: Added support for running on Replit.com

[sflanker]

This is a work in progress / request for comment, and I don't expect this to be merged as is.

I wanted to explore a way to make it easier to contribute to the p5.js-web-editor project, and one what I thought that could be done would be to make it possible to run it and make changes on Replit.com

The nice thing about Replit.com is that anybody with a web browser-- even on a locked down chromebook, school computer, or tablet-- can edit and run server side code.

Here’s the P5.js web editor on Replit.com: https://replit.com/@KumuPaul/p5js-web-editor#developer_docs/replit.md

• Running live here: https://p5js-web-editor.kumupaul.repl.co/
• Note: this is a bare bones setup with no S3/Google+/Github/Mailgun
• Anybody could fork this Repl and make their own changes on Replit.com
• Also anybody could create a new Repl by importing my GitHub repo https://github.com/sflanker/p5.js-web-editor and following the instructions in the replit.md guide.

Potential Concerns

• Added Replit specific files (hopefully they won't confuse people or cause issues running in other environments)
• In order to host the preview site, it is necessary to map it to a same origin route (i.e. /preview).
  • Replit.com only supports hosting a site a single domain, no subdomains allowed
  • Replit.com only supports connections on a single port (cannot host preview site at 8002)
  • The obvious downside is that this deployment is insecure because sketches are always running in the same origin as the editor site itself but since this is just for development/testing 🤷‍♂️
• Replit.com does not support having a .env file
  • This is because the filesystem of a public Repl is publicly visible, so putting secrets in .env is inadvisable
  • Replit.com has its own mechanism for storing secrets in a way that is only accessible to the Repl owner and the running code (as environment variables)
  • For simplicity sake I created a file .env.replit that contains non-secret environment settings and sourced it using dotenv-cli, then configured the things that were actually secret as Replit.com secrets.
  • There may be alternative approaches.
• ???

Outstanding Issues

Resources

Replit.com has strict resource utilization limits, and the way I have set it up this deployment is currently perilously close to the limits of a Boosted, Hacker Plan REPL (Hacker plans cost $7 per month on Replit.com and come with 5 boosts).

The limits on RAM and Storage are the issues. The RAM issue primarily stems from the fact that I am running MongoDB locally in the Repl. I think this could be mitigated by updating the instructions to have the contributor set up external MongoDB hosting. External MongoDB would also help mitigate the storage space issues, but the size of node_modules is a big part of that. So looking for ways to pare down the dependency tree might also be helpful.

Documentation

I need to do some more work on the documentation for this environment.

[welcome[bot]]

🎉 Thanks for opening this pull request! Please check out our contributing guidelines if you haven't already.

[release-com[bot]]

Release Environments

This pull request environment is provided by Release, learn more! To see the status of the environment click on Environment Status below.

• p5.js-web-editor
  • app-ted18ef-p5-js-web-editor.rls.sh
  • preview-ted18ef-p5-js-web-editor.rls.sh

:wrench:Environment Status : https://app.releasehub.com/public/Processing%20Foundation/env-45e0646d0e

[raclim]

Thank you so much for your work on this so far!

Since some time has passed I'm going to close this for now, but I'd love to keep the idea of providing additional support for Replit up for discussion and further work! I moved this into an issue (https://github.com/processing/p5.js-web-editor/issues/2202) that links to this PR. Please feel free to reopen or revisit this in the future, thanks!