StimulusReflex allows Rails developers to build reactive UIs without the need for SPAs like React. However, the server-side nature of Rails and SR has meant that - until now - it's been difficult to easily provide interactive examples that you can embed in a blog.
Enter... the StimulusReflex Sandbox.
Sandbox apps are based on sr mini, the single-file StimulusReflex-powered Rails app template. We gently oil and massage the sr_mini until it runs happily inside of a Glitch container. Glitch is similar to Codepen (or one of the many competitors) except that it also allows you to run a server-side VM, without any of the standard security concerns.
People are free to try the demo, inspect the code behind it and "remix" their own projects based on it. There is a summary post explaining how it's all set up on Dev.to.
You can see some great examples of SR Sandbox apps on the StimulusReflex Patterns site.
👉 The main sandbox site is here, which you can
- Ruby 3.0.1
- Rails 6.1.3.2
- StimulusReflex 3.5.0.pre1
- CableReady 5.0.0.pre1
- Redis 6.2.2
- NO database
- Tab isolation mode is on
You can embed a StimulusReflex Sandbox app into a post on dev.to with a simple short-code:
{% glitch stimulus-reflex-sandbox app %}
Occasionally, building the assets via snowpack will fail, so you'll have to open the Glitch terminal (bottom left under Tools):
and run
$ rm -rf node_modulesYour container will restart, installing fresh node modules, and the app should start correctly.
There is no database, due to the minimal and ephemeral nature of Glitch apps. However, nulldb is included so any persistence calls to ActiveRecord won't blow up the demo.
Feel free to emulate persistence using the session or Redis. If you feel adventurous, you can connect your sandbox to any external managed DB, though.