Creating a Browser-Based Terminal with Effect and Web Components
no one asked for this, but partly inspired from kit 
and his ansi output'd svgs I thought what a fun poc it would be to create a terminal for the browser.
https://proj-effect-box-web-components.vercel.app/ (near the bottom)
https://github.com/lloydrichards/proj_effect-box-web-components/blob/main/lib/components/prompt-terminal.ts
This is part of a recent dive into using effect with web-components but this is the CLI channel so maybe the interesting part here is how to represent terminal application in the web for demo purposes
While i love making little CLI tools, they are always a pain to show off without people installing them themselves.
The kind of top level explanations here:
1. state changes trigger effect
1.
1. Everything composed together with
1.
1.
TL;DR:
Have a play around and let me know what you think
and his ansi output'd svgs I thought what a fun poc it would be to create a terminal for the browser. https://proj-effect-box-web-components.vercel.app/ (near the bottom) https://github.com/lloydrichards/proj_effect-box-web-components/blob/main/lib/components/prompt-terminal.tsThis is part of a recent dive into using effect with web-components but this is the CLI channel so maybe the interesting part here is how to represent terminal application in the web for demo purposes
While i love making little CLI tools, they are always a pain to show off without people installing them themselves. The kind of top level explanations here:
1. state changes trigger effect
1.
effect-box for rendering TUI using ANSI1. Everything composed together with
Effect.all1.
fancyAnsi used to format Ansi into Html1.
lit renders the html as part of the web-component (<pre>)TL;DR:
State ā Effect[Box] ā Effect[ANSI string] ā HTML ā BrowserHave a play around and let me know what you think
